npm - @echomem/mcp - Versions diffs - 1.4.8 → 1.4.9 - Mend

@echomem/mcp 1.4.8 → 1.4.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (36) hide show

package/README.md +23 -3
package/assets/canonical-scorer/README.md +18 -0
package/assets/canonical-scorer/analyze-10-problems.mjs +857 -0
package/assets/canonical-scorer/build-session-waste-dashboard.mjs +1628 -0
package/assets/canonical-scorer/golden_anchors.mjs +83 -0
package/assets/canonical-scorer/optimizable_detail.mjs +633 -0
package/dist/city/chaos-to-clarity-pencil.html +582 -0
package/dist/city/echo-ai-city-only.html +1104 -105
package/dist/city/echo-ai-city-only.template.html +1104 -105
package/dist/city/pencil-pie-generator.html +883 -0
package/dist/city/pencil-webgl-landscape.html +1239 -0
package/dist/city/spatial-fan-story.html +479 -0
package/dist/codex-session-files.js +283 -0
package/dist/codex-sync.js +7 -2
package/dist/context-analysis/canonical-golden.js +47 -0
package/dist/context-analysis/claude-native-canonical.js +1193 -0
package/dist/context-analysis/vendored-canonical.js +793 -0
package/dist/context-analysis/workspace-report.js +1838 -0
package/dist/context-metrics/calculate.js +56 -0
package/dist/context-metrics/model-limits.js +26 -0
package/dist/context-metrics/types.js +1 -0
package/dist/forensics-10-problems.js +7 -6
package/dist/forensics.js +863 -132
package/dist/hud/adapters.js +8 -4
package/dist/hud/metric.js +13 -4
package/dist/hud/monitor.js +135 -16
package/dist/hud/web.js +344 -298
package/dist/index.js +7 -3
package/dist/local-data-paths.js +87 -0
package/dist/migrate.js +37 -29
package/dist/report.js +101 -40
package/dist/setup-page.js +3290 -196
package/dist/setup-preview.js +245 -0
package/dist/setup.js +432 -34
package/package.json +5 -4
package/templates/echomem-recall.md +2 -2

package/dist/city/chaos-to-clarity-pencil.html ADDED Viewed

@@ -0,0 +1,582 @@
+<!doctype html>
+<html lang="zh-CN">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Chaos to Clarity — Pencil Study</title>
+  <style>
+    * { box-sizing: border-box; }
+    html, body { min-height: 100%; }
+    body {
+      margin: 0;
+      display: grid;
+      place-items: center;
+      padding: clamp(12px, 4vw, 48px);
+      background: #d8d4ca;
+    }
+    .sheet {
+      position: relative;
+      width: min(92vw, 900px);
+      aspect-ratio: 1;
+      overflow: hidden;
+      background: #f2eee4;
+      box-shadow: 0 24px 70px rgba(39, 38, 31, .18), 0 2px 5px rgba(39, 38, 31, .12);
+    }
+    canvas {
+      display: block;
+      width: 100%;
+      height: 100%;
+    }
+  </style>
+</head>
+<body>
+  <main class="sheet" aria-label="混乱经过透镜转化为清晰方向的铅笔插画">
+    <canvas id="art" width="1200" height="1200"></canvas>
+  </main>
+  <script>
+    const canvas = document.getElementById("art");
+    const g = canvas.getContext("2d");
+    const TAU = Math.PI * 2;
+    const ink = "#292a25";
+    const paper = "#f2eee4";
+    function randomFactory(seed) {
+      return function random() {
+        let t = seed += 0x6D2B79F5;
+        t = Math.imul(t ^ t >>> 15, t | 1);
+        t ^= t + Math.imul(t ^ t >>> 7, t | 61);
+        return ((t ^ t >>> 14) >>> 0) / 4294967296;
+      };
+    }
+    function pencil(path, width = 2, alpha = .72, repeats = 2, seed = 1) {
+      const random = randomFactory(seed);
+      for (let i = 0; i < repeats; i++) {
+        g.save();
+        g.translate((random() - .5) * 2.1, (random() - .5) * 1.6);
+        path();
+        g.strokeStyle = ink;
+        g.globalAlpha = alpha / Math.max(1, repeats * .7);
+        g.lineWidth = width + random() * .7;
+        g.lineCap = "round";
+        g.lineJoin = "round";
+        g.stroke();
+        g.restore();
+      }
+    }
+    function line(x1, y1, x2, y2, width = 1.5, alpha = .6, seed = 1) {
+      pencil(() => {
+        g.beginPath();
+        g.moveTo(x1, y1);
+        g.lineTo(x2, y2);
+      }, width, alpha, 2, seed);
+    }
+    function poly(points, close = false, width = 1.8, alpha = .7, seed = 1) {
+      pencil(() => {
+        g.beginPath();
+        g.moveTo(points[0][0], points[0][1]);
+        for (let i = 1; i < points.length; i++) g.lineTo(points[i][0], points[i][1]);
+        if (close) g.closePath();
+      }, width, alpha, 2, seed);
+    }
+    function ellipse(cx, cy, rx, ry, width = 1.7, alpha = .68, seed = 1) {
+      pencil(() => {
+        g.beginPath();
+        g.ellipse(cx, cy, rx, ry, 0, 0, TAU);
+      }, width, alpha, 2, seed);
+    }
+    function arrow(x1, y1, x2, y2, seed = 1, alpha = .68) {
+      line(x1, y1, x2, y2, 1.5, alpha, seed);
+      const angle = Math.atan2(y2 - y1, x2 - x1);
+      const size = 12;
+      poly([
+        [x2 - Math.cos(angle - .55) * size, y2 - Math.sin(angle - .55) * size],
+        [x2, y2],
+        [x2 - Math.cos(angle + .55) * size, y2 - Math.sin(angle + .55) * size]
+      ], false, 1.5, alpha, seed + 2);
+    }
+    /*
+      PencilLight is the reusable drawing model for this document.
+      1. Curve tangent = direction of the form.
+      2. Curve normal = candidate side for light or shadow.
+      3. Depth controls width, contrast and spacing: far is thin/light/open;
+         near is heavier/darker/closer.
+      4. Shadow is made from continuous pressure strokes following the form,
+         never from mechanical dashed fills.
+      5. A ribbon is a perspective surface: its two edges come from the curve
+         normal, while its width grows toward the viewer.
+    */
+    const PencilLight = Object.freeze({
+      light: { x: -.82, y: -.57 },
+      cubic(p0, p1, p2, p3, steps = 36) {
+        const points = [];
+        for (let i = 0; i <= steps; i++) {
+          const t = i / steps;
+          const u = 1 - t;
+          points.push({
+            x: u*u*u*p0.x + 3*u*u*t*p1.x + 3*u*t*t*p2.x + t*t*t*p3.x,
+            y: u*u*u*p0.y + 3*u*u*t*p1.y + 3*u*t*t*p2.y + t*t*t*p3.y,
+            depth: t
+          });
+        }
+        return points;
+      },
+      frames(points) {
+        return points.map((point, i) => {
+          const a = points[Math.max(0, i - 1)];
+          const b = points[Math.min(points.length - 1, i + 1)];
+          const tx = b.x - a.x;
+          const ty = b.y - a.y;
+          const length = Math.hypot(tx, ty) || 1;
+          return { ...point, tx: tx / length, ty: ty / length, nx: -ty / length, ny: tx / length };
+        });
+      },
+      curve(points, { width = 1.4, alpha = .58, seed = 1, repeats = 2 } = {}) {
+        pencil(() => {
+          g.beginPath();
+          g.moveTo(points[0].x, points[0].y);
+          for (let i = 1; i < points.length; i++) g.lineTo(points[i].x, points[i].y);
+        }, width, alpha, repeats, seed);
+      },
+      ribbon(points, widthAt, { seed = 1 } = {}) {
+        const frames = this.frames(points);
+        const left = [];
+        const right = [];
+        frames.forEach((frame, i) => {
+          const half = widthAt(frame.depth, i) * .5;
+          left.push({ x: frame.x + frame.nx * half, y: frame.y + frame.ny * half });
+          right.push({ x: frame.x - frame.nx * half, y: frame.y - frame.ny * half });
+        });
+        g.beginPath();
+        g.moveTo(left[0].x, left[0].y);
+        for (let i = 1; i < left.length; i++) g.lineTo(left[i].x, left[i].y);
+        for (let i = right.length - 1; i >= 0; i--) g.lineTo(right[i].x, right[i].y);
+        g.closePath();
+        g.fillStyle = "rgba(244,241,233,.96)";
+        g.fill();
+        this.curve(left, { width: 1.2, alpha: .54, seed });
+        this.curve(right, { width: 1.2, alpha: .54, seed: seed + 1 });
+        // The edge whose normal points away from the light receives pressure.
+        const mid = frames[Math.floor(frames.length * .58)];
+        const shadowSign = mid.nx * -this.light.x + mid.ny * -this.light.y >= 0 ? 1 : -1;
+        const shadowEdge = shadowSign > 0 ? left : right;
+        for (let band = 0; band < 4; band++) {
+          const shaded = shadowEdge.map((point, i) => {
+            const frame = frames[i];
+            const depth = frame.depth;
+            const distance = 2 + band * (2.2 + depth * 1.8);
+            return {
+              x: point.x + frame.nx * shadowSign * distance,
+              y: point.y + frame.ny * shadowSign * distance
+            };
+          });
+          this.curve(shaded, {
+            width: .75 + band * .08,
+            alpha: .34 - band * .055,
+            seed: seed + 20 + band,
+            repeats: 1
+          });
+        }
+      },
+      slopeFacet({ ridge, foot, spread, strokes, darkness, seed }) {
+        const random = randomFactory(seed);
+        for (let i = 0; i < strokes; i++) {
+          const lane = strokes === 1 ? 0 : i / (strokes - 1) - .5;
+          const start = {
+            x: ridge.x + lane * spread,
+            y: ridge.y + Math.abs(lane) * spread * .28
+          };
+          const end = {
+            x: foot.x + lane * spread * 1.5,
+            y: foot.y - random() * 8
+          };
+          const points = this.cubic(
+            start,
+            { x: start.x + (end.x - start.x) * .22, y: start.y + (end.y - start.y) * .4 },
+            { x: start.x + (end.x - start.x) * .72, y: start.y + (end.y - start.y) * .82 },
+            end,
+            18
+          );
+          this.curve(points, {
+            width: .65 + darkness * .55,
+            alpha: .12 + darkness * .3,
+            seed: seed + i,
+            repeats: 1
+          });
+        }
+      },
+      meshSurface({ height, project, columns = 17, rows = 12, samples = 58, seed = 1 }) {
+        const clamp = value => Math.max(0, Math.min(1, value));
+        // Depth rows behave like soft contour lines across the terrain.
+        for (let row = 0; row < rows; row++) {
+          const v = row / (rows - 1);
+          const points = [];
+          for (let i = 0; i <= samples; i++) {
+            const u = -1 + i / samples * 2;
+            points.push(project(u, v, height(u, v)));
+          }
+          this.curve(points, {
+            width: .52 + v * .42,
+            alpha: .13 + v * .16,
+            seed: seed + row,
+            repeats: 1
+          });
+        }
+        // Flow lines run continuously from the far ridge toward the viewer.
+        // Their pressure is derived from surface slope relative to the light.
+        for (let column = 0; column < columns; column++) {
+          const u = -1 + column / (columns - 1) * 2;
+          const points = [];
+          for (let i = 0; i <= samples; i++) {
+            const v = i / samples;
+            points.push(project(u, v, height(u, v)));
+          }
+          const slope = height(Math.min(1, u + .025), .42) - height(Math.max(-1, u - .025), .42);
+          const darkness = clamp(.48 + slope * 2.4);
+          this.curve(points, {
+            width: .55 + darkness * .36,
+            alpha: .15 + darkness * .2,
+            seed: seed + 100 + column,
+            repeats: 1
+          });
+        }
+      }
+    });
+    function drawPaper() {
+      const random = randomFactory(8041);
+      g.fillStyle = paper;
+      g.fillRect(0, 0, canvas.width, canvas.height);
+      const colors = ["rgba(58,55,46,.025)", "rgba(255,255,255,.065)"];
+      for (let pass = 0; pass < 2; pass++) {
+        g.beginPath();
+        for (let i = 0; i < 4200; i++) {
+          const x = random() * canvas.width;
+          const y = random() * canvas.height;
+          const w = .35 + random() * 1.5;
+          g.rect(x, y, w, w * (.4 + random()));
+        }
+        g.fillStyle = colors[pass];
+        g.fill();
+      }
+      g.beginPath();
+      for (let i = 0; i < 180; i++) {
+        const x = random() * canvas.width;
+        const y = random() * canvas.height;
+        g.moveTo(x, y);
+        g.lineTo(x + 8 + random() * 24, y + (random() - .5) * 3);
+      }
+      g.strokeStyle = "rgba(69,65,54,.028)";
+      g.lineWidth = .55;
+      g.stroke();
+    }
+    function dottedJourney() {
+      g.save();
+      g.strokeStyle = "rgba(41,42,37,.45)";
+      g.lineWidth = 1.5;
+      g.setLineDash([3, 11]);
+      g.lineCap = "round";
+      g.beginPath();
+      g.moveTo(88, 130);
+      g.bezierCurveTo(55, 240, 232, 225, 178, 330);
+      g.bezierCurveTo(130, 430, 348, 366, 336, 510);
+      g.bezierCurveTo(325, 635, 118, 608, 182, 742);
+      g.bezierCurveTo(225, 822, 336, 788, 397, 862);
+      g.stroke();
+      g.restore();
+    }
+    function drawChaos() {
+      const random = randomFactory(3319);
+      const cx = 238;
+      const cy = 550;
+      for (let layer = 0; layer < 3; layer++) {
+        g.beginPath();
+        const strands = 17 + layer * 7;
+        for (let strand = 0; strand < strands; strand++) {
+          let x = cx + (random() - .5) * (174 - layer * 22);
+          let y = cy + (random() - .5) * (184 - layer * 20);
+          g.moveTo(x, y);
+          const steps = 8 + Math.floor(random() * 7);
+          for (let step = 0; step < steps; step++) {
+            const pull = .06 + layer * .018;
+            x += (random() - .5) * (72 - layer * 9) + (cx - x) * pull;
+            y += (random() - .5) * (68 - layer * 8) + (cy - y) * pull;
+            g.lineTo(x, y);
+          }
+        }
+        g.strokeStyle = `rgba(35,36,32,${.11 + layer * .045})`;
+        g.lineWidth = .74 + layer * .14;
+        g.lineCap = "round";
+        g.stroke();
+      }
+      for (let i = 0; i < 7; i++) {
+        const x = cx + (random() - .5) * 200;
+        const y = cy + (random() - .5) * 200;
+        ellipse(x, y, 16 + random() * 46, 10 + random() * 34, .9, .24, 500 + i);
+      }
+    }
+    function drawQuestion(x, y, s, seed) {
+      pencil(() => {
+        g.beginPath();
+        g.moveTo(x - s * .25, y - s * .28);
+        g.bezierCurveTo(x - s * .1, y - s * .66, x + s * .55, y - s * .48, x + s * .34, y - s * .08);
+        g.bezierCurveTo(x + s * .22, y + s * .12, x, y + s * .12, x, y + s * .38);
+      }, 1.6, .57, 2, seed);
+      ellipse(x, y + s * .62, 2.4, 2.4, 1.2, .65, seed + 1);
+    }
+    function drawGear(x, y, r, seed) {
+      ellipse(x, y, r * .58, r * .58, 1.4, .55, seed);
+      ellipse(x, y, r * .16, r * .16, 1.2, .55, seed + 1);
+      for (let i = 0; i < 9; i++) {
+        const a = i / 9 * TAU;
+        line(x + Math.cos(a) * r * .63, y + Math.sin(a) * r * .63,
+             x + Math.cos(a) * r, y + Math.sin(a) * r, 1.4, .55, seed + i + 2);
+      }
+    }
+    function drawCloud(x, y, s, seed) {
+      pencil(() => {
+        g.beginPath();
+        g.moveTo(x - s * .65, y + s * .2);
+        g.bezierCurveTo(x - s * .82, y - s * .18, x - s * .42, y - s * .4, x - s * .16, y - s * .24);
+        g.bezierCurveTo(x, y - s * .72, x + s * .5, y - s * .55, x + s * .48, y - s * .2);
+        g.bezierCurveTo(x + s * .86, y - s * .18, x + s * .82, y + s * .25, x + s * .55, y + s * .26);
+        g.lineTo(x - s * .65, y + s * .2);
+      }, 1.4, .5, 2, seed);
+    }
+    function drawDoodles() {
+      drawQuestion(40, 298, 32, 10);
+      drawQuestion(122, 756, 25, 11);
+      drawQuestion(390, 430, 20, 12);
+      drawGear(210, 206, 26, 20);
+      drawCloud(67, 377, 30, 31);
+      drawCloud(120, 850, 22, 32);
+      poly([[252,137],[306,115],[278,171],[268,143],[252,137]], true, 1.4, .6, 40);
+      line(268,143,306,115,1.1,.46,41);
+      poly([[389,207],[398,226],[419,229],[402,241],[407,262],[389,250],[372,263],[377,241],[359,229],[381,226]], true, 1.2, .55, 50);
+      poly([[296,825],[315,790],[322,812],[344,810],[318,853],[314,827]], true, 1.5, .62, 60);
+      poly([[94,698],[123,684],[145,699],[142,725],[110,730],[91,715]], false, 1.3, .45, 70);
+      ellipse(360,886,19,19,1.3,.5,80);
+      line(341,886,379,886,1,.34,81);
+      line(360,867,360,905,1,.34,82);
+      poly([[39,526],[51,510],[66,526],[51,542]], true, 1.2,.47,90);
+      ellipse(418,745,9,9,1.1,.5,91);
+      line(418,754,418,779,1.2,.48,92);
+      line(405,766,431,766,1.2,.48,93);
+      poly([[151,278],[166,265],[183,273],[181,293],[160,299],[148,288]], true, 1.1,.45,94);
+      line(55,214,85,214,1.2,.42,95);
+      line(70,199,70,229,1.2,.42,96);
+      ellipse(69,214,22,22,1.1,.38,97);
+    }
+    function lensPath() {
+      g.beginPath();
+      g.moveTo(501, 242);
+      g.bezierCurveTo(552, 335, 551, 676, 501, 785);
+      g.bezierCurveTo(451, 682, 450, 340, 501, 242);
+      g.closePath();
+    }
+    function drawLens() {
+      lensPath();
+      g.fillStyle = "rgba(231,226,215,.82)";
+      g.fill();
+      g.save();
+      lensPath();
+      g.clip();
+      g.beginPath();
+      for (let x = 452; x < 550; x += 9) {
+        g.moveTo(x, 210);
+        g.lineTo(x - 84, 830);
+      }
+      g.strokeStyle = "rgba(39,40,35,.17)";
+      g.lineWidth = .8;
+      g.stroke();
+      g.restore();
+      pencil(lensPath, 2.3, .82, 4, 301);
+      pencil(() => {
+        g.beginPath();
+        g.moveTo(494,252);
+        g.bezierCurveTo(468,382,469,647,494,775);
+      }, .8, .35, 2, 302);
+    }
+    function drawRays() {
+      const rays = [
+        [512,395,760,285],
+        [520,440,790,380],
+        [523,492,756,492],
+        [521,545,792,612],
+        [512,594,756,742]
+      ];
+      rays.forEach((ray, i) => arrow(...ray, 410 + i, .55));
+      g.save();
+      g.setLineDash([2,8]);
+      g.strokeStyle = "rgba(39,40,35,.28)";
+      g.lineWidth = 1;
+      g.beginPath();
+      g.moveTo(510,348); g.lineTo(900,202);
+      g.moveTo(516,646); g.lineTo(920,840);
+      g.stroke();
+      g.restore();
+    }
+    function drawSunAndCloud() {
+      ellipse(925,203,42,42,1.8,.68,500);
+      for (let i = 0; i < 12; i++) {
+        const a = i / 12 * TAU;
+        line(925 + Math.cos(a)*55, 203 + Math.sin(a)*55,
+             925 + Math.cos(a)*82, 203 + Math.sin(a)*82, 1.1,.45,510+i);
+      }
+      drawCloud(780,220,48,540);
+    }
+    function drawMountain() {
+      const bell = (u, v, cu, cv, su, sv, amplitude) => {
+        const du = (u - cu) / su;
+        const dv = (v - cv) / sv;
+        return amplitude * Math.exp(-(du * du + dv * dv));
+      };
+      const height = (u, v) => Math.max(-.1,
+        bell(u,v,.02,.18,.43,.34,1.02) +
+        bell(u,v,-.7,.42,.29,.31,.58) +
+        bell(u,v,.69,.39,.3,.3,.66) -
+        bell(u,v,.02,.78,.42,.2,.2)
+      );
+      const project = (u, v, elevation) => ({
+        x: 895 + u * (176 + v * 78),
+        y: 326 + v * 182 - elevation * 154,
+        depth: v
+      });
+      PencilLight.meshSurface({
+        height,
+        project,
+        columns: 17,
+        rows: 12,
+        samples: 62,
+        seed: 600
+      });
+      const road = [
+        ...PencilLight.cubic(
+          {x:930,y:220},{x:858,y:264},{x:966,y:303},{x:890,y:345},18
+        ).slice(0,-1),
+        ...PencilLight.cubic(
+          {x:890,y:345},{x:808,y:382},{x:937,y:411},{x:831,y:455},20
+        ).slice(0,-1),
+        ...PencilLight.cubic(
+          {x:831,y:455},{x:762,y:483},{x:831,y:511},{x:758,y:544},18
+        )
+      ];
+      road.forEach((point, i) => point.depth = i / (road.length - 1));
+      PencilLight.ribbon(road, depth => 8 + Math.pow(depth, 1.7) * 28, { seed: 710 });
+    }
+    function drawBars(x,y) {
+      line(x-12,y+61,x+102,y+61,1.5,.55,800);
+      line(x-12,y+61,x-12,y-10,1.5,.55,801);
+      const heights=[21,40,69,52,88];
+      heights.forEach((h,i)=>{
+        const bx=x+i*21;
+        poly([[bx,y+60],[bx,y+60-h],[bx+13,y+60-h],[bx+13,y+60]],false,1.2,.5,810+i);
+        for(let yy=y+56;yy>y+60-h;yy-=7) line(bx+2,yy,bx+11,yy,0.7,.22,830+i+yy);
+      });
+    }
+    function drawNetwork(x,y) {
+      const nodes=[[0,0],[55,-28],[95,18],[74,70],[20,82],[-22,42],[42,32]];
+      const edges=[[0,1],[1,2],[2,3],[3,4],[4,5],[5,0],[0,6],[1,6],[2,6],[3,6],[4,6]];
+      edges.forEach((e,i)=>line(x+nodes[e[0]][0],y+nodes[e[0]][1],x+nodes[e[1]][0],y+nodes[e[1]][1],1.1,.45,900+i));
+      nodes.forEach((n,i)=>ellipse(x+n[0],y+n[1],7,7,1.4,.6,930+i));
+    }
+    function drawGlobe(x,y,r) {
+      ellipse(x,y,r,r,1.7,.62,950);
+      pencil(()=>{g.beginPath();g.ellipse(x,y,r*.46,r,0,0,TAU);},1,.42,2,951);
+      pencil(()=>{g.beginPath();g.ellipse(x,y,r,r*.42,0,0,TAU);},1,.42,2,952);
+      pencil(()=>{
+        g.beginPath();
+        g.moveTo(x-r*.72,y-r*.18);
+        g.bezierCurveTo(x-r*.25,y-r*.52,x-r*.08,y-r*.18,x+r*.12,y-r*.35);
+        g.bezierCurveTo(x+r*.32,y-r*.51,x+r*.5,y-r*.12,x+r*.72,y-r*.1);
+        g.moveTo(x-r*.58,y+r*.15);
+        g.bezierCurveTo(x-r*.28,y+r*.02,x-r*.18,y+r*.5,x+r*.18,y+r*.28);
+        g.bezierCurveTo(x+r*.36,y+r*.14,x+r*.55,y+r*.44,x+r*.66,y+r*.22);
+      },1.2,.5,2,953);
+    }
+    function drawPlant(x,y) {
+      line(x,y+80,x,y,1.8,.58,1000);
+      pencil(()=>{g.beginPath();g.moveTo(x,y+47);g.bezierCurveTo(x-48,y+24,x-50,y-9,x-6,y+17);g.bezierCurveTo(x+6,y+26,x+3,y+39,x,y+47);},1.5,.54,2,1001);
+      pencil(()=>{g.beginPath();g.moveTo(x,y+58);g.bezierCurveTo(x+48,y+35,x+53,y+4,x+7,y+29);g.bezierCurveTo(x-1,y+38,x-2,y+49,x,y+58);},1.5,.54,2,1002);
+      line(x-38,y+82,x+39,y+82,1.2,.42,1003);
+    }
+    function drawPeople(x,y) {
+      const people=[[-38,3,20],[0,-7,24],[41,4,19]];
+      people.forEach((p,i)=>{
+        ellipse(x+p[0],y+p[1]-p[2]*1.8,p[2]*.36,p[2]*.36,1.4,.55,1050+i);
+        pencil(()=>{
+          g.beginPath();
+          g.moveTo(x+p[0],y+p[1]-p[2]*1.35);
+          g.lineTo(x+p[0],y+p[1]+p[2]*.45);
+          g.moveTo(x+p[0]-p[2]*.65,y+p[1]-p[2]*.48);
+          g.lineTo(x+p[0]+p[2]*.65,y+p[1]-p[2]*.48);
+          g.moveTo(x+p[0],y+p[1]+p[2]*.45);
+          g.lineTo(x+p[0]-p[2]*.42,y+p[1]+p[2]*1.25);
+          g.moveTo(x+p[0],y+p[1]+p[2]*.45);
+          g.lineTo(x+p[0]+p[2]*.42,y+p[1]+p[2]*1.25);
+        },1.4,.55,2,1060+i);
+      });
+    }
+    function drawRightSymbols() {
+      drawBars(1062,554);
+      drawNetwork(835,670);
+      drawGlobe(1050,760,60);
+      drawPlant(748,865);
+      drawPeople(925,915);
+      ellipse(1114,890,9,9,1.2,.44,1100);
+      poly([[1110,899],[1120,925],[1104,925]],false,1.1,.4,1101);
+    }
+    function render() {
+      drawPaper();
+      dottedJourney();
+      drawChaos();
+      drawDoodles();
+      drawSunAndCloud();
+      drawRays();
+      drawMountain();
+      drawRightSymbols();
+      drawLens();
+    }
+    render();
+  </script>
+</body>
+</html>