# gdb-hub / gdb__template-4-s120

- 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": "-109.815px",
      "top": "-416.16px",
      "width": "1268.3px",
      "height": "1903.64px",
      "transform": "rotate(0deg)",
      "overflow": "visible"
    },
    {
      "type": "IMAGE",
      "id": "0-1",
      "left": "996.237px",
      "top": "1035.37px",
      "width": "53.2533px",
      "height": "2px",
      "transform": "rotate(-1.44501deg)"
    },
    {
      "type": "TEXT",
      "text": "Each year, we waste more produce than the last.",
      "id": "0-2",
      "left": "163.602px",
      "top": "153.95333000000002px",
      "width": "785.837px",
      "height": "35.0431px",
      "transform": "none"
    },
    {
      "type": "TEXT",
      "text": "Food waste is rising",
      "id": "0-3",
      "left": "157.451px",
      "top": "71.85327px",
      "width": "791.987px",
      "height": "62.2745px",
      "transform": "none"
    },
    {
      "type": "TEXT",
      "text": "3/4",
      "id": "0-4",
      "left": "849.37px",
      "top": "1021.5400000000001px",
      "width": "133.264px",
      "height": "28.2px",
      "transform": "none"
    },
    {
      "type": "IMAGE",
      "id": "0-5",
      "left": "219.226px",
      "top": "471.295px",
      "width": "245.676px",
      "height": "2px",
      "transform": "rotate(-90deg)"
    },
    {
      "type": "IMAGE",
      "id": "0-6",
      "left": "124.45px",
      "top": "375.092px",
      "width": "53.2694px",
      "height": "2px",
      "transform": "rotate(-90deg)"
    },
    {
      "type": "IMAGE",
      "id": "0-7",
      "left": "371.884px",
      "top": "509.617px",
      "width": "322.319px",
      "height": "2px",
      "transform": "rotate(-90deg)"
    },
    {
      "type": "IMAGE",
      "id": "0-8",
      "left": "518.462px",
      "top": "554.018px",
      "width": "411.122px",
      "height": "2px",
      "transform": "rotate(-90deg)"
    },
    {
      "type": "IMAGE",
      "id": "0-9",
      "left": "670.705px",
      "top": "592.754px",
      "width": "488.594px",
      "height": "2px",
      "transform": "rotate(-90deg)"
    },
    {
      "type": "TEXT",
      "text": "'22",
      "id": "0-10",
      "left": "84.953px",
      "top": "284.15433px",
      "width": "133.264px",
      "height": "35.8667px",
      "transform": "none"
    },
    {
      "type": "TEXT",
      "text": "'21",
      "id": "0-11",
      "left": "275.557px",
      "top": "284.15433px",
      "width": "133.264px",
      "height": "35.8667px",
      "transform": "none"
    },
    {
      "type": "TEXT",
      "text": "'20",
      "id": "0-12",
      "left": "466.162px",
      "top": "284.15433px",
      "width": "133.264px",
      "height": "35.8667px",
      "transform": "none"
    },
    {
      "type": "TEXT",
      "text": "'19",
      "id": "0-13",
      "left": "656.766px",
      "top": "284.15433px",
      "width": "133.264px",
      "height": "35.8667px",
      "transform": "none"
    },
    {
      "type": "TEXT",
      "text": "'18",
      "id": "0-14",
      "left": "847.37px",
      "top": "284.15433px",
      "width": "133.264px",
      "height": "35.8667px",
      "transform": "none"
    }
  ]
}

The skeleton references these assets (URLs, use as-is):
["https://storage.googleapis.com/lica-video/02d97c64-18cf-4c9c-8794-df44eebf4e25.jpg", "https://storage.googleapis.com/lica-video/48b1cbbc-a61f-4f66-b08d-78481ed15f7a.svg", "https://storage.googleapis.com/lica-video/c5689c9c-38d3-4206-92e5-d1a513f628a4.svg", "https://storage.googleapis.com/lica-video/bdbf26a5-16e0-4491-9365-5cbbc15f9c31.svg", "https://storage.googleapis.com/lica-video/568d3b52-2579-4119-a80c-20e61de86f53.svg", "https://storage.googleapis.com/lica-video/8a63f026-589c-4e3f-983e-53d5c67c3586.svg", "https://storage.googleapis.com/lica-video/7424369d-914a-47ba-a714-cd57b2c6236a.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