# gdb-hub / gdb__template-4-s17

- 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`
- `/workspace/inputs/input_7.png`
- `/workspace/inputs/input_8.png`
- `/workspace/inputs/input_9.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/b9ebb907-cf85-491d-a523-95476bbda72b.png",
        "id": "0-0-0",
        "left": "277.01px",
        "top": "33.3488px",
        "width": "265.96720000000005px",
        "height": "251.57300000000004px",
        "transform": "rotate(0deg)",
        "overflow": "hidden"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/ef2a176c-8598-4d3f-9838-fc4a68731d4f.svg",
        "id": "0-1",
        "left": "127.72px",
        "top": "807.664px",
        "width": "558.969px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/20d2d652-5df7-4a18-8b54-ea40f8f53b64.svg",
        "id": "0-2",
        "left": "127.72px",
        "top": "843.959px",
        "width": "558.969px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/fa432de4-8c33-4302-b6d0-c5ffbd778bbd.svg",
        "id": "0-3",
        "left": "127.781px",
        "top": "880.254px",
        "width": "558.907px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/29dce16d-ca24-4b71-81e7-9036e56544de.svg",
        "id": "0-4",
        "left": "127.781px",
        "top": "916.549px",
        "width": "558.907px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/26f68964-4198-4981-9301-421d317e7840.svg",
        "id": "0-5",
        "left": "127.75px",
        "top": "952.844px",
        "width": "558.938px",
        "height": "1px"
      },
      {
        "type": "IMAGE",
        "src": "https://storage.googleapis.com/lica-video/5fe10c18-5d63-4849-a628-302789a3194c.svg",
        "id": "0-6",
        "left": "127.75px",
        "top": "989.139px",
        "width": "558.938px",
        "height": "1px"
      },
      {
        "type": "GROUP",
        "id": "0-7-0",
        "left": "111.327px",
        "top": "381.576px",
        "width": "79.432755282px",
        "height": "34.040064px",
        "transform": "none",
        "background": "rgb(189, 195, 181)",
        "backgroundColor": "rgb(189, 195, 181)",
        "clipPath": "path(\"M0,0L597.3775699253796,0L597.3775699253796,256L0,256Z\")"
      },
      {
        "type": "TEXT",
        "text": "MAY '22",
        "id": "0-8",
        "left": "130.154099px",
        "top": "321.65339px",
        "width": "566.619px",
        "height": "45.6807px",
        "transform": "none",
        "color": "rgb(85, 85, 85)",
        "fontSize": "38px",
        "fontFamily": "League Spartan--400",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "34.934954000000005px",
        "letterSpacing": "0.02em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "GROUP",
        "id": "0-9-0",
        "left": "455.831px",
        "top": "381.576px",
        "width": "79.432755282px",
        "height": "34.040064px",
        "transform": "none",
        "background": "rgb(189, 195, 181)",
        "backgroundColor": "rgb(189, 195, 181)",
        "clipPath": "path(\"M0,0L597.3775699253796,0L597.3775699253796,256L0,256Z\")"
      },
      {
        "type": "GROUP",
        "id": "0-10-0",
        "left": "542.258px",
        "top": "381.576px",
        "width": "79.432755282px",
        "height": "34.040064px",
        "transform": "none",
        "background": "rgb(189, 195, 181)",
        "backgroundColor": "rgb(189, 195, 181)",
        "clipPath": "path(\"M0,0L597.3775699253796,0L597.3775699253796,256L0,256Z\")"
      },
      {
        "type": "GROUP",
        "id": "0-11-0",
        "left": "629.228px",
        "top": "381.576px",
        "width": "79.432755282px",
        "height": "34.040064px",
        "transform": "none",
        "background": "rgb(189, 195, 181)",
        "backgroundColor": "rgb(189, 195, 181)",
        "clipPath": "path(\"M0,0L597.3775699253796,0L597.3775699253796,256L0,256Z\")"
      },
      {
        "type": "TEXT",
        "text": "SUN",
        "id": "0-12",
        "left": "633.211508px",
        "top": "382.93992000000003px",
        "width": "72.1837px",
        "height": "24.1219px",
        "transform": "none",
        "color": "rgb(85, 85, 85)",
        "fontSize": "20px",
        "fontFamily": "Alice--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "28.173350000000003px",
        "letterSpacing": "0.02em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "1",
        "id": "0-13",
        "left": "653.134952px",
        "top": "429.19248px",
        "width": "32.1709px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.02em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "8",
        "id": "0-14",
        "left": "649.4829520000001px",
        "top": "489.72348px",
        "width": "39.476px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.02em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "15",
        "id": "0-15",
        "left": "649.162952px",
        "top": "548.9734800000001px",
        "width": "40.1156px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.02em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "22",
        "id": "0-16",
        "left": "649.162952px",
        "top": "608.47848px",
        "width": "40.1156px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.02em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "SAT",
        "id": "0-17",
        "left": "547.220508px",
        "top": "382.93992000000003px",
        "width": "70.2264px",
        "height": "24.1219px",
        "transform": "none",
        "color": "rgb(85, 85, 85)",
        "fontSize": "20px",
        "fontFamily": "Alice--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "28.173350000000003px",
        "letterSpacing": "0.02em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "7",
        "id": "0-18",
        "left": "560.4669520000001px",
        "top": "489.72348px",
        "width": "43.5676px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.02em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "14",
        "id": "0-19",
        "left": "560.146952px",
        "top": "548.9734800000001px",
        "width": "44.2071px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.02em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "21",
        "id": "0-20",
        "left": "560.146952px",
        "top": "608.47848px",
        "width": "44.2071px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.02em",
        "textTransform": "none",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "MON",
        "id": "0-21",
        "left": "117.10977px",
        "top": "382.93992000000003px",
        "width": "69.6644px",
        "height": "24.1219px",
        "transform": "none",
        "color": "rgb(85, 85, 85)",
        "fontSize": "20px",
        "fontFamily": "Alice--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "28.173350000000003px",
        "letterSpacing": "0.05em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "2",
        "id": "0-22",
        "left": "127.82338px",
        "top": "489.72348px",
        "width": "47.8234px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.05em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "9",
        "id": "0-23",
        "left": "130.40537999999998px",
        "top": "548.9734800000001px",
        "width": "42.6602px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.05em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "16",
        "id": "0-24",
        "left": "130.40537999999998px",
        "top": "608.47848px",
        "width": "42.6602px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.05em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "23",
        "id": "0-25",
        "left": "130.16538000000003px",
        "top": "668.26848px",
        "width": "43.1397px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.05em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "30",
        "id": "0-26",
        "left": "130.16538000000003px",
        "top": "725.5714800000001px",
        "width": "43.1397px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.05em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "GROUP",
        "id": "0-27-0",
        "left": "197.536px",
        "top": "381.576px",
        "width": "79.432755282px",
        "height": "34.040064px",
        "transform": "none",
        "background": "rgb(189, 195, 181)",
        "backgroundColor": "rgb(189, 195, 181)",
        "clipPath": "path(\"M0,0L597.3775699253796,0L597.3775699253796,256L0,256Z\")"
      },
      {
        "type": "TEXT",
        "text": "TUE",
        "id": "0-28",
        "left": "203.86477000000002px",
        "top": "382.93992000000003px",
        "width": "68.572px",
        "height": "24.1219px",
        "transform": "none",
        "color": "rgb(85, 85, 85)",
        "fontSize": "20px",
        "fontFamily": "Alice--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "28.173350000000003px",
        "letterSpacing": "0.05em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "3",
        "id": "0-29",
        "left": "217.79038000000003px",
        "top": "489.72348px",
        "width": "40.309px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.05em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "10",
        "id": "0-30",
        "left": "217.79038000000003px",
        "top": "548.9734800000001px",
        "width": "40.309px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.05em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "17",
        "id": "0-31",
        "left": "217.79038000000003px",
        "top": "608.47848px",
        "width": "40.309px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rgb(92, 80, 72)",
        "fontSize": "19px",
        "fontFamily": "Roboto--700",
        "fontWeight": "700",
        "textAlign": "center",
        "lineHeight": "26.51773px",
        "letterSpacing": "0.05em",
        "textTransform": "uppercase",
        "fontStyle": "normal"
      },
      {
        "type": "TEXT",
        "text": "24",
        "id": "0-32",
        "left": "218.11038000000002px",
        "top": "668.26848px",
        "width": "39.6695px",
        "height": "22.6524px",
        "transform": "none",
        "color": "rg
```
_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
