{
  "version": 1,
  "canonical": "https://www.cellect.ai/brand#illustrations",
  "approved": [
    {
      "id": "m1",
      "name": "Set-out",
      "renderer": "SET_OUT",
      "use": "Coordination and a shared reference; headline-supporting conceptual motion",
      "intro": false,
      "component": "SetOut",
      "example": "https://staging.www.cellect.ai/proto/p57#p57-on-one-set-of-numbers"
    },
    {
      "id": "g3a",
      "name": "Intake",
      "renderer": "ABSTRACT.convergence",
      "use": "Document intake becoming one ledger",
      "intro": false
    },
    {
      "id": "g3c",
      "name": "Cost curve",
      "renderer": "ABSTRACT.curve",
      "use": "Budget, actuals and forecast",
      "intro": false
    },
    {
      "id": "g3e",
      "name": "Three parties",
      "renderer": "ABSTRACT.register",
      "use": "One source shared by sponsor, team and investors",
      "intro": false
    },
    {
      "id": "k1",
      "name": "Set-back",
      "renderer": "SITE_WORK.stakes",
      "use": "Completed, active and future development",
      "intro": false
    }
  ],
  "notApproved": [
    "g3b: tangled wireframe site plan",
    "g3d: literal building section",
    "Other exploratory renderers included in historical source are not approved assets"
  ],
  "tokens": {
    "paper": "#ECEAE3",
    "ink": "#14161A",
    "accent": "#BB4D36",
    "labels": "IBM Plex Mono",
    "headings": "IBM Plex Sans"
  },
  "rules": {
    "do": [
      "Explain a process, relationship or change",
      "Use accent to identify a meaningful active state",
      "Fit complete artwork to its frame and keep labels legible on mobile",
      "Loop calmly, hold the composed frame, provide pause and replay",
      "Honor prefers-reduced-motion with a meaningful still",
      "Use construction details as conceptual language: datum, section cut, junction; keep one dominant idea.",
      "Use the same four-second assembly, hold, and return rhythm across the approved family",
      "Keep legend samples consistent with their line colors and dash patterns",
      "Place labels in clear paper space; do not cross curves, footprint edges, or ground grids"
    ],
    "dont": [
      "Use tangled wireframes",
      "Use literal buildings as filler",
      "Invent financial figures or imply synthetic curves are real performance",
      "Add decorative motion or use multiple accent colors",
      "Add fasteners, hatching, or dimension lines that do not improve the idea.",
      "Let every element move at once or lose the idea in the final still",
      "Render shared information as a tiny node-and-spoke flowchart or a document conveyor",
      "Add an unexplained measurement bracket to a chart or a callout to Set-back"
    ]
  },
  "source": "/assets/brand/cellect/illustrations.tar.gz",
  "integration": "Use Drawing with the approved renderer, id, name, detail and intro flag above. Load IBM Plex Mono as --brand-mono on the canvas and IBM Plex Sans as --brand-sans. Canvas needs an explicit CSS width and height. Pass paused, still and replay props; still must honor prefers-reduced-motion. Renderers use CanvasRenderingContext2D and are framework-independent; drawing.tsx is the React adapter.",
  "setOut": {
    "timing": {
      "loopSeconds": 4,
      "assembleSeconds": 1.5,
      "holdSeconds": 1,
      "returnSeconds": 1.5
    },
    "stroke": {
      "structure": 2,
      "detail": 1,
      "activeConnection": 2.5
    },
    "accent": "One drawn datum and the aligned intersections; do not accent each moving part separately.",
    "placement": "Place beside copy about coordination or one shared reference. On mobile, copy precedes art. Keep complete geometry visible; render the canonical component instead of re-creating it.",
    "motion": "Pause offscreen and in hidden tabs. Provide an accessible pause control. Reduced motion shows the assembled state. Do not speed up to imply urgency.",
    "status": "Joint and Reveal remain studies; Set-out is the selected lead direction."
  },
  "family": {
    "loopSeconds": 4,
    "assembleSeconds": 1.5,
    "holdSeconds": 1,
    "returnSeconds": 1.5,
    "structure": 2,
    "detail": 1,
    "activeConnection": 2.5,
    "notes": [
      "Intake is a physical offset source stack; pages peel into the books. Avoid dashed transfer lanes.",
      "Three parties is one continuous register: BOOKS names the source sheet; sponsor, team, and investors read three positions on it. Carry one accent datum through all three.",
      "Cost curve uses budget, actual, and forecast strokes with a matching legend; avoid unexplained cursor-like marks.",
      "Set-back begins with the surrounding site drawn. The footprint, stakes, and strings carry the idea without a callout.",
      "Use matching line samples for Budget, Actual and Forecast; dashed forecast begins at Today. Synthetic curves are illustrative, never evidence.",
      "Construction details must explain a boundary, junction or datum. Avoid decorative hatching."
    ]
  }
}