# gdb-hub / gdb__template-4-s121

- taskset: [gdb-hub](https://harnessreport.com/tasks/gdb-hub.md)
- difficulty: hard
- category: design
- language: 
- runnable from the site: no
- agent timeout: 3600s

## Results by harness

_none yet_

## Instruction

```
# GDB: template-4

## Input Files

- `/workspace/inputs/input_0.png`
- `/workspace/inputs/input_1.png`

## Task

You are a design system assistant. Given several example layouts from the same template as style context, and one skeleton layout with structural data but missing visual styles, complete the skeleton by filling in the missing style properties (fontFamily, fontSize, color, backgroundColor, opacity, textAlign) to match the template's style. Return ONLY a valid JSON layout object.

Style context (sibling layouts):
[
  {
    "components": [
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/184fe9e7-3e05-40ef-98b6-b6068cde76f7.jpg",
        "id": "0-0-0",
        "left": "-270.507px",
        "top": "0.0px",
        "width": "1621.01px",
        "height": "1080.0px",
        "transform": "rotate(0deg)",
        "opacity": 1,
        "overflow": "visible"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/61428da9-d4eb-41c2-9ec0-017891fe13a5.svg",
        "id": "0-1",
        "left": "811.338px",
        "top": "350.876px",
        "width": "91.0134px",
        "height": "2px",
        "transform": "rotate(-90deg)"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/c8d1e2d4-7b63-4511-8587-6a351b0419dd.svg",
        "id": "0-2",
        "left": "113.399px",
        "top": "510.81px",
        "width": "146.465px",
        "height": "2px",
        "transform": "rotate(-90deg)"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/6a63f1e9-6f54-46fb-a3fa-f02163ca9569.svg",
        "id": "0-3",
        "left": "941.068px",
        "top": "687.549px",
        "width": "91.0134px",
        "height": "2px",
        "transform": "rotate(-90deg)"
      },
      {
        "type": "TEXT",
        "text": "1/3 of food is wasted",
        "id": "0-4",
        "left": "728.528px",
        "top": "215.37533000000002px",
        "width": "262.995px",
        "height": "77.8667px",
        "transform": "none",
        "color": "rgb(1, 74, 45)",
        "fontSize": "30px",
        "fontFamily": "DM Sans--400",
        "fontWeight": "400",
        "textAlign": "center",
        "lineHeight": "42.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "Up to 10% of greenhouse gases from wasted food",
        "id": "0-5",
        "left": "96.9461px",
        "top": "231.64433000000002px",
        "width": "222.528px",
        "height": "203.867px",
        "transform": "none",
        "color": "rgb(1, 74, 45)",
        "fontSize": "30px",
        "fontFamily": "DM Sans--400",
        "fontWeight": "400",
        "textAlign": "left",
        "lineHeight": "42.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "Saving 25% of wasted food would feed 870 million",
        "id": "0-6",
        "left": "814.028px",
        "top": "467.00633px",
        "width": "235.478px",
        "height": "158.573px",
        "transform": "none",
        "color": "rgb(1, 74, 45)",
        "fontSize": "30px",
        "fontFamily": "DM Sans--400",
        "fontWeight": "400",
        "textAlign": "left",
        "lineHeight": "42.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/2dc6fe2a-c5b0-4348-89ee-39004d4cb1b3.svg",
        "id": "0-7",
        "left": "728.528px",
        "top": "395.383px",
        "width": "127.317px",
        "height": "2px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/0faad60f-6da5-4dfb-a166-7a3bc90737dd.svg",
        "id": "0-8",
        "left": "185.632px",
        "top": "583.043px",
        "width": "96.6782px",
        "height": "2px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/43f46f66-0047-4b02-8acb-57517c350378.svg",
        "id": "0-9",
        "left": "682.088px",
        "top": "732.055px",
        "width": "303.487px",
        "height": "2px"
      },
      {
        "type": "TEXT",
        "text": "Food waste is a global problem",
        "id": "0-10",
        "left": "93.9721px",
        "top": "932.59367px",
        "width": "892.056px",
        "height": "62.2745px",
        "transform": "none",
        "color": "rgb(1, 74, 45)",
        "fontSize": "53px",
        "fontFamily": "DM Sans--400",
        "fontWeight": "400",
        "textAlign": "center",
        "lineHeight": "74.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/e7d40910-b4ba-44b5-8aec-05320c28c187.svg",
        "id": "0-11",
        "left": "996.237px",
        "top": "1035.37px",
        "width": "53.2533px",
        "height": "2px",
        "transform": "rotate(-1.44501deg)"
      },
      {
        "type": "TEXT",
        "text": "2/4",
        "id": "0-12",
        "left": "849.37px",
        "top": "1021.5400000000001px",
        "width": "133.264px",
        "height": "28.2px",
        "transform": "none",
        "color": "rgb(1, 74, 45)",
        "fontSize": "24px",
        "fontFamily": "DM Sans--400",
        "fontWeight": "400",
        "textAlign": "right",
        "lineHeight": "33.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      }
    ],
    "background": "rgb(252, 252, 252)",
    "width": "1080px",
    "height": "1080px",
    "duration": 3
  },
  {
    "components": [
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/a0a290e6-8ce3-41cc-a2a1-884dbecedbca.jpg",
        "id": "0-0-0",
        "left": "0.0px",
        "top": "-224.903px",
        "width": "1080.0px",
        "height": "1621.01px",
        "transform": "rotate(0deg)",
        "opacity": 1,
        "overflow": "visible"
      },
      {
        "type": "TEXT",
        "text": "Much food we create goes to waste",
        "id": "0-1",
        "left": "144.006px",
        "top": "85.85327px",
        "width": "791.987px",
        "height": "141.333px",
        "transform": "none",
        "color": "rgb(1, 74, 45)",
        "fontSize": "66px",
        "fontFamily": "DM Sans--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "62.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/2ab29836-a370-4fef-8c70-bd21f9bfcce4.svg",
        "id": "0-2",
        "left": "996.237px",
        "top": "1035.37px",
        "width": "53.2533px",
        "height": "2px",
        "transform": "rotate(-1.44501deg)"
      },
      {
        "type": "TEXT",
        "text": "1/4",
        "id": "0-3",
        "left": "849.37px",
        "top": "1021.5400000000001px",
        "width": "133.264px",
        "height": "28.2px",
        "transform": "none",
        "color": "rgb(1, 74, 45)",
        "fontSize": "24px",
        "fontFamily": "DM Sans--400",
        "fontWeight": "400",
        "textAlign": "right",
        "lineHeight": "33.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      }
    ],
    "background": "rgb(252, 252, 252)",
    "width": "1080px",
    "height": "1080px",
    "duration": 3
  }
]

Skeleton to style:
{
  "width": "1080px",
  "height": "1080px",
  "components": [
    {
      "type": "IMAGE",
      "id": "0-0-0",
      "left": "-139.104px",
      "top": "-426.647px",
      "width": "1326.36px",
      "height": "1990.78px",
      "transform": "rotate(0deg)",
      "overflow": "visible"
    },
    {
      "type": "TEXT",
      "text": "Fruits and veggies belong on the table, not trash.",
      "id": "0-1",
      "left": "157.451px",
      "top": "80.65326px",
      "width": "791.987px",
      "height": "120.926px",
      "transform": "none"
    },
    {
      "type": "TEXT",
      "text": "We need to fight food waste to tackle climate change.",
      "id": "0-2",
      "left": "305.771px",
      "top": "919.2683400000001px",
      "width": "495.347px",
      "height": "77.8667px",
      "transform": "none"
    },
    {
      "type": "IMAGE",
      "id": "0-3",
      "left": "944.897px",
      "top": "493.493px",
      "width": "91.0134px",
      "height": "2px",
      "transform": "rotate(-90deg)"
    },
    {
      "type": "TEXT",
      "text": "Almost 50% of all fruits \n& veggies are wasted ",
      "id": "0-4",
      "left": "849.37px",
      "top": "261.80033000000003px",
      "width": "190.699px",
      "height": "161.853px",
      "transform": "none"
    },
    {
      "type": "IMAGE",
      "id": "0-5",
      "left": "862.087px",
      "top": "538px",
      "width": "127.317px",
      "height": "2px"
    },
    {
      "type": "IMAGE",
      "id": "0-6",
      "left": "996.237px",
      "top": "1035.37px",
      "width": "53.2533px",
      "height": "2px",
      "transform": "rotate(-1.44501deg)"
    },
    {
      "type": "TEXT",
      "text": "4/4",
      "id": "0-7",
      "left": "849.37px",
      "top": "1021.5400000000001px",
      "width": "133.264px",
      "height": "28.2px",
      "transform": "none"
    }
  ]
}

The skeleton references these assets (URLs, use as-is):
["https://storage.googleapis.com/lica-video/0c7f2433-4e76-43f3-8a13-dc97e79f6064.jpg", "https://storage.googleapis.com/lica-video/74fbb480-c291-488b-abb8-e78951915646.svg", "https://storage.googleapis.com/lica-video/1545db89-bc38-4d42-8c32-d66a82d59a48.svg", "https://storage.googleapis.com/lica-video/26bfed02-8268-42df-8527-8a37f8c23584.svg"]

## Output

Write your answer to `/workspace/answer.json`.
Write ONLY the answer — no explanation, no markdown fences, no extra text.
```
---
Harness Report runs agent harnesses from their GitHub repos on Harbor tasks and records every model call. Every page is also `.md` and `.json`; index: https://harnessreport.com/llms.txt · MCP: https://harnessreport.com/mcp