@ludra/cli 0.5.0 → 0.8.0

package/templates/platformer/scripts/hud.ts

@@ -0,0 +1,111 @@
+import type { DrawContext, Script } from "@ludra/core";
+
+const FONT = "Fredoka, system-ui, sans-serif";
+
+/** Text with a soft dark outline, so it reads over the sky and the ground alike. */
+function label(g: DrawContext["g"], text: string, x: number, y: number, size: number, color = "#fff7e6", weight = 600): void {
+  g.font = `${weight} ${size}px ${FONT}`;
+  g.lineJoin = "round";
+  g.lineWidth = size * 0.22;
+  g.strokeStyle = "rgba(14, 18, 40, 0.85)";
+  g.strokeText(text, x, y);
+  g.fillStyle = color;
+  g.fillText(text, x, y);
+}
+
+function star(g: DrawContext["g"], x: number, y: number, r: number): void {
+  g.beginPath();
+  for (let i = 0; i < 10; i++) {
+    const angle = -Math.PI / 2 + (i * Math.PI) / 5;
+    const radius = i % 2 === 0 ? r : r * 0.45;
+    g.lineTo(x + Math.cos(angle) * radius, y + Math.sin(angle) * radius);
+  }
+  g.closePath();
+  g.fillStyle = "#ffd166";
+  g.shadowColor = "#ffb347";
+  g.shadowBlur = 10;
+  g.fill();
+  g.shadowBlur = 0;
+}
+
+function heart(g: DrawContext["g"], x: number, y: number, size: number, full: boolean): void {
+  g.beginPath();
+  g.moveTo(x, y + size * 0.3);
+  g.bezierCurveTo(x, y - size * 0.2, x - size, y - size * 0.2, x - size, y + size * 0.3);
+  g.bezierCurveTo(x - size, y + size * 0.75, x, y + size, x, y + size * 1.2);
+  g.bezierCurveTo(x, y + size, x + size, y + size * 0.75, x + size, y + size * 0.3);
+  g.bezierCurveTo(x + size, y - size * 0.2, x, y - size * 0.2, x, y + size * 0.3);
+  g.fillStyle = full ? "#ff5d73" : "rgba(255, 255, 255, 0.18)";
+  g.fill();
+}
+
+/**
+ * The interface: hearts for lives, points (coins and stomps), a title card for the level
+ * (params.title, params.level) and the end screens. A won level with a next
+ * scene says so; the last one celebrates the whole run.
+ */
+export default {
+  drawUI({ g, world, view, time, recent, params }) {
+    // Lives: a heart pops when one is lost.
+    const hurt = recent("die", 0.4).at(-1);
+    const maxLives = Math.max(world.lives ?? 0, params.lives as number);
+    for (let i = 0; i < maxLives; i++) {
+      const full = i < (world.lives ?? 0);
+      const pop = !full && hurt && i === world.lives ? 1 + 0.6 * (1 - (time - hurt.time) / 0.4) : 1;
+      heart(g, 34 + i * 30, 22, 9 * pop, full);
+    }
+
+    // Points, with a hop whenever some are earned.
+    const got = [...recent("collect", 0.3), ...recent("stomp", 0.3)].sort((a, b) => a.time - b.time).at(-1);
+    const bounce = got ? Math.sin(((time - got.time) / 0.3) * Math.PI) * 6 : 0;
+    star(g, 35, 61 - bounce, 11);
+    g.textAlign = "left";
+    label(g, `${world.score}`, 54, 68 - bounce * 0.5, 22);
+
+    // Title card.
+    if (time < 2.6 && !world.won) {
+      g.globalAlpha = Math.min(1, (2.6 - time) / 0.8);
+      g.textAlign = "center";
+      label(g, `Level ${params.level}`, view.width / 2, view.height / 2 - 46, 20, "#ffd166");
+      label(g, String(params.title), view.width / 2, view.height / 2, 52, "#fff7e6", 700);
+      g.globalAlpha = 1;
+    }
+
+    // A checkpoint caught: a short note under the hearts.
+    const saved = recent("checkpoint", 1.6).at(-1);
+    if (saved) {
+      g.globalAlpha = Math.min(1, (1.6 - (time - saved.time)) / 0.5);
+      g.textAlign = "left";
+      label(g, "Checkpoint!", 24, 100, 16, "#ffd166");
+      g.globalAlpha = 1;
+    }
+
+    g.textAlign = "right";
+    label(g, "M sound  ·  R restart", view.width - 20, view.height - 16, 12, "rgba(255, 247, 230, 0.55)", 500);
+
+    const end = recent(world.won ? "win" : "gameover", 1e9).at(-1);
+    if (world.won || world.lost) {
+      const since = end ? time - end.time : 0;
+      g.fillStyle = `rgba(10, 12, 30, ${Math.min(0.6, since)})`;
+      g.fillRect(0, 0, view.width, view.height);
+      g.globalAlpha = Math.min(1, since * 2);
+      g.textAlign = "center";
+      // Each line rises into place.
+      const rise = Math.max(0, 1 - since * 2.5) * 20;
+      if (world.lost) {
+        label(g, "Game over", view.width / 2, view.height / 2 - 6 + rise, 56, "#ff8fa0", 700);
+        label(g, `${world.score} point${world.score === 1 ? "" : "s"} this run`, view.width / 2, view.height / 2 + 34 + rise, 20);
+        label(g, "Press R to start over", view.width / 2, view.height / 2 + 68 + rise, 15, "rgba(255, 247, 230, 0.7)", 500);
+      } else if (world.exit !== undefined) {
+        label(g, "Level clear!", view.width / 2, view.height / 2 - 6 + rise, 56, "#7cf29c", 700);
+        label(g, "On to the next one…", view.width / 2, view.height / 2 + 34 + rise, 20);
+      } else {
+        label(g, "You made it home!", view.width / 2, view.height / 2 - 6 + rise, 56, "#7cf29c", 700);
+        const falls = world.deaths === 0 ? "without a single fall" : `with ${world.deaths} fall${world.deaths === 1 ? "" : "s"}`;
+        label(g, `${world.score} points, ${falls}`, view.width / 2, view.height / 2 + 34 + rise, 20);
+        label(g, "Press R to play this level again", view.width / 2, view.height / 2 + 68 + rise, 15, "rgba(255, 247, 230, 0.7)", 500);
+      }
+      g.globalAlpha = 1;
+    }
+  },
+} satisfies Script;

package/templates/platformer/scripts/lantern.ts

@@ -0,0 +1,35 @@
+import type { Script } from "@ludra/core";
+
+/**
+ * Lights the checkpoint's lantern once the player has touched it: a flickering
+ * flame and warm light on the grass, so players can see where they'll respawn.
+ */
+export default {
+  draw({ g, self, time, recent }) {
+    const lit = recent("checkpoint", 1e9).find((e) => (e.data as { checkpoint: string }).checkpoint === self.id);
+    // The lantern hangs at the top left of the post.
+    const x = self.x - 6;
+    const y = self.y - self.height / 2 + 19;
+    if (!lit) return;
+
+    const since = time - lit.time;
+    const flicker = 1 + Math.sin(time * 13) * 0.06 + Math.sin(time * 7.7) * 0.05;
+    // A burst of light when it first catches, settling into a steady glow.
+    const flare = Math.max(0, 1 - since * 1.5);
+    const radius = (70 + flare * 60) * flicker;
+    g.globalCompositeOperation = "lighter";
+    const light = g.createRadialGradient(x, y, 2, x, y, radius);
+    light.addColorStop(0, `rgba(255, 200, 110, ${0.55 + flare * 0.3})`);
+    light.addColorStop(1, "rgba(255, 160, 60, 0)");
+    g.fillStyle = light;
+    g.fillRect(x - radius, y - radius, radius * 2, radius * 2);
+
+    g.globalCompositeOperation = "source-over";
+    g.fillStyle = "#ffd166";
+    g.shadowColor = "#ffb347";
+    g.shadowBlur = 14;
+    g.beginPath();
+    g.ellipse(x, y + 1, 2.5 * flicker, 4 * flicker, 0, 0, Math.PI * 2);
+    g.fill();
+  },
+} satisfies Script;

package/templates/platformer/shaders/glow.frag

@@ -0,0 +1,29 @@
+// A storybook night: soft bloom so the moon, coins and lanterns glow, a gentle
+// blue-shadow / warm-highlight grade, and a vignette.
+// The engine declares u_image, u_resolution, u_time and v_uv, plus every
+// uniform listed under "postfx.uniforms" in the scene.
+
+void main() {
+  vec2 pixel = 1.0 / u_resolution;
+  vec3 color = texture2D(u_image, v_uv).rgb;
+
+  // Gaussian-weighted taps: far taps count less, so thin bright text doesn't leave a dotted grid.
+  vec3 glow = vec3(0.0);
+  float total = 0.0;
+  for (int i = -5; i <= 5; i++) {
+    for (int j = -5; j <= 5; j++) {
+      float weight = exp(-float(i * i + j * j) / 12.0);
+      glow += max(texture2D(u_image, v_uv + vec2(float(i), float(j)) * pixel * 2.0).rgb - 0.55, 0.0) * weight;
+      total += weight;
+    }
+  }
+  color += glow / total * bloom;
+
+  float luma = dot(color, vec3(0.299, 0.587, 0.114));
+  color = mix(color * vec3(0.92, 0.97, 1.1), color * vec3(1.06, 1.0, 0.9), smoothstep(0.25, 0.85, luma) * warmth);
+
+  vec2 centered = v_uv - 0.5;
+  color *= 1.0 - vignette * dot(centered, centered) * 1.4;
+
+  gl_FragColor = vec4(color, 1.0);
+}

package/templates/platformer/tests/gameplay.test.json

@@ -3,34 +3,72 @@
     {
       "name": "player rests on the ground",
       "duration": "1s",
-      "assert": ["player.grounded == true", "player.y == 482", "deaths == 0"]
+      "assert": [
+        "player.grounded == true",
+        "player.y == 482",
+        "deaths == 0"
+      ]
     },
     {
       "name": "player runs right",
       "inputs": "right:1s",
-      "assert": ["player.x > 300 at 1s", "player.grounded == true at 1s"]
+      "assert": [
+        "player.x > 300 at 1s",
+        "player.grounded == true at 1s"
+      ]
     },
     {
       "name": "jumping leaves the ground and lands again",
       "inputs": "wait:0.2s, jump:0.4s",
-      "assert": ["events.jump == 1", "player.y < 400 at 0.5s", "player.grounded == true at end"]
+      "assert": [
+        "events.jump == 1",
+        "player.y < 400 at 0.5s",
+        "player.grounded == true at end"
+      ]
     },
     {
       "name": "spikes kill the player, who respawns at the start",
       "inputs": "right:1.85s",
       "duration": "2s",
-      "assert": ["deaths == 1", "events.die == 1", "player.x < 200"]
+      "assert": [
+        "deaths == 1",
+        "events.die == 1",
+        "player.x < 200",
+        "lives == 2"
+      ]
     },
     {
       "name": "the lift carries the player over the pit",
       "inputs": "right:0.3s, right+jump:0.45s, right:0.85s, right+jump:0.45s, right:0.35s, right+jump:0.45s, right:0.18s",
       "duration": "4s",
-      "assert": ["coin-2.exists == false", "player.grounded == true", "player.x > 860", "deaths == 0"]
+      "assert": [
+        "coin-2.exists == false",
+        "player.grounded == true",
+        "player.x > 860",
+        "deaths == 0"
+      ]
     },
     {
-      "name": "the level can be completed without dying",
+      "name": "Night Meadow can be completed without dying",
       "inputs": "right:0.3s, right+jump:0.45s, right:0.85s, right+jump:0.45s, right:0.35s, right+jump:0.45s, right:0.18s, wait:1.0s, right+jump:0.45s, right:0.3s, wait:0.6s, right+jump:0.45s, right:0.1s, wait:0.6s, right:0.7s, right+jump:0.45s, right:0.2s, right+jump:0.45s, right:1.5s",
-      "assert": ["won == true", "deaths == 0", "score == 4", "events.stomp == 1", "slime.exists == false"]
+      "assert": [
+        "won == true",
+        "deaths == 0",
+        "score == 4",
+        "events.stomp == 1",
+        "slime.exists == false",
+        "events.checkpoint == 1"
+      ]
+    },
+    {
+      "name": "three falls end the game",
+      "inputs": "right:7s",
+      "assert": [
+        "deaths == 3",
+        "lives == 0",
+        "lost == true",
+        "events.gameover == 1"
+      ]
     }
   ]
 }

package/templates/platformer/tests/level-2.test.json

@@ -0,0 +1,49 @@
+{
+  "tests": [
+    {
+      "name": "level 2 starts from the coin and slime prefabs",
+      "scene": "scenes/level-2.scene.json",
+      "inputs": "right:1s",
+      "assert": [
+        "coin-1.exists == false",
+        "score == 1",
+        "slime-1.x > 380"
+      ]
+    },
+    {
+      "name": "the first slime can be stomped across a wide window",
+      "scene": "scenes/level-2.scene.json",
+      "inputs": "right:1s, wait:0.6s, right+jump:0.45s, right:0.5s",
+      "assert": [
+        "events.stomp == 1",
+        "slime-1.exists == false",
+        "deaths == 0"
+      ]
+    },
+    {
+      "name": "after the lantern, a fall respawns the player there",
+      "scene": "scenes/level-2.scene.json",
+      "inputs": "right:1s, wait:0.73s, right+jump:0.45s, right:0.7s, wait:0.1s, right+jump:0.45s, right:0.3s, wait:0.1s, right:1.8s",
+      "duration": "7s",
+      "assert": [
+        "events.checkpoint == 1",
+        "deaths == 1",
+        "lives == 2",
+        "player.x == 760",
+        "player.grounded == true"
+      ]
+    },
+    {
+      "name": "Moonlit Cliffs can be completed without dying",
+      "scene": "scenes/level-2.scene.json",
+      "inputs": "right:1s, wait:0.73s, right+jump:0.45s, right:0.7s, wait:0.1s, right+jump:0.45s, right:0.3s, wait:0.1s, right+jump:0.45s, right:0.2s, wait:0.1s, right:0.3s, right+jump:0.45s, right:0.5s, wait:1.5s, right+jump:0.45s, right:1.5s",
+      "assert": [
+        "won == true",
+        "deaths == 0",
+        "score == 6",
+        "events.stomp == 2",
+        "events.checkpoint == 1"
+      ]
+    }
+  ]
+}

package/templates/topdown/CLAUDE.md

@@ -0,0 +1,39 @@
+# {{name}}
+
+A top-down game built with Ludra, a game engine designed for AI agents.
+
+## Layout
+
+- `ludra.json`: project config (name, entry scene, window size)
+- `scenes/main.scene.json`: the level, seen from above. Entities are made of components; `effects` adds particles, sound and shake to game events.
+- `assets/`: SVG art. Spritesheets are frames side by side; tiles repeat.
+- `scripts/`: TypeScript. `night.ts` draws the darkness, the lantern, colored lights and fireflies; `portal.ts` the vortex; `hud.ts` the whole interface. Run `npx @ludra/cli components script` for the API.
+- `shaders/dream.frag`: the post-processing shader (bloom, warm/cool grade, vignette).
+- `tests/*.test.json`: gameplay tests, run headlessly
+
+## Loop
+
+1. Edit `scenes/main.scene.json`. Run `npx @ludra/cli components` for every component and field, and `npx @ludra/cli blocks` for ready-made pieces you can drop in with `npx @ludra/cli add <block> --at x,y`.
+2. Run `npx @ludra/cli check` after every edit. Each problem names the JSON path and a fix.
+3. Run `npx @ludra/cli play --inputs "right:1s, up:0.5s" --ascii` to see what actually happens. Add `--screenshot 0.5s,end` to save real rendered frames to `screenshots/` and look at them.
+4. Write the behavior you want into `tests/*.test.json` and run `npx @ludra/cli test`.
+5. Run `npx @ludra/cli review` and fix every issue it lists: it catches what makes a game feel unfinished (untested mechanics, silent events, the default HUD, flat looks).
+6. Run `npx @ludra/cli dev` so a human can play it in the browser.
+
+Never call a change done until `ludra check`, `ludra test` and `ludra review` are all clean.
+
+## Rules of thumb
+
+- Coordinates are entity centers in pixels; +y is down. The world has no gravity (`"gravity": 0`).
+- The hero uses `topdown`: arrow keys move it in 8 directions at `speed` px/s. Inputs like `"right+up:0.5s"` move diagonally. A `dynamic` body collides with walls.
+- Walls are `static` bodies. Hazards, collectibles and goals need `"sensor": true`.
+- Enemies are kinematic sensor bodies with a `patrol` (`axis` "x" or "y") and a `hazard`. In top-down games they can't be stomped.
+- A floor is an entity with only a tiled `sprite` (no body) on `layer` -1, sized to the world.
+- The level is done when a test proves `won == true` with `deaths == 0`, and every enemy crossing works across a wide timing window (sweep `wait:` values with `play`).
+- Art and effects never change gameplay. Make it playable first, then dress it. Write new art as SVG in `assets/`.
+
+## Looks
+
+The sprites are SVG; the mood comes from code. `night.ts` lights the scene (keep every hazard lit in its warning color), and the scene loads the Cinzel font and runs `shaders/dream.frag`.
+
+There are no limits on looks. A script's `draw(ctx)` paints with the real Canvas 2D context (`ctx.g`), `drawUI(ctx)` replaces the HUD, `"fonts"` loads Google Fonts, and `"postfx"` runs a GLSL shader over every frame. Run `npx @ludra/cli components script` for the API. Draw hooks only paint: they can't change the game, so tests stay valid. After every visual change, look at real frames with `play --screenshot`.

package/templates/topdown/_gitignore

@@ -0,0 +1,2 @@
+node_modules/
+screenshots/

package/templates/topdown/assets/gem.svg

@@ -0,0 +1,16 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="40" height="20" viewBox="0 0 40 20">
+  <!-- Spritesheet: 2 frames of 20x20, a shimmering crystal. -->
+  <g>
+    <path d="M10 1 L18 8 L10 19 L2 8 Z" fill="#4cc9f0"/>
+    <path d="M10 1 L18 8 L10 8 Z" fill="#a5ecff"/>
+    <path d="M2 8 L10 8 L10 19 Z" fill="#2c8fb5"/>
+    <circle cx="7" cy="6" r="1.2" fill="#ffffff"/>
+  </g>
+  <g transform="translate(20 0)">
+    <path d="M10 1 L18 8 L10 19 L2 8 Z" fill="#7fe0ff"/>
+    <path d="M10 1 L18 8 L10 8 Z" fill="#e0faff"/>
+    <path d="M2 8 L10 8 L10 19 Z" fill="#3aa6c8"/>
+    <circle cx="13" cy="5" r="1.4" fill="#ffffff"/>
+    <circle cx="7" cy="12" r="0.8" fill="#ffffff"/>
+  </g>
+</svg>

package/templates/topdown/assets/grass.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40">
+  <!-- Tile: soft grass with a few flowers, the floor of the grove. -->
+  <rect width="40" height="40" fill="#2f5a3a"/>
+  <path d="M4 10 l1 -3 l1 3 M22 6 l1 -3 l1 3 M31 24 l1 -3 l1 3 M9 31 l1 -3 l1 3 M17 19 l1 -3 l1 3" stroke="#3f7a4c" stroke-width="1.2" fill="none"/>
+  <circle cx="28" cy="12" r="1.6" fill="#ffd166"/>
+  <circle cx="12" cy="24" r="1.4" fill="#ff9fb2"/>
+  <circle cx="35" cy="35" r="1.2" fill="#cfd8ff"/>
+</svg>

package/templates/topdown/assets/hedge.svg

@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
+  <!-- Tile: a dense hedge, seen from above. Walls of the grove. -->
+  <rect width="20" height="20" fill="#2d6a3e"/>
+  <circle cx="5" cy="5" r="5" fill="#3f8a50"/>
+  <circle cx="15" cy="6" r="5" fill="#357a46"/>
+  <circle cx="10" cy="14" r="6" fill="#3f8a50"/>
+  <circle cx="4" cy="4" r="1.6" fill="#5fbf6a"/>
+  <circle cx="13" cy="12" r="1.8" fill="#5fbf6a"/>
+  <circle cx="17" cy="17" r="1" fill="#1f4d2c"/>
+</svg>

package/templates/topdown/assets/hero.svg

@@ -0,0 +1,23 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="48" height="24" viewBox="0 0 48 24">
+  <!-- Spritesheet: 2 frames of 24x24, a hooded explorer seen from above, facing right. -->
+  <g>
+    <ellipse cx="12" cy="20" rx="8" ry="3" fill="#0f2418" opacity="0.5"/>
+    <rect x="6" y="17" width="5" height="5" rx="2" fill="#3f5a8a"/>
+    <rect x="13" y="17" width="5" height="5" rx="2" fill="#3f5a8a"/>
+    <circle cx="12" cy="12" r="8" fill="#ff9f68"/>
+    <path d="M4 12 a8 8 0 0 1 16 0 l-3 -1 a5 5 0 0 0 -10 0 z" fill="#e8613c"/>
+    <circle cx="14.5" cy="12" r="1.6" fill="#1d2333"/>
+    <circle cx="18" cy="12" r="1.6" fill="#1d2333"/>
+    <rect x="2" y="9" width="3" height="7" rx="1.5" fill="#c2492a"/>
+  </g>
+  <g transform="translate(24 0)">
+    <ellipse cx="12" cy="20" rx="8" ry="3" fill="#0f2418" opacity="0.5"/>
+    <rect x="5" y="16" width="5" height="5" rx="2" fill="#3f5a8a"/>
+    <rect x="14" y="18" width="5" height="5" rx="2" fill="#3f5a8a"/>
+    <circle cx="12" cy="11" r="8" fill="#ff9f68"/>
+    <path d="M4 11 a8 8 0 0 1 16 0 l-3 -1 a5 5 0 0 0 -10 0 z" fill="#e8613c"/>
+    <circle cx="14.5" cy="11" r="1.6" fill="#1d2333"/>
+    <circle cx="18" cy="11" r="1.6" fill="#1d2333"/>
+    <rect x="2" y="8" width="3" height="7" rx="1.5" fill="#c2492a"/>
+  </g>
+</svg>

package/templates/topdown/assets/portal.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="80" height="40" viewBox="0 0 80 40">
+  <!-- Spritesheet: 2 frames of 40x40, a swirling exit portal set in stone. -->
+  <g>
+    <circle cx="20" cy="20" r="18" fill="#56658f"/>
+    <circle cx="20" cy="20" r="14" fill="#7b2cbf"/>
+    <path d="M20 8 a12 12 0 0 1 0 24 a6 6 0 0 1 0 -12 a3 3 0 0 0 0 -6" fill="#c77dff"/>
+    <circle cx="20" cy="20" r="3" fill="#f3d9ff"/>
+  </g>
+  <g transform="translate(40 0)">
+    <circle cx="20" cy="20" r="18" fill="#56658f"/>
+    <circle cx="20" cy="20" r="14" fill="#7b2cbf"/>
+    <path d="M32 20 a12 12 0 0 1 -24 0 a6 6 0 0 1 12 0 a3 3 0 0 0 6 0" fill="#c77dff"/>
+    <circle cx="20" cy="20" r="4" fill="#f3d9ff"/>
+  </g>
+</svg>

package/templates/topdown/assets/slime.svg

@@ -0,0 +1,21 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="64" height="26" viewBox="0 0 64 26">
+  <!-- Spritesheet: 2 frames of 32x26, a bouncing slime facing right. -->
+  <g>
+    <path d="M2 25 C 2 10, 8 3, 16 3 C 24 3, 30 10, 30 25 Z" fill="#c77dff"/>
+    <path d="M5 25 C 5 18, 9 14, 13 14 C 9 17, 8 21, 8 25 Z" fill="#e0b0ff" opacity="0.7"/>
+    <path d="M14 11 l 6 2" stroke="#2a1440" stroke-width="2" stroke-linecap="round"/>
+    <path d="M27 11 l -4 2" stroke="#2a1440" stroke-width="2" stroke-linecap="round"/>
+    <circle cx="18" cy="15" r="2" fill="#2a1440"/>
+    <circle cx="24" cy="15" r="2" fill="#2a1440"/>
+    <path d="M17 20 q 4 2 8 0" stroke="#2a1440" stroke-width="1.5" fill="none" stroke-linecap="round"/>
+  </g>
+  <g transform="translate(32 0)">
+    <path d="M0 25 C 0 14, 7 8, 16 8 C 25 8, 32 14, 32 25 Z" fill="#c77dff"/>
+    <path d="M3 25 C 3 20, 7 17, 11 17 C 7 19, 6 22, 6 25 Z" fill="#e0b0ff" opacity="0.7"/>
+    <path d="M14 15 l 6 2" stroke="#2a1440" stroke-width="2" stroke-linecap="round"/>
+    <path d="M28 15 l -4 2" stroke="#2a1440" stroke-width="2" stroke-linecap="round"/>
+    <circle cx="18" cy="18.5" r="2" fill="#2a1440"/>
+    <circle cx="24.5" cy="18.5" r="2" fill="#2a1440"/>
+    <path d="M17 22.5 q 4 1.5 8 0" stroke="#2a1440" stroke-width="1.5" fill="none" stroke-linecap="round"/>
+  </g>
+</svg>

package/templates/topdown/assets/thorns.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
+  <!-- Tile: a patch of thorns, seen from above. Deadly. -->
+  <rect width="20" height="20" fill="#4a2a35"/>
+  <path d="M5 5 l-3 -3 M5 5 l3 -3 M5 5 l0 4" stroke="#ff5d73" stroke-width="1.6" stroke-linecap="round"/>
+  <path d="M15 12 l-3 -3 M15 12 l3 -3 M15 12 l0 4" stroke="#ff5d73" stroke-width="1.6" stroke-linecap="round"/>
+  <path d="M6 16 l-2 -2 M6 16 l2 -2" stroke="#ff8fa0" stroke-width="1.4" stroke-linecap="round"/>
+</svg>

package/templates/topdown/ludra.json

@@ -0,0 +1,5 @@
+{
+  "name": "{{name}}",
+  "entry": "scenes/main.scene.json",
+  "window": { "width": 960, "height": 540 }
+}

package/templates/topdown/package.json

@@ -0,0 +1,13 @@
+{
+  "name": "{{name}}",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "ludra dev",
+    "check": "ludra check",
+    "test": "ludra test"
+  },
+  "devDependencies": {
+    "@ludra/cli": "^0.8.0"
+  }
+}