@wallarm-org/claude-design 0.0.0-stage → 4.8.0

package/dist/project/components/AgentGlyph/README.md

@@ -0,0 +1,1182 @@
+The character of an AI agent as a flat 16–32 px glyph: the same silhouette, colour, visor and eyes as the 3D `AgentAvatar`, drawn flat so it stays sharp and cheap in text, chips and table rows. It is static and loads no canvas, bake or animation code. A glyph is always decorative: put it next to the agent’s visible name, which is what screen readers announce. Use 20 px beside `text-sm` or larger and in table rows, 16 px beside `text-xs`; from 40 px up use `AgentAvatar`. With `align="optical"` (the default) the glyph lifts its body onto the text line, so every shape reads as centred next to the name without moving the layout; use `align="box"` in ladders and stacks. Only the top-of-head props are drawn at this size.
+
+## Props as canvas attributes
+
+Use kebab-case attribute names. Pass non-string values through renderVals holes, including booleans. The full emitted API is in `components/index.d.ts`.
+
+| Attribute | Type | Required | Default | Description |
+| --- | --- | --- | --- | --- |
+| `id` | `string \| undefined` | no | — |  |
+| `on-change` | `ChangeEventHandler<T, Element> \| undefined` | no | — |  |
+| `type` | `string \| undefined` | no | — |  |
+| `name` | `string \| undefined` | no | — |  |
+| `height` | `string \| number \| undefined` | no | — |  |
+| `max` | `string \| number \| undefined` | no | — |  |
+| `min` | `string \| number \| undefined` | no | — |  |
+| `target` | `string \| undefined` | no | — |  |
+| `width` | `string \| number \| undefined` | no | — |  |
+| `href` | `string \| undefined` | no | — |  |
+| `agent` | `"wally" \| "radar" \| "sift" \| "mend" \| "trim" \| "probe"` | no | — |  |
+| `look` | `undefined` | no | — |  |
+| `size` | `complex` | yes | — | 16 beside text-xs, 20 beside text-sm or larger and in table rows (D3); 24 and 32 for other compact slots. |
+| `state` | `"idle" \| "working" \| "needs" \| "failed" \| "off" \| "box" \| "invite" \| "hello" \| "done"` | no | `idle` |  |
+| `has-applications` | `boolean \| undefined` | no | `false` | The agent's template has applications (`applications_scoped`): only then can it show Partial coverage. |
+| `coverage` | `"full" \| "partial" \| undefined` | no | `full` | `partial` draws the grey crown of Partial coverage, on duty only. |
+| `align` | `"box" \| "optical" \| undefined` | no | `optical` | `optical` lifts the body onto the text line (inline places); `box` keeps the box (ladders, stacks). |
+
+## Stories
+
+### Basic
+
+Radar on duty at 20 px, the size beside body text.
+
+Source: AgentGlyph/AgentGlyph.stories.tsx#Basic
+
+### Cast
+
+The six agents in every state frame, at 20 px. Colour and eyes carry the state; red and crosses never appear.
+
+Source: AgentGlyph/AgentGlyph.stories.tsx#Cast
+
+### Sizes
+
+The four glyph sizes. 16 px is the floor; above 32 px the 3D AgentAvatar takes over.
+
+Source: AgentGlyph/AgentGlyph.stories.tsx#Sizes
+
+### InlineWithText
+
+Beside a name: 20 px with text-sm, 16 px with text-xs. `optical` sits every shape on the text line; `box` centres the box, so short shapes look low.
+
+Source: AgentGlyph/AgentGlyph.stories.tsx#InlineWithText
+
+### PartialCoverage
+
+Partial coverage: an agent whose template has applications, covering only some of them, shows a grey crown while on duty.
+
+Source: AgentGlyph/AgentGlyph.stories.tsx#PartialCoverage
+
+### CustomAgent
+
+Agents without a preset get a deterministic look from their uid: never coral, never a look-alike of another agent.
+
+Source: AgentGlyph/AgentGlyph.stories.tsx#CustomAgent
+
+## Story sources
+
+### AgentGlyph/AgentGlyph.stories.tsx
+
+```tsx
+import type { Meta, StoryFn } from 'storybook-react-rsbuild';
+import { CAST } from '../../lib/agent-characters/data.gen';
+import { defaultLook } from '../../lib/agent-characters/look';
+import { HStack, VStack } from '../Stack';
+import { Text } from '../Text';
+import { AgentGlyph, type AgentGlyphProps, type AgentGlyphState } from './AgentGlyph';
+
+const DESCRIPTION = [
+  'The character of an AI agent as a flat 16–32 px glyph: the same silhouette, colour, visor and eyes as the 3D `AgentAvatar`, drawn flat so it stays sharp and cheap in text, chips and table rows. It is static and loads no canvas, bake or animation code.',
+  'A glyph is always decorative: put it next to the agent’s visible name, which is what screen readers announce. Use 20 px beside `text-sm` or larger and in table rows, 16 px beside `text-xs`; from 40 px up use `AgentAvatar`.',
+  'With `align="optical"` (the default) the glyph lifts its body onto the text line, so every shape reads as centred next to the name without moving the layout; use `align="box"` in ladders and stacks. Only the top-of-head props are drawn at this size.',
+].join(' ');
+
+const STATES: AgentGlyphState[] = [
+  'idle',
+  'hello',
+  'working',
+  'needs',
+  'done',
+  'failed',
+  'off',
+  'box',
+  'invite',
+];
+const STATE_LABELS: Record<AgentGlyphState, string> = {
+  idle: 'On duty',
+  hello: 'Hello',
+  working: 'Working',
+  needs: 'Needs you',
+  done: 'Done',
+  failed: 'Failed',
+  off: 'Deactivated',
+  box: 'Not set up',
+  invite: 'Inviting',
+};
+
+const meta = {
+  title: 'AI/AgentGlyph',
+  component: AgentGlyph,
+  parameters: {
+    layout: 'centered',
+    docs: { description: { component: DESCRIPTION } },
+  },
+  argTypes: {
+    agent: {
+      control: 'select',
+      options: CAST.map(p => p.id),
+      description: 'Preset character of a Wallarm agent.',
+    },
+    size: {
+      control: 'select',
+      options: [16, 20, 24, 32],
+      description: '16 beside text-xs, 20 beside text-sm or larger and in table rows.',
+    },
+    state: {
+      control: 'select',
+      options: STATES,
+      description: 'State frame. Hello and Done show their arcs; a glyph never animates.',
+    },
+    align: {
+      control: 'inline-radio',
+      options: ['optical', 'box'],
+      description: '`optical` lifts the body onto the text line; `box` keeps the box.',
+    },
+    hasApplications: { control: 'boolean', description: 'The agent’s template has applications.' },
+    coverage: {
+      control: 'inline-radio',
+      options: ['full', 'partial'],
+      description: '`partial` draws the grey crown of Partial coverage, on duty only.',
+    },
+  },
+} satisfies Meta<typeof AgentGlyph>;
+
+export default meta;
+
+/** Radar on duty at 20 px, the size beside body text. */
+export const Basic: StoryFn<AgentGlyphProps> = args => (
+  <AgentGlyph data-testid='agent-glyph' {...args} />
+);
+
+Basic.args = { agent: 'radar', size: 20, state: 'idle' };
+
+/** The six agents in every state frame, at 20 px. Colour and eyes carry the state; red and crosses never appear. */
+export const Cast: StoryFn = () => (
+  <VStack gap={12}>
+    <HStack gap={16}>
+      <span className='sb-annotation w-120'>state</span>
+      {CAST.map(p => (
+        <span key={p.id} className='sb-annotation w-64'>
+          {p.name.toLowerCase()}
+        </span>
+      ))}
+    </HStack>
+    {STATES.map(state => (
+      <HStack key={state} gap={16} align='center'>
+        <span className='w-120'>
+          <Text size='sm'>{STATE_LABELS[state]}</Text>
+        </span>
+        {CAST.map(p => (
+          <span key={p.id} className='w-64'>
+            <AgentGlyph
+              data-testid={`agent-glyph-${p.id}-${state}`}
+              agent={p.id}
+              size={20}
+              state={state}
+              align='box'
+            />
+          </span>
+        ))}
+      </HStack>
+    ))}
+  </VStack>
+);
+
+/** The four glyph sizes. 16 px is the floor; above 32 px the 3D AgentAvatar takes over. */
+export const Sizes: StoryFn = () => (
+  <HStack gap={24} align='end'>
+    {([16, 20, 24, 32] as const).map(size => (
+      <VStack key={size} gap={8} align='center'>
+        <span className='sb-annotation'>{size}</span>
+        <AgentGlyph data-testid={`agent-glyph-${size}`} agent='wally' size={size} align='box' />
+      </VStack>
+    ))}
+  </HStack>
+);
+
+/** Beside a name: 20 px with text-sm, 16 px with text-xs. `optical` sits every shape on the text line; `box` centres the box, so short shapes look low. */
+export const InlineWithText: StoryFn = () => (
+  <HStack gap={48} align='start'>
+    {(['optical', 'box'] as const).map(align => (
+      <VStack key={align} gap={8}>
+        <span className='sb-annotation'>{align}</span>
+        {CAST.map(p => (
+          <HStack key={p.id} gap={8} align='center'>
+            <AgentGlyph
+              data-testid={`agent-glyph-inline-${align}-${p.id}`}
+              agent={p.id}
+              size={20}
+              align={align}
+            />
+            <Text size='sm'>{p.name}</Text>
+            <AgentGlyph
+              data-testid={`agent-glyph-inline-xs-${align}-${p.id}`}
+              agent={p.id}
+              size={16}
+              align={align}
+            />
+            <Text size='xs' color='secondary'>
+              {p.role}
+            </Text>
+          </HStack>
+        ))}
+      </VStack>
+    ))}
+  </HStack>
+);
+
+/** Partial coverage: an agent whose template has applications, covering only some of them, shows a grey crown while on duty. */
+export const PartialCoverage: StoryFn = () => (
+  <HStack gap={24}>
+    {CAST.filter(p => p.id === 'radar' || p.id === 'sift' || p.id === 'mend').map(p => (
+      <VStack key={p.id} gap={8} align='center'>
+        <AgentGlyph
+          data-testid={`agent-glyph-partial-${p.id}`}
+          agent={p.id}
+          size={32}
+          hasApplications
+          coverage='partial'
+          align='box'
+        />
+        <Text size='sm'>{p.name}</Text>
+      </VStack>
+    ))}
+  </HStack>
+);
+
+const CUSTOM_AGENTS = [
+  '3f2a9c1e-7b4d-4e8a-9c21-5d6e7f8a9b0c',
+  '8c1d2e3f-4a5b-4c6d-8e7f-9a0b1c2d3e4f',
+  'b7e6d5c4-b3a2-4918-8776-655443322110',
+];
+
+/** Agents without a preset get a deterministic look from their uid: never coral, never a look-alike of another agent. */
+export const CustomAgent: StoryFn = () => (
+  <HStack gap={24}>
+    {CUSTOM_AGENTS.map(uid => (
+      <VStack key={uid} gap={8} align='center'>
+        <AgentGlyph
+          data-testid={`agent-glyph-custom-${uid.slice(0, 8)}`}
+          look={defaultLook(uid)}
+          size={32}
+          align='box'
+        />
+        <Text size='xs' color='secondary'>
+          {uid.slice(0, 8)}
+        </Text>
+      </VStack>
+    ))}
+  </HStack>
+);
+```
+
+### ../lib/agent-characters/data.gen.ts
+
+```tsx
+// GENERATED by scripts/agent-avatars/export-data.ts from the handoff data (reference look v14). Do not edit.
+// Source export: 2026-11-04, Playwright (playwright-core 1.58.2) with Chrome 156 headless, 1440 x 900 viewport, deviceScaleFactor 2; values read from the page's own constants and functions at runtime
+
+// Id unions: the page's own ids (07 §6.2). `cyan` is labelled «teal».
+export type AgentShapeId = 'dome' | 'gumdrop' | 'cushion' | 'pebble' | 'capsule' | 'cloud' | 'egg' | 'mochi' | 'kettle' | 'mug' | 'padlock' | 'safe';
+export type AgentColorId = 'coral' | 'cobalt' | 'sky' | 'cyan' | 'lilac' | 'heather' | 'pink' | 'sand' | 'toffee' | 'powder' | 'lavender' | 'blush' | 'butter' | 'mint' | 'sage' | 'petrol' | 'plum' | 'cocoa' | 'olive' | 'graphite' | 'stone' | 'oat';
+export type AgentEyeStyle = 'round' | 'oval' | 'tall' | 'sleepy';
+export type AgentPropId = 'antennae' | 'dish' | 'glasses' | 'seam' | 'beanie' | 'headlamp' | 'periscope' | 'magnifier' | 'pennant' | 'flowerclip' | 'plaster' | 'sprout' | 'badge' | 'windkey' | 'monocle' | 'none';
+export type AgentCharacterId = 'wally' | 'radar' | 'sift' | 'mend' | 'trim' | 'probe';
+export type AgentToneId = 'metal' | 'ink' | 'leaf' | 'wood' | 'oat' | 'honey' | 'brass' | 'cocoa' | 'glass' | 'beige';
+
+/** A stored look: four ids and a schema version, so a later kit change can migrate stored looks. */
+export interface AgentLook {
+  v: 1;
+  shape: AgentShapeId;
+  color: AgentColorId;
+  eyes: AgentEyeStyle;
+  prop: AgentPropId;
+}
+
+/** A preset: a look plus its default name, role and template (null: Wally, and Probe until its template exists). */
+export interface AgentPreset extends Omit<AgentLook, 'v'> {
+  id: AgentCharacterId;
+  name: string;
+  role: string;
+  templateId: string | null;
+}
+
+export interface AgentShapeDef {
+  id: AgentShapeId;
+  fam: 'soft' | 'object';
+  name: string;
+  /** body outline on the 120-unit grid */
+  d: string;
+  /** visor [x, y, width, height] */
+  v: [number, number, number, number];
+  /** declared top anchor; otherwise measured */
+  top?: [number, number];
+  parts?: { d: string; tone: AgentToneId; z: 'b' | 'f' }[];
+}
+export interface AgentColorDef {
+  id: AgentColorId;
+  name: string;
+  hex: string;
+  g: 'brand' | 'cool' | 'warm' | 'pastel' | 'deep' | 'neutral';
+  brand?: boolean;
+}
+export interface PropLayer {
+  d: string;
+  col: string;
+  mat: 'vinyl' | 'felt' | null;
+}
+export interface PropDeco {
+  s: string;
+  clip?: boolean;
+}
+export interface PropDef {
+  layers: PropLayer[];
+  deco: PropDeco[];
+  anim: { type: string; px: number; py: number } | null;
+  fid: { k: string; px: number; py: number };
+}
+export interface EyeBase { w: number; ht: number; hb: number; kt: number; kb: number; lid: number }
+
+export const SHAPE_IDS: AgentShapeId[] = [
+  "dome",
+  "gumdrop",
+  "cushion",
+  "pebble",
+  "capsule",
+  "cloud",
+  "egg",
+  "mochi",
+  "kettle",
+  "mug",
+  "padlock",
+  "safe"
+];
+export const COLOR_IDS: AgentColorId[] = [
+  "coral",
+  "cobalt",
+  "sky",
+  "cyan",
+  "lilac",
+  "heather",
+  "pink",
+  "sand",
+  "toffee",
+  "powder",
+  "lavender",
+  "blush",
+  "butter",
+  "mint",
+  "sage",
+  "petrol",
+  "plum",
+  "cocoa",
+  "olive",
+  "graphite",
+  "stone",
+  "oat"
+];
+export const EYE_STYLES: AgentEyeStyle[] = [
+  "round",
+  "oval",
+  "tall",
+  "sleepy"
+];
+export const PROP_IDS: AgentPropId[] = [
+  "antennae",
+  "dish",
+  "glasses",
+  "seam",
+  "beanie",
+  "headlamp",
+  "periscope",
+  "magnifier",
+  "pennant",
+  "flowerclip",
+  "plaster",
+  "sprout",
+  "badge",
+  "windkey",
+  "monocle",
+  "none"
+];
+
+export const SHAPES: AgentShapeDef[] = [
+  {
+    "id": "dome",
+    "fam": "soft",
+    "name": "Dome",
+    "d": "M16 100C16 56 36 30 60 30C84 30 104 56 104 100Q104 108 96 108H24Q16 108 16 100Z",
+    "v": [
+      28,
+      64,
+      64,
+      28
+    ]
+  },
+  {
+    "id": "gumdrop",
+    "fam": "soft",
+    "name": "Gumdrop",
+    "d": "M60 16C72 16 106 82 106 97C106 105 100 108 91 108H29C20 108 14 105 14 97C14 82 48 16 60 16Z",
+    "v": [
+      34,
+      70,
+      52,
+      26
+    ]
+  },
+  {
+    "id": "cushion",
+    "fam": "soft",
+    "name": "Cushion",
+    "d": "M24 32C40 26 80 26 96 32C104 35 106 42 106 58V92C106 104 100 108 88 108H32C20 108 14 104 14 92V58C14 42 16 35 24 32Z",
+    "v": [
+      28,
+      60,
+      64,
+      28
+    ]
+  },
+  {
+    "id": "pebble",
+    "fam": "soft",
+    "name": "Pebble",
+    "d": "M60 40C90 40 108 62 108 84C108 100 96 108 80 108H40C24 108 12 100 12 84C12 62 30 40 60 40Z",
+    "v": [
+      28,
+      66,
+      64,
+      26
+    ]
+  },
+  {
+    "id": "capsule",
+    "fam": "soft",
+    "name": "Capsule",
+    "d": "M60 20C80 20 90 34 90 54V96C90 104 84 108 76 108H44C36 108 30 104 30 96V54C30 34 40 20 60 20Z",
+    "v": [
+      36,
+      58,
+      48,
+      28
+    ]
+  },
+  {
+    "id": "cloud",
+    "fam": "soft",
+    "name": "Cloud",
+    "d": "M30 108C16 108 10 98 13 88C8 76 18 63 31 66C31 50 46 40 60 46C72 36 92 44 92 60C104 60 112 72 107 85C112 98 104 108 92 108Z",
+    "v": [
+      30,
+      72,
+      60,
+      26
+    ],
+    "top": [
+      60,
+      45
+    ]
+  },
+  {
+    "id": "egg",
+    "fam": "soft",
+    "name": "Egg",
+    "d": "M60 20C84 20 98 54 98 78C98 98 82 108 60 108C38 108 22 98 22 78C22 54 36 20 60 20Z",
+    "v": [
+      32,
+      62,
+      56,
+      26
+    ]
+  },
+  {
+    "id": "mochi",
+    "fam": "soft",
+    "name": "Mochi",
+    "d": "M60 50C92 50 112 70 112 88C112 102 100 108 84 108H36C20 108 8 102 8 88C8 70 28 50 60 50Z",
+    "v": [
+      26,
+      70,
+      68,
+      24
+    ]
+  },
+  {
+    "id": "kettle",
+    "fam": "object",
+    "name": "Kettle",
+    "d": "M18 100C18 66 36 44 60 44C84 44 102 66 102 100Q102 108 94 108H26Q18 108 18 100ZM24 80C14 74 8 64 5 56L9 53C13 61 20 69 28 74Z",
+    "v": [
+      30,
+      68,
+      60,
+      26
+    ],
+    "top": [
+      60,
+      44
+    ],
+    "parts": [
+      {
+        "d": "M31 64.07L30.87 57.86L31.66 52.01L33.32 46.78L35.74 42.21L38.82 38.31L42.44 35.13L46.48 32.66L50.83 30.9L55.36 29.85L60 29.5L64.64 29.85L69.17 30.9L73.52 32.66L77.56 35.13L81.18 38.31L84.26 42.21L86.68 46.78L88.34 52.01L89.13 57.86L89 64.07A3 3 0 0 1 83 63.93L83.14 58.17L82.48 53.31L81.14 49.09L79.23 45.47L76.82 42.44L74 39.95L70.82 38.01L67.37 36.62L63.73 35.78L60 35.5L56.27 35.78L52.63 36.62L49.18 38.01L46 39.95L43.18 42.44L40.77 45.47L38.86 49.09L37.52 53.31L36.86 58.17L37 63.93A3 3 0 0 1 31 64.07Z",
+        "tone": "ink",
+        "z": "b"
+      },
+      {
+        "d": "M55 42A5 4 0 1 1 65 42A5 4 0 1 1 55 42Z",
+        "tone": "ink",
+        "z": "f"
+      }
+    ]
+  },
+  {
+    "id": "mug",
+    "fam": "object",
+    "name": "Mug",
+    "d": "M28 34H74A12 12 0 0 1 86 46V96A12 12 0 0 1 74 108H28A12 12 0 0 1 16 96V46A12 12 0 0 1 28 34ZM77 70A15 19 0 1 1 107 70A15 19 0 1 1 77 70ZM87.5 70A6.5 9.5 0 1 0 100.5 70A6.5 9.5 0 1 0 87.5 70Z",
+    "v": [
+      22,
+      56,
+      58,
+      28
+    ]
+  },
+  {
+    "id": "padlock",
+    "fam": "object",
+    "name": "Padlock",
+    "d": "M36 52H84A16 16 0 0 1 100 68V92A16 16 0 0 1 84 108H36A16 16 0 0 1 20 92V68A16 16 0 0 1 36 52Z",
+    "v": [
+      30,
+      66,
+      60,
+      26
+    ],
+    "top": [
+      60,
+      14
+    ],
+    "parts": [
+      {
+        "d": "M34 58V40A26 26 0 0 1 86 40V58H74V40A14 14 0 0 0 46 40V58Z",
+        "tone": "metal",
+        "z": "b"
+      }
+    ]
+  },
+  {
+    "id": "safe",
+    "fam": "object",
+    "name": "Safe",
+    "d": "M28 30H92A14 14 0 0 1 106 44V86A14 14 0 0 1 92 100H28A14 14 0 0 1 14 86V44A14 14 0 0 1 28 30Z",
+    "v": [
+      26,
+      44,
+      68,
+      26
+    ],
+    "parts": [
+      {
+        "d": "M26 96H32A4 4 0 0 1 36 100V104A4 4 0 0 1 32 108H26A4 4 0 0 1 22 104V100A4 4 0 0 1 26 96ZM88 96H94A4 4 0 0 1 98 100V104A4 4 0 0 1 94 108H88A4 4 0 0 1 84 104V100A4 4 0 0 1 88 96Z",
+        "tone": "ink",
+        "z": "b"
+      },
+      {
+        "d": "M53 86A7 7 0 1 1 67 86A7 7 0 1 1 53 86ZM73.5 83.5H87.5A2.5 2.5 0 0 1 90 86V86A2.5 2.5 0 0 1 87.5 88.5H73.5A2.5 2.5 0 0 1 71 86V86A2.5 2.5 0 0 1 73.5 83.5Z",
+        "tone": "metal",
+        "z": "f"
+      }
+    ]
+  }
+];
+
+export const COLORS: AgentColorDef[] = [
+  {
+    "id": "coral",
+    "name": "coral, Wally only",
+    "hex": "#FF4D2E",
+    "g": "brand",
+    "brand": true
+  },
+  {
+    "id": "cobalt",
+    "name": "cobalt",
+    "hex": "#3F63DB",
+    "g": "cool"
+  },
+  {
+    "id": "sky",
+    "name": "sky",
+    "hex": "#62AEEB",
+    "g": "cool"
+  },
+  {
+    "id": "cyan",
+    "name": "teal",
+    "hex": "#2BA6BF",
+    "g": "cool"
+  },
+  {
+    "id": "lilac",
+    "name": "lilac",
+    "hex": "#9A7FE0",
+    "g": "cool"
+  },
+  {
+    "id": "heather",
+    "name": "heather",
+    "hex": "#9E86A8",
+    "g": "cool"
+  },
+  {
+    "id": "pink",
+    "name": "pink",
+    "hex": "#E373A8",
+    "g": "warm"
+  },
+  {
+    "id": "sand",
+    "name": "sand",
+    "hex": "#D8B68A",
+    "g": "warm"
+  },
+  {
+    "id": "toffee",
+    "name": "toffee",
+    "hex": "#A87A62",
+    "g": "warm"
+  },
+  {
+    "id": "powder",
+    "name": "powder",
+    "hex": "#B9D7F0",
+    "g": "pastel"
+  },
+  {
+    "id": "lavender",
+    "name": "lavender",
+    "hex": "#D3C6F3",
+    "g": "pastel"
+  },
+  {
+    "id": "blush",
+    "name": "blush",
+    "hex": "#F2B8C8",
+    "g": "pastel"
+  },
+  {
+    "id": "butter",
+    "name": "butter",
+    "hex": "#F2D57E",
+    "g": "pastel"
+  },
+  {
+    "id": "mint",
+    "name": "mint",
+    "hex": "#A8DCC8",
+    "g": "pastel"
+  },
+  {
+    "id": "sage",
+    "name": "sage",
+    "hex": "#9BAE8C",
+    "g": "pastel"
+  },
+  {
+    "id": "petrol",
+    "name": "petrol",
+    "hex": "#2D6E8E",
+    "g": "deep"
+  },
+  {
+    "id": "plum",
+    "name": "plum",
+    "hex": "#7C4485",
+    "g": "deep"
+  },
+  {
+    "id": "cocoa",
+    "name": "cocoa",
+    "hex": "#6B4C3F",
+    "g": "deep"
+  },
+  {
+    "id": "olive",
+    "name": "olive",
+    "hex": "#7E7C48",
+    "g": "deep"
+  },
+  {
+    "id": "graphite",
+    "name": "graphite",
+    "hex": "#4C5463",
+    "g": "neutral"
+  },
+  {
+    "id": "stone",
+    "name": "stone",
+    "hex": "#A9A59D",
+    "g": "neutral"
+  },
+  {
+    "id": "oat",
+    "name": "oat",
+    "hex": "#E9E0D0",
+    "g": "neutral"
+  }
+];
+
+export const TONE: Record<AgentToneId, string> = {
+  "metal": "#A3ABBB",
+  "ink": "#262A36",
+  "leaf": "#7F9E66",
+  "wood": "#8E6447",
+  "oat": "#EEE5D6",
+  "honey": "#E8B54E",
+  "brass": "#C8A35E",
+  "cocoa": "#5B3E33",
+  "glass": "#CFE3F2",
+  "beige": "#E9D2B5"
+};
+
+export const HARD: ReadonlySet<string> = new Set([
+  "metal",
+  "brass",
+  "ink",
+  "glass"
+]);
+
+export const EYE_BASE: Record<AgentEyeStyle, EyeBase> = {
+  "round": {
+    "w": 1.05,
+    "ht": 1,
+    "hb": 1,
+    "kt": 0.55,
+    "kb": 0.55,
+    "lid": 0
+  },
+  "oval": {
+    "w": 1,
+    "ht": 1.25,
+    "hb": 1.25,
+    "kt": 0.55,
+    "kb": 0.55,
+    "lid": 0
+  },
+  "tall": {
+    "w": 0.8,
+    "ht": 1.6,
+    "hb": 1.6,
+    "kt": 0.6,
+    "kb": 0.6,
+    "lid": 0
+  },
+  "sleepy": {
+    "w": 1.05,
+    "ht": 1.15,
+    "hb": 1.15,
+    "kt": 0.55,
+    "kb": 0.55,
+    "lid": 0.5
+  }
+};
+
+export const PROPS: [AgentPropId, string][] = [
+  [
+    "antennae",
+    "Antennae"
+  ],
+  [
+    "dish",
+    "Dish antenna"
+  ],
+  [
+    "glasses",
+    "Glasses"
+  ],
+  [
+    "seam",
+    "Seam"
+  ],
+  [
+    "beanie",
+    "Beanie"
+  ],
+  [
+    "headlamp",
+    "Headlamp"
+  ],
+  [
+    "periscope",
+    "Periscope"
+  ],
+  [
+    "magnifier",
+    "Magnifier"
+  ],
+  [
+    "pennant",
+    "Pennant"
+  ],
+  [
+    "flowerclip",
+    "Flower clip"
+  ],
+  [
+    "plaster",
+    "Plaster"
+  ],
+  [
+    "sprout",
+    "Sprout"
+  ],
+  [
+    "badge",
+    "Badge"
+  ],
+  [
+    "windkey",
+    "Wind-up key"
+  ],
+  [
+    "monocle",
+    "Monocle"
+  ],
+  [
+    "none",
+    "No prop"
+  ]
+];
+
+export const GLYPH_PROPS: ReadonlySet<string> = new Set([
+  "antennae",
+  "dish",
+  "beanie",
+  "periscope",
+  "pennant",
+  "sprout",
+  "windkey"
+]);
+
+export const CAST: AgentPreset[] = [
+  {
+    "id": "wally",
+    "name": "Wally",
+    "role": "Assistant",
+    "templateId": null,
+    "shape": "dome",
+    "color": "coral",
+    "eyes": "oval",
+    "prop": "antennae"
+  },
+  {
+    "id": "radar",
+    "name": "Radar",
+    "role": "Attack Anomaly Investigator",
+    "templateId": "attack-anomaly-investigation",
+    "shape": "gumdrop",
+    "color": "cobalt",
+    "eyes": "tall",
+    "prop": "dish"
+  },
+  {
+    "id": "sift",
+    "name": "Sift",
+    "role": "False Positives Analyzer",
+    "templateId": "fp-marking",
+    "shape": "cushion",
+    "color": "lilac",
+    "eyes": "round",
+    "prop": "glasses"
+  },
+  {
+    "id": "mend",
+    "name": "Mend",
+    "role": "False Positive Resolver",
+    "templateId": "fp-resolver",
+    "shape": "pebble",
+    "color": "sand",
+    "eyes": "sleepy",
+    "prop": "seam"
+  },
+  {
+    "id": "trim",
+    "name": "Trim",
+    "role": "Ruleset Optimizer",
+    "templateId": "ruleset-optimizer",
+    "shape": "capsule",
+    "color": "cyan",
+    "eyes": "oval",
+    "prop": "windkey"
+  },
+  {
+    "id": "probe",
+    "name": "Probe",
+    "role": "Exploitability Verifier",
+    "templateId": null,
+    "shape": "egg",
+    "color": "olive",
+    "eyes": "round",
+    "prop": "headlamp"
+  }
+];
+
+/** propDef() for the six presets, keyed `shape|hex|prop`; any other look needs the AgentLookBuilder entry. */
+export const PRESET_PROPS: Partial<Record<string, PropDef>> = {
+  "dome|#FF4D2E|antennae": {
+    "layers": [
+      {
+        "d": "M49.69 35.73L48.83 34.18L47.97 32.67L47.1 31.2L46.21 29.75L45.32 28.33L44.42 26.95L43.51 25.6L42.59 24.27L41.66 22.98L40.72 21.72L39.77 20.49L38.82 19.29L37.85 18.13L36.86 16.98A1.5 1.5 0 0 1 39.14 15.02L40.14 16.19L41.14 17.4L42.13 18.64L43.11 19.91L44.08 21.21L45.04 22.54L45.99 23.9L46.92 25.29L47.85 26.72L48.76 28.17L49.67 29.65L50.56 31.16L51.44 32.71L52.31 34.27A1.5 1.5 0 0 1 49.69 35.73ZM33.1 14.5A4.4 4.4 0 1 1 41.9 14.5A4.4 4.4 0 1 1 33.1 14.5ZM67.69 34.27L68.56 32.71L69.44 31.16L70.33 29.65L71.24 28.17L72.15 26.72L73.08 25.29L74.01 23.9L74.96 22.54L75.92 21.21L76.89 19.91L77.87 18.64L78.86 17.4L79.86 16.19L80.86 15.02A1.5 1.5 0 0 1 83.14 16.98L82.15 18.13L81.18 19.29L80.23 20.49L79.28 21.72L78.34 22.98L77.41 24.27L76.49 25.6L75.58 26.95L74.68 28.33L73.79 29.75L72.9 31.2L72.03 32.67L71.17 34.18L70.31 35.73A1.5 1.5 0 0 1 67.69 34.27ZM78.1 14.5A4.4 4.4 0 1 1 86.9 14.5A4.4 4.4 0 1 1 78.1 14.5Z",
+        "col": "#262A36",
+        "mat": "vinyl"
+      }
+    ],
+    "deco": [],
+    "anim": {
+      "type": "twitch",
+      "px": 60,
+      "py": 34
+    },
+    "fid": {
+      "k": "twitch",
+      "px": 60,
+      "py": 34
+    }
+  },
+  "gumdrop|#3F63DB|dish": {
+    "layers": [
+      {
+        "d": "M60.73 19.71L63.73 6.71A1.3 1.3 0 0 1 66.27 7.29L63.27 20.29A1.3 1.3 0 0 1 60.73 19.71Z",
+        "col": "#262A36",
+        "mat": "vinyl"
+      },
+      {
+        "d": "M52 0Q65 15 79 2Z",
+        "col": "#a9b9ef",
+        "mat": null
+      },
+      {
+        "d": "M64.13 3.76L67.13 -7.24A0.9 0.9 0 0 1 68.87 -6.76L65.87 4.24A0.9 0.9 0 0 1 64.13 3.76ZM65.6 -8A2.4 2.4 0 1 1 70.4 -8A2.4 2.4 0 1 1 65.6 -8Z",
+        "col": "#262A36",
+        "mat": "vinyl"
+      }
+    ],
+    "deco": [],
+    "anim": {
+      "type": "dish",
+      "px": 63,
+      "py": 18
+    },
+    "fid": {
+      "k": "scan",
+      "px": 63,
+      "py": 18
+    }
+  },
+  "cushion|#9A7FE0|glasses": {
+    "layers": [
+      {
+        "d": "M36.7 74A10.5 10.5 0 1 1 57.7 74A10.5 10.5 0 1 1 36.7 74ZM38.8 74A8.4 8.4 0 1 0 55.6 74A8.4 8.4 0 1 0 38.8 74ZM62.3 74A10.5 10.5 0 1 1 83.3 74A10.5 10.5 0 1 1 62.3 74ZM64.4 74A8.4 8.4 0 1 0 81.2 74A8.4 8.4 0 1 0 64.4 74ZM56.07 71.86L56.57 71.37L57.1 70.93L57.65 70.55L58.21 70.25L58.8 70.03L59.39 69.9L60 69.85L60.61 69.9L61.2 70.03L61.79 70.25L62.35 70.55L62.9 70.93L63.43 71.37L63.93 71.86A0.9 0.9 0 0 1 62.67 73.14L62.22 72.7L61.81 72.36L61.42 72.09L61.04 71.89L60.68 71.75L60.34 71.68L60 71.65L59.66 71.68L59.32 71.75L58.96 71.89L58.58 72.09L58.19 72.36L57.78 72.7L57.33 73.14A0.9 0.9 0 0 1 56.07 71.86Z",
+        "col": "#EEE5D6",
+        "mat": "vinyl"
+      }
+    ],
+    "deco": [
+      {
+        "s": "<path class=\"glint\" d=\"M75.3 67.5l3.2 3.2M49.7 67.5l3.2 3.2\" stroke=\"#fff\" stroke-width=\"1.5\" stroke-linecap=\"round\" opacity=\".55\"/>"
+      }
+    ],
+    "anim": null,
+    "fid": {
+      "k": "bob",
+      "px": 60,
+      "py": 27.5
+    }
+  },
+  "pebble|#D8B68A|seam": {
+    "layers": [],
+    "deco": [
+      {
+        "clip": true,
+        "s": "<path d=\"M26.5 57Q60 47 93.5 57\" stroke=\"#877258\" stroke-width=\"1.3\" fill=\"none\"/><path class=\"stitch\" d=\"M26.5 57Q60 47 93.5 57\" stroke=\"#F4EEE4\" stroke-width=\"3.4\" stroke-dasharray=\"1.6 4.4\" stroke-linecap=\"round\" fill=\"none\"/>"
+      }
+    ],
+    "anim": null,
+    "fid": {
+      "k": "none",
+      "px": 60,
+      "py": 40
+    }
+  },
+  "capsule|#2BA6BF|windkey": {
+    "layers": [
+      {
+        "d": "M59.5 11H60.5A1.5 1.5 0 0 1 62 12.5V21.5A1.5 1.5 0 0 1 60.5 23H59.5A1.5 1.5 0 0 1 58 21.5V12.5A1.5 1.5 0 0 1 59.5 11Z",
+        "col": "#C8A35E",
+        "mat": "vinyl"
+      },
+      {
+        "d": "M47 6A6.5 5.5 0 1 1 60 6A6.5 5.5 0 1 1 47 6ZM50.9 6A2.6 2.2 0 1 0 56.1 6A2.6 2.2 0 1 0 50.9 6ZM60 6A6.5 5.5 0 1 1 73 6A6.5 5.5 0 1 1 60 6ZM63.9 6A2.6 2.2 0 1 0 69.1 6A2.6 2.2 0 1 0 63.9 6Z",
+        "col": "#C8A35E",
+        "mat": "vinyl"
+      }
+    ],
+    "deco": [],
+    "anim": {
+      "type": "wind",
+      "px": 60,
+      "py": 10
+    },
+    "fid": {
+      "k": "spin",
+      "px": 60,
+      "py": 10
+    }
+  },
+  "egg|#7E7C48|headlamp": {
+    "layers": [
+      {
+        "d": "M34.62 33.55L38.22 32.61L41.85 31.81L45.48 31.16L49.11 30.65L52.74 30.29L56.37 30.07L60 30L63.63 30.07L67.26 30.29L70.89 30.65L74.52 31.16L78.15 31.81L81.78 32.61L85.38 33.55A1.5 1.5 0 0 1 84.62 36.45L81.08 35.53L77.56 34.76L74.05 34.12L70.54 33.63L67.02 33.28L63.51 33.07L60 33L56.49 33.07L52.98 33.28L49.46 33.63L45.95 34.12L42.44 34.76L38.92 35.53L35.38 36.45A1.5 1.5 0 0 1 34.62 33.55Z",
+        "col": "#262A36",
+        "mat": "vinyl"
+      },
+      {
+        "d": "M57 25H63A4 4 0 0 1 67 29V32A4 4 0 0 1 63 36H57A4 4 0 0 1 53 32V29A4 4 0 0 1 57 25Z",
+        "col": "#A3ABBB",
+        "mat": "vinyl"
+      },
+      {
+        "d": "M55.4 30.5A4.6 3.8 0 1 1 64.6 30.5A4.6 3.8 0 1 1 55.4 30.5Z",
+        "col": "#EEE5D6",
+        "mat": "vinyl"
+      }
+    ],
+    "deco": [
+      {
+        "s": "<path class=\"beam\" d=\"M56 28L44 -6L76 -6L64 28Z\" fill=\"#FFF6D6\" opacity=\"0\"/>"
+      }
+    ],
+    "anim": null,
+    "fid": {
+      "k": "flicker",
+      "px": 60,
+      "py": 30
+    }
+  }
+};
+
+export const STATES: { key: string; label: string; product: string; engine: string }[] = [
+  {
+    "key": "idle",
+    "label": "On duty",
+    "product": "Active, waiting for work",
+    "engine": "idle"
+  },
+  {
+    "key": "hello",
+    "label": "Hello",
+    "product": "Chat or drawer opened",
+    "engine": "hello"
+  },
+  {
+    "key": "working",
+    "label": "Working",
+    "product": "Run in progress",
+    "engine": "working"
+  },
+  {
+    "key": "needs",
+    "label": "Needs you",
+    "product": "N pending approval",
+    "engine": "needs"
+  },
+  {
+    "key": "done",
+    "label": "Done",
+    "product": "Run finished, change applied",
+    "engine": "done"
+  },
+  {
+    "key": "failed",
+    "label": "Failed",
+    "product": "Run failed",
+    "engine": "failed"
+  },
+  {
+    "key": "off",
+    "label": "Deactivated",
+    "product": "Deactivated",
+    "engine": "off"
+  },
+  {
+    "key": "box",
+    "label": "Not set up",
+    "product": "Not set up",
+    "engine": "box"
+  },
+  {
+    "key": "invite",
+    "label": "Inviting",
+    "product": "Not set up, inviting",
+    "engine": "invite"
+  },
+  {
+    "key": "partly",
+    "label": "Partial coverage",
+    "product": "Active in some applications",
+    "engine": "idle with the cover flag (setCover(true))"
+  }
+];
+
+export const SPRINGS: Record<string, { T: number; zeta: number }> = {
+  "P_SHAPE": {
+    "T": 0.28,
+    "zeta": 0.8
+  },
+  "P_POP": {
+    "T": 0.32,
+    "zeta": 0.45
+  },
+  "P_DART": {
+    "T": 0.12,
+    "zeta": 0.65
+  },
+  "P_PURSUIT": {
+    "T": 0.3,
+    "zeta": 0.85
+  },
+  "P_BRIGHT": {
+    "T": 0.2,
+    "zeta": 1
+  },
+  "P_SQ": {
+    "T": 0.22,
+    "zeta": 0.3
+  },
+  "P_LAND": {
+    "T": 0.35,
+    "zeta": 0.4
+  },
+  "P_W": {
+    "T": 0.6,
+    "zeta": 1
+  }
+};
+
+export const OPTY: Record<AgentShapeId, number> = {
+  "dome": 21.4242,
+  "gumdrop": 17.1466,
+  "cushion": 18.1068,
+  "pebble": 25.1939,
+  "capsule": 15.0188,
+  "cloud": 27.6431,
+  "egg": 15.2563,
+  "mochi": 30.1353,
+  "kettle": 27.8453,
+  "mug": 20.8761,
+  "padlock": 20.3776,
+  "safe": 16.8761
+};
+
+/** geom() per shape as the page measures it (top anchor, half-width per row at y = i / 2, footprint at y 104). */
+export const GEOMS: Record<AgentShapeId, { top: [number, number]; HW: number[]; foot: [number, number] }> = {"dome":{"top":[60,30],"HW":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,4.5,6.5,9,10.5,11.5,13,14,15,16,17,18,18.5,19.5,20,21,21.5,22,22.5,23,23.5,24,25,25,25.5,26,26.5,27,27.5,28,28.5,28.5,29,29.5,30,30,30.5,31,31.5,31.5,32,32,32.5,33,33,33.5,33.5,34,34,34.5,34.5,35,35,35.5,35.5,36,36,36.5,36.5,37,37,37,37.5,37.5,38,38,38,38.5,38.5,38.5,39,39,39,39.5,39.5,39.5,40,40,40,40,40.5,40.5,40.5,41,41,41,41,41,41.5,41.5,41.5,41.5,42,42,42,42,42,42,42.5,42.5,42.5,42.5,42.5,42.5,43,43,43,43,43,43,43,43.5,43.5,43.5,43.5,43.5,43.5,43.5,43.5,43.5,43.5,43.5,43.5,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,43.5,43.5,43.5,43,43,42.5,42.5,42,41,40.5,39,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],"foot":[17,103]},"gumdrop":{"top":[60,16],"HW":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1.5,2.5,3.5,4,5,5.5,6,6.5,7,7.5,8,8.5,9,9.5,9.5,10,10.5,11,11.5,12,12,12.5,13,13.5,13.5,14,14.5,14.5,15,15.5,16,16,16.5,17,17,17.5,18,18,18.5,19,19,19.5,19.5,20,20.5,20.5,21,21,21.5,22,22,22.5,23,23,23.5,23.5,24,24,24.5,25,25,25.5,25.5,26,26,26.5,27,27,27.5,27.5,28,28,28.5,28.5,29,29,29.5,29.5,30,30,30.5,31,31,31.5,31.5,32,32,32.5,32.5,33,33,33.5,33.5,34,34,34.5,34.5,34.5,35,35,35.5,35.5,36,36,36.5,36.5,37,37,37.5,37.5,38,38,38,38.5,38.5,39,39,39.5,39.5,39.5,40,40,40.5,40.5,40.5,41,41,41.5,41.5,41.5,42,42,42.5,42.5,42.5,43,43,43,43.5,43.5,43.5,44,44,44,44.5,44.5,44.5,45,45,45,45,45.5,45.5,45.5,45.5,45.5,46,46,46,46,46,46,46,46,46,46,46,45.5,45.5,45.5,45,45,45,44.5,44,44,43.5,43,42.5,41.5,40.5,39.5,38,35.5,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],"foot":[16.5,103]},"cushion":{"top":[60,27.5],"HW":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,10.5,17,21.5,25,27.5,30,32,33.5,35,36.5,37.5,38.5,39.5,40,40.5,41,41.5,42,42.5,43,43,43.5,43.5,43.5,44,44,44.5,44.5,44.5,44.5,45,45,45,45,45,45.5,45.5,45.5,45.5,45.5,45.5,45.5,45.5,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,45.5,45.5,45.5,45.5,45,45,45,45,44.5,44.5,44,44,43.5,43,42.5,42.5,42,41.5,40.5,40,39,37.5,36,33,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],"foot":[18,101.5]},"pebble":{"top":[60,40],"HW":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,5.5,9,12,14,16,17,18.5,20,21,22.5,23.5,24.5,25.5,26,27,28,28.5,29.5,30,30.5,31.5,32,32.5,33,33.5,34.5,35,35.5,36,36.5,36.5,37,37.5,38,38.5,39,39.5,39.5,40,40.5,40.5,41,41.5,41.5,42,42.5,42.5,43,43,43.5,43.5,44,44,44.5,44.5,45,45,45,45.5,45.5,45.5,46,46,46,46.5,46.5,46.5,47,47,47,47,47.5,47.5,47.5,47.5,47.5,47.5,47.5,48,48,48,48,48,48,48,48,48,48,48,48,48,48,48,48,48,48,47.5,47.5,47.5,47.5,47.5,47,47,47,46.5,46.5,46.5,46,46,46,45.5,45,45,44.5,44.5,44,43.5,43.5,43,42.5,42,41.5,41,40.5,40,39,38.5,37.5,37,36,35,33.5,32,30.5,28.5,25.5,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],"foot":[23,96]},"capsule":{"top":[60,20],"HW":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,4.5,7.5,9.5,11,12.5,13.5,14.5,15.5,16.5,17.5,18,18.5,19.5,20,20.5,21,21.5,22,22.5,23,23,23.5,24,24.5,24.5,25,25,25.5,26,26,26.5,26.5,27,27,27,27.5,27.5,27.5,28,28,28,28.5,28.5,28.5,29,29,29,29,29,29.5,29.5,29.5,29.5,29.5,29.5,29.5,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,30,29.5,29.5,29.5,29.5,29,29,28.5,28.5,28,28,27.5,27,26.5,26,25,24.5,23,22,19.5,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],"foot":[33,86.5]},"cloud":{"top":[60,45],"HW":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,24.5,25,25.5,26,26.5,27,27.5,28,28.5,28.5,29,29,29.5,29.5,30,30,30.5,30.5,30.5,31,31,31,31,31.5,31.5,31.5,31.5,31.5,31.5,35,37,38,39,40,41,41.5,42,42.5,43,43.5,44,44.5,45,45,45.5,46,46,46.5,46.5,46.5,47,47,47,47.5,47.5,47.5,47.5,48,48,48,48,48,48,48,48,48,48,48,48.5,48.5,48.5,48.5,48.5,48.5,48.5,48.5,48,48,48,48,48,47.5,47.5,47.5,47.5,47.5,47.5,47.5,48,48,48,48,48,48,48,48,48,48,48,48,48,47.5,47.5,47.5,47.5,47,47,46.5,46.5,46,46,45.5,45,45,44.5,44,43.5,43,42,41.5,40.5,39.5,38.5,37,34.5,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],"foot":[17.5,103]},"egg":{"top":[60,20],"HW":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,3.5,6,7.5,9,10,11.5,12.5,13,14,14.5,15.5,16.5,17,17.5,18,18.5,19,19.5,20,20.5,21,21.5,22,22.5,23,23.5,23.5,24,24.5,24.5,25,25.5,26,26,26.5,27,27,27.5,27.5,28,28.5,28.5,29,29,29.5,29.5,30,30,30.5,30.5,31,31,31,31.5,31.5,32,32,32.5,32.5,32.5,33,33,33,33.5,33.5,33.5,34,34,34,34.5,34.5,34.5,35,35,35,35,35.5,35.5,35.5,36,36,36,36,36,36.5,36.5,36.5,36.5,36.5,37,37,37,37,37,37,37.5,37.5,37.5,37.5,37.5,37.5,37.5,37.5,38,38,38,38,38,38,38,38,38,38,38,38,38,38,38,38,38,38,38,38,38,37.5,37.5,37.5,37.5,37.5,37.5,37,37,37,37,36.5,36.5,36.5,36,36,35.5,35.5,35.5,35,35,34.5,34.5,34,33.5,33.5,33,32.5,32.5,32,31.5,31,30.5,30,29.5,29,28.5,27.5,27,26.5,25.5,25,24,23,22,21,19.5,18.5,17,15,13,10.5,6.5,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],"foot":[39,80]},"mochi":{"top":[60,50],"HW":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,6.5,10.5,13.5,15.5,17.5,19.5,21,22.5,24,25,26.5,27.5,28.5,29.5,30.5,31.5,32,33,34,34.5,35.5,36,36.5,37.5,38,38.5,39,40,40.5,41,41.5,42,42.5,43,43.5,44,44.5,44.5,45,45.5,46,46,46.5,47,47,47.5,48,48,48.5,48.5,49,49,49.5,49.5,50,50,50,50.5,50.5,50.5,51,51,51,51.5,51.5,51.5,51.5,51.5,52,52,52,52,52,52,52,52,52,52,52,52,52,52,52,51.5,51.5,51.5,51.5,51,51,51,50.5,50.5,50.5,50,50,49.5,49,49,48.5,48,47.5,47,46.5,46,45.5,45,44,43.5,42.5,41.5,40.5,39,37.5,36,33.5,30,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],"foot":[17.5,102]},"kettle":{"top":[60,44],"HW":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,4.5,7.5,9.5,11,13,14,15,16,17,18,19,20,20.5,21.5,22,22.5,23.5,24,24.5,25,25.5,26,26.5,27,27.5,28,28.5,29,29.5,29.5,30,30.5,31,31,31.5,32,32,32.5,33,33,33.5,33.5,34,34.5,34.5,35,35,35.5,35.5,36,36,36.5,36.5,46.5,46,46,45.5,45,44.5,44,43.5,43,42.5,42,41.5,40.5,40,39.5,39.5,39.5,39.5,39.5,40,40,40,40,40.5,40.5,40.5,40.5,40.5,40.5,41,41,41,41,41,41.5,41.5,41.5,41.5,41.5,41.5,41.5,41.5,41.5,41.5,42,42,42,42,42,42,42,42,42,42,42,42,42,42,42,42,42,42,42,42,41.5,41.5,41.5,41,41,40.5,40.5,40,39,38.5,37,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],"foot":[19,101]},"mug":{"top":[60,34],"HW":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,34.5,36,37.5,38,39,39.5,40.5,41,41,41.5,42,42.5,42.5,43,43,43.5,43.5,43.5,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44.5,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44.5,44.5,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,44,43.5,43.5,43.5,43,43,43,42.5,42,42,41.5,41,41,40.5,39.5,39,38.5,37.5,36.5,35,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],"foot":[19,82.5]},"padlock":{"top":[60,14],"HW":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,27,28.5,30,31,32,33,33.5,34.5,35,35.5,36,36.5,36.5,37,37.5,38,38,38.5,38.5,39,39,39,39.5,39.5,39.5,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,40,39.5,39.5,39.5,39,39,39,38.5,38.5,38,38,37.5,37.5,37,36.5,36.5,36,35.5,35,34.5,33.5,33,32.5,31.5,30.5,29,27.5,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],"foot":[25.5,94]},"safe":{"top":[60,30],"HW":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,34.5,36.5,37.5,38.5,39.5,40.5,41,41.5,42,42.5,43,43.5,44,44,44.5,44.5,45,45,45,45.5,45.5,45.5,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,46,45.5,45.5,45.5,45.5,45,45,44.5,44.5,44,44,43.5,43.5,43,42.5,42,41.5,41,40.5,40,39,38,36.5,35,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],"foot":[22,97.5]}};
+```