# gdb-hub / gdb__template-4-s84

- 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`

## 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/c9862a1e-85f0-4c01-aab4-da6f1177184f.svg",
        "id": "0-0",
        "left": "34.6667px",
        "top": "-6.1338px",
        "width": "218.727px",
        "height": "193.673px",
        "transform": "rotate(-180deg)",
        "opacity": 1,
        "overflow": "hidden"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/728e62bd-f002-4947-a82f-1290dccbc28f.png",
        "id": "0-1-0",
        "left": "-50.327px",
        "top": "58.3342px",
        "width": "279.956px",
        "height": "138.379px",
        "transform": "rotate(-90deg) rotate(0deg)",
        "opacity": 1,
        "overflow": "hidden"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/030e9e9a-87e8-479c-a23a-f12df654b907.png",
        "id": "0-2",
        "left": "646.355px",
        "top": "3.91936px",
        "width": "120.624px",
        "height": "141.495px",
        "transform": "none",
        "opacity": 1,
        "overflow": "hidden"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/09dbd7fc-c51d-4752-b5b0-e4ad91ebcf92.png",
        "id": "0-3-0",
        "left": "20.4617px",
        "top": "851.084px",
        "width": "149.185px",
        "height": "217.58699999999988px",
        "transform": "rotate(0deg)",
        "opacity": 1,
        "overflow": "hidden"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/e8e5f778-651e-435a-a540-bbac20816138.png",
        "id": "0-4-0",
        "left": "57.6313px",
        "top": "891.971px",
        "width": "224.03099999999995px",
        "height": "353.4000000000001px",
        "transform": "rotate(-90deg) rotate(0deg)",
        "opacity": 1,
        "overflow": "hidden"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/c7c3cf89-d8ae-450d-8479-701cf133689a.svg",
        "id": "0-5",
        "left": "510.963px",
        "top": "790.236px",
        "width": "298.667px",
        "height": "286.177px",
        "transform": "rotate(-180deg)",
        "opacity": 1,
        "overflow": "hidden"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/86d235be-3c1f-4862-99d5-e216b72dd643.png",
        "id": "0-6-0",
        "left": "-14.2294px",
        "top": "953.295px",
        "width": "198.337px",
        "height": "118.78200000000004px",
        "transform": "rotate(0deg)",
        "opacity": 1,
        "overflow": "hidden"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/f2af0cd0-cc39-4d63-9b25-8e34bfc169a8.png",
        "id": "0-7",
        "left": "-16.9024px",
        "top": "907.838px",
        "width": "161.72px",
        "height": "158.082px",
        "transform": "rotate(83.3792deg)",
        "opacity": 1,
        "overflow": "hidden"
      },
      {
        "type": "TEXT",
        "text": "MONTHLY",
        "id": "0-8",
        "left": "192.968px",
        "top": "84.9221px",
        "width": "430.065px",
        "height": "123.784px",
        "transform": "none",
        "color": "rgb(1, 1, 1)",
        "fontSize": "52px",
        "fontFamily": "Tenor Sans--400",
        "fontWeight": "400",
        "textAlign": "center",
        "lineHeight": "60.207424px",
        "letterSpacing": "0em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "GROUP",
        "id": "0-9-0",
        "left": "114.14px",
        "top": "267.502px",
        "width": "190.8972702px",
        "height": "24.284288px",
        "transform": "none",
        "background": "rgb(252, 197, 74)",
        "backgroundColor": "rgb(252, 197, 74)",
        "clipPath": "path(\"M1993.7085453725726,256L18.68660424398505,256C8.389903946279002,256 0,247.61009605372092 0,237.3133957560149L0,18.68660424398505C0,8.389903946279002 8.389903946279002,0 18.68660424398505,0L1993.7085453725726,0C2004.0052456702783,0 2012.3951496165575,8.389903946279002 2012.3951496165575,18.68660424398505L2012.3951496165575,237.31339575601496C2012.3951496165575,247.61009605372104 2004.0052456702783,256 1993.7085453725726,256Z\")"
      },
      {
        "type": "GROUP",
        "id": "0-10-0",
        "left": "114.14px",
        "top": "294.643px",
        "width": "190.89771964000002px",
        "height": "117.581667px",
        "transform": "none",
        "background": "rgb(241, 241, 241)",
        "backgroundColor": "rgb(241, 241, 241)",
        "clipPath": "path(\"M1047.1030034847652,651L9.814272740227114,651C4.406408169081561,651 0,646.5935918309185 0,641.185727259773L0,9.814272740227114C0,4.406408169081561 4.406408169081561,0 9.814272740227114,0L1047.1030034847652,0C1052.5108680559106,0 1056.9172762249923,4.406408169081561 1056.9172762249923,9.814272740227114L1056.9172762249923,641.185727259773C1056.9172762249923,646.5935918309185 1052.5108680559106,651 1047.1030034847652,651Z\")"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/5e14b474-d184-478a-ab0a-9c18566f7e9d.svg",
        "id": "0-11",
        "left": "131.028px",
        "top": "320.248px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/7c8ef7db-9f4a-4fec-9006-51c831c8a0e5.svg",
        "id": "0-12",
        "left": "131.028px",
        "top": "341.076px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/10871fba-0daf-498c-a215-fa96e93f17ea.svg",
        "id": "0-13",
        "left": "131.028px",
        "top": "362.702px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "TEXT",
        "text": "Jan",
        "id": "0-14",
        "left": "131.028px",
        "top": "272.588px",
        "width": "157.122px",
        "height": "14.1111px",
        "color": "rgb(1, 1, 1)",
        "fontSize": "12px",
        "fontFamily": "Tenor Sans--400",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "14.111115000000002px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/c228d4cb-4838-44ae-afc9-84a145bef252.svg",
        "id": "0-15",
        "left": "131.028px",
        "top": "385.619px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "GROUP",
        "id": "0-16-0",
        "left": "312.485px",
        "top": "267.502px",
        "width": "190.8972702px",
        "height": "24.284288px",
        "transform": "none",
        "background": "rgb(252, 197, 74)",
        "backgroundColor": "rgb(252, 197, 74)",
        "clipPath": "path(\"M1993.7085453725726,256L18.68660424398505,256C8.389903946279002,256 0,247.61009605372092 0,237.3133957560149L0,18.68660424398505C0,8.389903946279002 8.389903946279002,0 18.68660424398505,0L1993.7085453725726,0C2004.0052456702783,0 2012.3951496165575,8.389903946279002 2012.3951496165575,18.68660424398505L2012.3951496165575,237.31339575601496C2012.3951496165575,247.61009605372104 2004.0052456702783,256 1993.7085453725726,256Z\")"
      },
      {
        "type": "GROUP",
        "id": "0-17-0",
        "left": "312.485px",
        "top": "294.643px",
        "width": "190.89771964000002px",
        "height": "117.581667px",
        "transform": "none",
        "background": "rgb(241, 241, 241)",
        "backgroundColor": "rgb(241, 241, 241)",
        "clipPath": "path(\"M1047.1030034847652,651L9.814272740227114,651C4.406408169081561,651 0,646.5935918309185 0,641.185727259773L0,9.814272740227114C0,4.406408169081561 4.406408169081561,0 9.814272740227114,0L1047.1030034847652,0C1052.5108680559106,0 1056.9172762249923,4.406408169081561 1056.9172762249923,9.814272740227114L1056.9172762249923,641.185727259773C1056.9172762249923,646.5935918309185 1052.5108680559106,651 1047.1030034847652,651Z\")"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/f543cd3a-85f9-44c2-8847-cf340e9397cb.svg",
        "id": "0-18",
        "left": "329.372px",
        "top": "320.248px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/f60eb609-aed4-4a98-8d90-a20849dc8ee0.svg",
        "id": "0-19",
        "left": "329.372px",
        "top": "341.076px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/617590d7-3daa-43f3-98dc-16872ae51179.svg",
        "id": "0-20",
        "left": "329.372px",
        "top": "362.702px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "TEXT",
        "text": "Feb",
        "id": "0-21",
        "left": "329.372px",
        "top": "272.588px",
        "width": "157.122px",
        "height": "14.1111px",
        "color": "rgb(1, 1, 1)",
        "fontSize": "12px",
        "fontFamily": "Tenor Sans--400",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "14.111115000000002px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/4f54501b-b4c3-496d-9a2b-1cbae4551991.svg",
        "id": "0-22",
        "left": "329.372px",
        "top": "385.619px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "GROUP",
        "id": "0-23-0",
        "left": "510.963px",
        "top": "267.502px",
        "width": "190.8972702px",
        "height": "24.284288px",
        "transform": "none",
        "background": "rgb(252, 197, 74)",
        "backgroundColor": "rgb(252, 197, 74)",
        "clipPath": "path(\"M1993.7085453725726,256L18.68660424398505,256C8.389903946279002,256 0,247.61009605372092 0,237.3133957560149L0,18.68660424398505C0,8.389903946279002 8.389903946279002,0 18.68660424398505,0L1993.7085453725726,0C2004.0052456702783,0 2012.3951496165575,8.389903946279002 2012.3951496165575,18.68660424398505L2012.3951496165575,237.31339575601496C2012.3951496165575,247.61009605372104 2004.0052456702783,256 1993.7085453725726,256Z\")"
      },
      {
        "type": "GROUP",
        "id": "0-24-0",
        "left": "510.963px",
        "top": "294.643px",
        "width": "190.89771964000002px",
        "height": "117.581667px",
        "transform": "none",
        "background": "rgb(241, 241, 241)",
        "backgroundColor": "rgb(241, 241, 241)",
        "clipPath": "path(\"M1047.1030034847652,651L9.814272740227114,651C4.406408169081561,651 0,646.5935918309185 0,641.185727259773L0,9.814272740227114C0,4.406408169081561 4.406408169081561,0 9.814272740227114,0L1047.1030034847652,0C1052.5108680559106,0 1056.9172762249923,4.406408169081561 1056.9172762249923,9.814272740227114L1056.9172762249923,641.185727259773C1056.9172762249923,646.5935918309185 1052.5108680559106,651 1047.1030034847652,651Z\")"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/a88dd2c8-6cd7-4717-bec4-b8de03ca5dea.svg",
        "id": "0-25",
        "left": "527.85px",
        "top": "320.248px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/a32b116c-be3e-43f5-b6b3-dd0cb9f226fc.svg",
        "id": "0-26",
        "left": "527.85px",
        "top": "341.076px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/971a1ae5-e935-495c-831e-695b9b4b9b0c.svg",
        "id": "0-27",
        "left": "527.85px",
        "top": "362.702px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "TEXT",
        "text": "Mar",
        "id": "0-28",
        "left": "527.85px",
        "top": "272.588px",
        "width": "157.122px",
        "height": "14.1111px",
        "color": "rgb(1, 1, 1)",
        "fontSize": "12px",
        "fontFamily": "Tenor Sans--400",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "14.111115000000002px",
        "letterSpacing": "0em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/a6b2f933-ecb1-43a1-940b-e93986c7e055.svg",
        "id": "0-29",
        "left": "527.85px",
        "top": "385.619px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "GROUP",
        "id": "0-30-0",
        "left": "114.14px",
        "top": "421.783px",
        "width": "190.8972702px",
        "height": "24.284288px",
        "transform": "none",
        "background": "rgb(252, 197, 74)",
        "backgroundColor": "rgb(252, 197, 74)",
        "clipPath": "path(\"M1993.7085453725726,256L18.68660424398505,256C8.389903946279002,256 0,247.61009605372092 0,237.3133957560149L0,18.68660424398505C0,8.389903946279002 8.389903946279002,0 18.68660424398505,0L1993.7085453725726,0C2004.0052456702783,0 2012.3951496165575,8.389903946279002 2012.3951496165575,18.68660424398505L2012.3951496165575,237.31339575601496C2012.3951496165575,247.61009605372104 2004.0052456702783,256 1993.7085453725726,256Z\")"
      },
      {
        "type": "GROUP",
        "id": "0-31-0",
        "left": "114.14px",
        "top": "448.924px",
        "width": "190.89771964000002px",
        "height": "117.581667px",
        "transform": "none",
        "background": "rgb(241, 241, 241)",
        "backgroundColor": "rgb(241, 241, 241)",
        "clipPath": "path(\"M1047.1030034847652,651L9.814272740227114,651C4.406408169081561,651 0,646.5935918309185 0,641.185727259773L0,9.814272740227114C0,4.406408169081561 4.406408169081561,0 9.814272740227114,0L1047.1030034847652,0C1052.5108680559106,0 1056.9172762249923,4.406408169081561 1056.9172762249923,9.814272740227114L1056.9172762249923,641.185727259773C1056.9172762249923,646.5935918309185 1052.5108680559106,651 1047.1030034847652,651Z\")"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/82ea37f2-e938-4a1a-96a3-a661b59f5af7.svg",
        "id": "0-32",
        "left": "131.028px",
        "top": "474.53px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/46116e5c-b1bb-495e-a331-9a0608d9ef98.svg",
        "id": "0-33",
        "left": "131.028px",
        "top": "495.357px",
        "width": "157.122px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/74121baf-de85-43a6-af69-c7a5023974c2.svg",
        "id": "0-34",
        "left": "131.028px",
        "top": "516.983px",
        "width": "157.122px",
```
_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