# gdb-hub / gdb__template-4-s102

- 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`
- `/workspace/inputs/input_2.png`
- `/workspace/inputs/input_3.png`
- `/workspace/inputs/input_4.png`
- `/workspace/inputs/input_5.png`
- `/workspace/inputs/input_6.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/5a95edca-577f-4d8c-bb41-58f57e278b7b.jpg",
        "id": "0-0-0",
        "left": "0.0px",
        "top": "-455.336px",
        "width": "1320.54px",
        "height": "1982.05px",
        "transform": "rotate(0deg)",
        "opacity": 1,
        "overflow": "visible"
      },
      {
        "type": "GROUP",
        "id": "0-1-0-0",
        "width": "1080.0px",
        "height": "1350.0px",
        "transform": "none",
        "background": "rgb(1, 1, 1)",
        "backgroundColor": "rgb(1, 1, 1)",
        "clipPath": "path(\"M0,0L256,0L256,320L0,320Z\")"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/2a97b787-5030-4cdd-ba90-0fac69d9f26e.jpg",
        "id": "0-1-1-0",
        "left": "-135.0px",
        "top": "135.0px",
        "width": "1350.0px",
        "height": "1080.0px",
        "transform": "rotate(90deg) rotate(0deg)",
        "opacity": 1,
        "overflow": "hidden"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/10ef51e4-9e02-4253-82c7-6760f0b462cb.svg",
        "id": "0-2",
        "left": "108px",
        "top": "893.249px",
        "width": "588.007px",
        "height": "1px"
      },
      {
        "type": "TEXT",
        "text": "\"I asked my audience ______. Here's what they said.\"",
        "id": "0-3",
        "left": "108px",
        "top": "726.819px",
        "width": "619.946px",
        "height": "108px",
        "color": "rgb(252, 252, 252)",
        "fontSize": "45px",
        "fontFamily": "Inter--400",
        "fontWeight": "400",
        "textAlign": "left",
        "lineHeight": "54.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "Prompt 6",
        "id": "0-4",
        "left": "108.0px",
        "top": "639.9805100000001px",
        "width": "432px",
        "height": "67.677px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "56px",
        "fontFamily": "Inter--700",
        "fontWeight": "700",
        "textAlign": "left",
        "lineHeight": "62.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "TURN ENGAGEMENT INTO CONTENT. POLLS, REPLIES, DMS FUEL STORIES.",
        "id": "0-5",
        "left": "108.0px",
        "top": "954.86667px",
        "width": "557.522px",
        "height": "196.373px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "43px",
        "fontFamily": "Inter--700",
        "fontWeight": "700",
        "textAlign": "left",
        "lineHeight": "48.0px",
        "letterSpacing": "0em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/53b0c516-3f06-4934-b8a8-fe6db727af8f.svg",
        "id": "0-6",
        "left": "9.09495e-13px",
        "top": "76.6574px",
        "width": "1080px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/d2b3c365-52a3-45c2-8b70-2904433a9637.svg",
        "id": "0-7",
        "left": "4.54747e-13px",
        "top": "1267.41px",
        "width": "1080px",
        "height": "1px"
      },
      {
        "type": "TEXT",
        "text": "Hannover & Tyke",
        "id": "0-8",
        "left": "45.2369px",
        "top": "30.552459999999996px",
        "width": "432px",
        "height": "26.5333px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "22px",
        "fontFamily": "Inter--400",
        "fontWeight": "400",
        "textAlign": "left",
        "lineHeight": "22.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "07/09",
        "id": "0-9",
        "left": "602.763px",
        "top": "30.552459999999996px",
        "width": "432px",
        "height": "26.5333px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "22px",
        "fontFamily": "Inter--400",
        "fontWeight": "400",
        "textAlign": "right",
        "lineHeight": "22.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "2025",
        "id": "0-10",
        "left": "45.2369px",
        "top": "1294.79666px",
        "width": "432px",
        "height": "26.5333px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "22px",
        "fontFamily": "Inter--400",
        "fontWeight": "400",
        "textAlign": "left",
        "lineHeight": "22.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "@loremipsum",
        "id": "0-11",
        "left": "602.763px",
        "top": "1294.79666px",
        "width": "432px",
        "height": "26.5333px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "22px",
        "fontFamily": "Inter--400",
        "fontWeight": "400",
        "textAlign": "right",
        "lineHeight": "22.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      }
    ],
    "background": "rgb(252, 252, 252)",
    "width": "1080px",
    "height": "1350px",
    "duration": 3
  },
  {
    "components": [
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/98c753c5-bc31-4cee-a87a-ffcc006c34b9.jpg",
        "id": "0-0-0",
        "left": "0.0px",
        "top": "-312.944px",
        "width": "1322.79px",
        "height": "1985.42px",
        "transform": "rotate(0deg)",
        "opacity": 1,
        "overflow": "visible"
      },
      {
        "type": "GROUP",
        "id": "0-1-0-0",
        "width": "1080.0px",
        "height": "1350.0px",
        "transform": "none",
        "background": "rgb(1, 1, 1)",
        "backgroundColor": "rgb(1, 1, 1)",
        "clipPath": "path(\"M0,0L256,0L256,320L0,320Z\")"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/b37f1896-ba66-466f-a1b4-42d2a31bc03b.jpg",
        "id": "0-1-1-0",
        "left": "-135.0px",
        "top": "135.0px",
        "width": "1350.0px",
        "height": "1080.0px",
        "transform": "rotate(90deg) rotate(0deg)",
        "opacity": 1,
        "overflow": "hidden"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/3279df1e-0f99-4361-a0d9-e268d163a503.svg",
        "id": "0-2",
        "left": "108px",
        "top": "522.664px",
        "width": "619.946px",
        "height": "1px"
      },
      {
        "type": "TEXT",
        "text": "\"Right now, I'm in the middle of ______, and here's what it's teaching me.\"",
        "id": "0-3",
        "left": "108px",
        "top": "297.421px",
        "width": "619.946px",
        "height": "162px",
        "color": "rgb(252, 252, 252)",
        "fontSize": "45px",
        "fontFamily": "Inter--400",
        "fontWeight": "400",
        "textAlign": "left",
        "lineHeight": "54.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "Prompt 7",
        "id": "0-4",
        "left": "108.0px",
        "top": "210.58251px",
        "width": "432px",
        "height": "67.677px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "56px",
        "fontFamily": "Inter--700",
        "fontWeight": "700",
        "textAlign": "left",
        "lineHeight": "62.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "SHOW REAL-TIME GROWTH. PEOPLE LOVE \"DURING,\" NOT JUST \"BEFORE & AFTER.\"",
        "id": "0-5",
        "left": "108.0px",
        "top": "589.0946700000001px",
        "width": "619.946px",
        "height": "196.373px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "43px",
        "fontFamily": "Inter--700",
        "fontWeight": "700",
        "textAlign": "left",
        "lineHeight": "48.0px",
        "letterSpacing": "0em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/55577751-0795-479f-a5ff-20d6519d8db1.svg",
        "id": "0-6",
        "left": "9.09495e-13px",
        "top": "76.6574px",
        "width": "1080px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/499ef8fd-0602-4459-a0da-ae8a35714263.svg",
        "id": "0-7",
        "left": "4.54747e-13px",
        "top": "1267.41px",
        "width": "1080px",
        "height": "1px"
      },
      {
        "type": "TEXT",
        "text": "Hannover & Tyke",
        "id": "0-8",
        "left": "45.2369px",
        "top": "30.552459999999996px",
        "width": "432px",
        "height": "26.5333px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "22px",
        "fontFamily": "Inter--400",
        "fontWeight": "400",
        "textAlign": "left",
        "lineHeight": "22.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "08/09",
        "id": "0-9",
        "left": "602.763px",
        "top": "30.552459999999996px",
        "width": "432px",
        "height": "26.5333px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "22px",
        "fontFamily": "Inter--400",
        "fontWeight": "400",
        "textAlign": "right",
        "lineHeight": "22.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "2025",
        "id": "0-10",
        "left": "45.2369px",
        "top": "1294.79666px",
        "width": "432px",
        "height": "26.5333px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "22px",
        "fontFamily": "Inter--400",
        "fontWeight": "400",
        "textAlign": "left",
        "lineHeight": "22.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "@loremipsum",
        "id": "0-11",
        "left": "602.763px",
        "top": "1294.79666px",
        "width": "432px",
        "height": "26.5333px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "22px",
        "fontFamily": "Inter--400",
        "fontWeight": "400",
        "textAlign": "right",
        "lineHeight": "22.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      }
    ],
    "background": "rgb(252, 252, 252)",
    "width": "1080px",
    "height": "1350px",
    "duration": 3
  },
  {
    "components": [
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/4bbb99d4-eb0e-463b-ae25-0de984d8390b.jpg",
        "id": "0-0-0",
        "left": "-29.1666px",
        "top": "-24.1694px",
        "width": "-1171.32px",
        "height": "1758.07px",
        "transform": "scale(-1, 1) rotate(0deg)",
        "opacity": 1,
        "overflow": "visible"
      },
      {
        "type": "GROUP",
        "id": "0-1-0-0",
        "width": "1080.0px",
        "height": "1350.0px",
        "transform": "none",
        "background": "rgb(1, 1, 1)",
        "backgroundColor": "rgb(1, 1, 1)",
        "clipPath": "path(\"M0,0L256,0L256,320L0,320Z\")"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/cc74dd03-d9bc-4f2c-acf1-7a1259dd810a.jpg",
        "id": "0-1-1-0",
        "left": "-135.0px",
        "top": "135.0px",
        "width": "1350.0px",
        "height": "1080.0px",
        "transform": "rotate(90deg) rotate(0deg)",
        "opacity": 1,
        "overflow": "hidden"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/94666744-7af9-4558-bf29-fed78a2b2795.svg",
        "id": "0-2",
        "left": "9.09495e-13px",
        "top": "76.6574px",
        "width": "1080px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/bca7108f-0a12-452d-8066-789869481714.svg",
        "id": "0-3",
        "left": "4.54747e-13px",
        "top": "1267.41px",
        "width": "1080px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/4abeb855-4f05-4dea-b025-5e6788881e4d.svg",
        "id": "0-4",
        "left": "383.993px",
        "top": "464.688px",
        "width": "588.007px",
        "height": "1px"
      },
      {
        "type": "TEXT",
        "text": "\"This tiny change made a huge difference in ______.\"",
        "id": "0-5",
        "left": "352.054px",
        "top": "302.007px",
        "width": "619.946px",
        "height": "108px",
        "color": "rgb(252, 252, 252)",
        "fontSize": "45px",
        "fontFamily": "Inter--400",
        "fontWeight": "400",
        "textAlign": "right",
        "lineHeight": "54.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "Prompt 5",
        "id": "0-6",
        "left": "540.0px",
        "top": "215.16851000000003px",
        "width": "432px",
        "height": "67.677px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "56px",
        "fontFamily": "Inter--700",
        "fontWeight": "700",
        "textAlign": "right",
        "lineHeight": "62.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "Hannover & Tyke",
        "id": "0-7",
        "left": "45.2369px",
        "top": "30.552459999999996px",
        "width": "432px",
        "height": "26.5333px",
        "transform": "none",
        "color": "rgb(252, 252, 252)",
        "fontSize": "22px",
        "fontFamily": "Inter--400",
        "fontWeight": "400",
        "textAlign": "left",
        "lineHeight": "22.0px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "06/09",
        "id": "0-8",
        "left": "602.763px",
        "top": "30.552459999999996px",
        "width": "432px",
        "height"
```
_instruction cut at 16k characters_
---
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