Sichtschutz, schwebende Stufen und Hoehenprofil nach Plandurchgang

Nach erneutem Detailstudium des Gartenplans und der Referenzbilder darin:

- Sichtschutz ist nicht durchgehend: 28 aufrechte Travertinstelen (50x6 cm,
  Dreiergruppen, Positionen direkt aus dem Plan) wechseln sich mit
  Eibengruppen ab, alle in einem Dekorkiesbett. Hoehe 1.80 m gegen den
  Suednachbarn, 1.50 m gegen Zollet auf der unteren Ebene.
- Zwei schwebende Travertinstufen fuehren vom gedeckten Sitzplatz (-0.02)
  auf den Hauptsitzplatz hinunter, als auskragende Platten mit Schattenfuge.
- Hoehenprofil auf zwei klare Ebenen gebracht: untere Ebene -0.33,
  Travertinsitzmauer mit 31 cm Ansicht, obere Ebene -0.02. Die Niveaus stehen
  fest in LEVELS statt aus streuenden Koten geschaetzt zu werden.
- Jede Hoehenkote gehoert neu zu genau einer Flaeche, der kleinsten, die sie
  enthaelt - sonst kippen benachbarte Ebenen ineinander.
- Der schmale Streifen am Sichtschutz ist Kiesbett, nicht Plattenbelag.
- Travertin nach den Referenzbildern deutlich heller, eigene Steintextur fuer
  die Stelen; Flammengrill als Stahlkubus mit Holzfach und Feueroeffnung.
- Stirnflaechen der Hecken hatten entartete UVs und zeigten Strahlenmuster.
- tools/plan-bilder.mjs zieht die Referenzfotos aus dem Plan-PDF.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

src/scene/textures.ts

@@ -223,7 +223,7 @@ function travertinFinish(ctx: CanvasRenderingContext2D, seed: number) {
   const rnd = mulberry32(seed + 7);
   // Poren und Adern, typisch fuer Travertin
   for (let i = 0; i < 900; i++) {
-    ctx.fillStyle = `rgba(120,105,84,${0.05 + rnd() * 0.10})`;
+    ctx.fillStyle = `rgba(146,130,104,${0.05 + rnd() * 0.09})`;
     ctx.beginPath();
     ctx.ellipse(rnd() * SIZE, rnd() * SIZE, 1 + rnd() * 5, 0.6 + rnd() * 1.6, rnd() * 0.6, 0, Math.PI * 2);
     ctx.fill();
@@ -242,7 +242,7 @@ function travertinFinish(ctx: CanvasRenderingContext2D, seed: number) {
 /** Travertinplatten 80 x 80 x 3 cm, Hauptsitzplatz. */
 export const travertin80 = () => makeRelief('travertin80', 3.2, 0.70, 3.2,
   (ctx) => {
-    slabs(ctx, 3.2, 0.8, 0.8, 'rgb(209,195,168)', 'rgb(158,145,124)', 0.010, 11, 7);
+    slabs(ctx, 3.2, 0.8, 0.8, 'rgb(224,214,192)', 'rgb(176,166,146)', 0.010, 11, 6);
     travertinFinish(ctx, 21);
   },
   (ctx) => slabHeight(ctx, 3.2, 0.8, 0.8, 0.010, 0.015));
@@ -250,7 +250,7 @@ export const travertin80 = () => makeRelief('travertin80', 3.2, 0.70, 3.2,
 /** Einzelne Travertinplatte 40 x 60 x 3 cm - Textur fuer die losen Platten. */
 export const travertinSlab = () => makeRelief('travertinSlab', 0.8, 0.70, 2.2,
   (ctx) => {
-    ctx.fillStyle = 'rgb(213,199,171)';
+    ctx.fillStyle = 'rgb(228,218,196)';
     ctx.fillRect(0, 0, SIZE, SIZE);
     travertinFinish(ctx, 26);
   },
@@ -259,7 +259,7 @@ export const travertinSlab = () => makeRelief('travertinSlab', 0.8, 0.70, 2.2,
 /** Travertinstellplatten als schmaler Randstreifen. */
 export const travertinstell = () => makeRelief('travertinstell', 2.4, 0.73, 3.0,
   (ctx) => {
-    slabs(ctx, 2.4, 0.4, 0.4, 'rgb(206,192,166)', 'rgb(155,144,124)', 0.012, 13, 8);
+    slabs(ctx, 2.4, 0.4, 0.4, 'rgb(221,210,188)', 'rgb(172,162,142)', 0.012, 13, 7);
     travertinFinish(ctx, 23);
   },
   (ctx) => slabHeight(ctx, 2.4, 0.4, 0.4, 0.012, 0.012));
@@ -422,7 +422,7 @@ export const spielsand = () => make('spielsand', 1.5, 1.0, (ctx) => {
  */
 export const travertinMauer = () => makeRelief('travertinMauer', 0.7, 0.68, 1.9,
   (ctx) => {
-    ctx.fillStyle = 'rgb(203,183,148)';
+    ctx.fillStyle = 'rgb(221,208,182)';
     ctx.fillRect(0, 0, SIZE, SIZE);
     const rnd = mulberry32(61);
     // liegende Sedimentbaender, bewusst zurueckhaltend - sonst wirkt der Stein
@@ -430,7 +430,7 @@ export const travertinMauer = () => makeRelief('travertinMauer', 0.7, 0.68, 1.9,
     for (let i = 0; i < 34; i++) {
       const y = rnd() * SIZE;
       const hgt = 3 + rnd() * 12;
-      ctx.fillStyle = `rgba(${(188 + rnd() * 20) | 0},${(168 + rnd() * 18) | 0},${(134 + rnd() * 16) | 0},0.35)`;
+      ctx.fillStyle = `rgba(${(206 + rnd() * 18) | 0},${(192 + rnd() * 16) | 0},${(166 + rnd() * 14) | 0},0.32)`;
       ctx.beginPath();
       ctx.moveTo(0, y);
       for (let x = 0; x <= SIZE; x += 24) ctx.lineTo(x, y + Math.sin(x / 55 + i) * 4);
@@ -654,3 +654,40 @@ function laub(key: string, base: string, seed: number, leaf: number): Belag {
 export const laubEibe = () => laub('laubEibe', 'rgb(64,92,52)', 201, 3.4);
 /** Liguster: mittelgruen, groesseres Blatt. */
 export const laubLiguster = () => laub('laubLiguster', 'rgb(85,118,55)', 211, 5.2);
+
+/**
+ * Travertin fuer die aufrechten Stelen. Der Stein ist gesaegt und zeigt die
+ * Schichtung als feine, liegende Baender - so wie auf dem Referenzbild des
+ * Planers. Die Kachel ist klein, weil eine Stele nur 50 cm breit ist.
+ */
+export const travertinStele = () => makeRelief('travertinStele', 0.5, 0.62, 1.7,
+  (ctx) => {
+    ctx.fillStyle = 'rgb(226,214,190)';
+    ctx.fillRect(0, 0, SIZE, SIZE);
+    const rnd = mulberry32(91);
+    for (let i = 0; i < 46; i++) {
+      const y = rnd() * SIZE;
+      const hgt = 2 + rnd() * 9;
+      ctx.fillStyle = `rgba(${(204 + rnd() * 22) | 0},${(190 + rnd() * 20) | 0},${(162 + rnd() * 18) | 0},0.42)`;
+      ctx.beginPath();
+      ctx.moveTo(0, y);
+      for (let x = 0; x <= SIZE; x += 32) ctx.lineTo(x, y + Math.sin(x / 70 + i) * 2.5);
+      for (let x = SIZE; x >= 0; x -= 32) ctx.lineTo(x, y + hgt + Math.sin(x / 62 + i * 1.4) * 2.5);
+      ctx.closePath();
+      ctx.fill();
+    }
+    travertinFinish(ctx, 92);
+    grain(ctx, 93, 0.04, 1);
+  },
+  (ctx) => {
+    ctx.fillStyle = 'rgb(196,196,196)';
+    ctx.fillRect(0, 0, SIZE, SIZE);
+    const rnd = mulberry32(94);
+    for (let i = 0; i < 1800; i++) {
+      ctx.fillStyle = `rgba(70,70,70,${0.15 + rnd() * 0.3})`;
+      ctx.beginPath();
+      ctx.ellipse(rnd() * SIZE, rnd() * SIZE, 0.7 + rnd() * 2.0, 0.5 + rnd() * 0.9, 0, 0, Math.PI * 2);
+      ctx.fill();
+    }
+    noiseTile(ctx, 95, 120, 0.06);
+  });