CDP visual audit
2026-08-30T00:17:44.119Z
viewport 1440x900, tolerance 1px, theme light

=== /preview/demo  (vs demo.html)  —  216 differences ===

body
    h:  1578.9  →  2338.9  (+760px)
    height:  1578.89px  →  2338.89px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main  [preview-root]
    h:  1578.9  →  2338.9  (+760px)
    height:  1578.89px  →  2338.89px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header  [topbar]
    position:  static  →  sticky
    top:  auto  →  0px
    z-index:  auto  →  20
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > a  [brand]
    w:  231.5  →  246.8  (+15.3px)
    width:  231.469px  →  246.812px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > a > span:nth-of-type(1)  [brand-mark]  "EP"
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(255, 255, 255)

body > main > header > a > span:nth-of-type(2)  "easy-png-tools"
    w:  107.8  →  117.6  (+9.8px)
    width:  107.766px  →  117.609px
    height:  17px  →  18px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > a > span:nth-of-type(3)  [version]  "/ WORKSPACE"
    x:  215.4  →  225.2  (+9.8px)
    w:  73.7  →  79.2  (+5.5px)
    width:  73.7031px  →  79.2031px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)

body > main > header > div  [top-actions]
    x:  1117.1  →  1104.6  (-12.5px)
    w:  265.3  →  277.8  (+12.5px)
    width:  265.328px  →  277.812px
    height:  29px  →  28px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > div > span  [status]  "AUTO PIPELINE"
    x:  1117.1  →  1104.6  (-12.5px)
    w:  94.9  →  103.4  (+8.5px)
    width:  94.875px  →  103.406px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > header > div > span > i  [status-dot]
    x:  1117.1  →  1104.6  (-12.5px)
    w:  6  →  8  (+2px)
    h:  6  →  8  (+2px)
    width:  6px  →  8px
    height:  6px  →  8px
    box-shadow:  none  →  color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > header > div > button:nth-of-type(1)  [icon-btn icon-btn--bare]
    x:  1228  →  1224  (-4px)
    display:  grid  →  flex
    justify-content:  normal  →  center
    grid-template-columns:  17px  →  none
    grid-template-rows:  17px  →  none
    width:  29px  →  28px
    height:  29px  →  28px
    background-position:  0px 0px  →  0% 0%
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > header > div > button:nth-of-type(1) > svg  [lucide lucide-circle-question-mark lucide-icon]
    x:  1234  →  1230  (-4px)
    width:  17px  →  16px
    height:  17px  →  16px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > header > div > button:nth-of-type(2)  [icon-btn icon-btn--bare]
    x:  1273  →  1268  (-5px)
    display:  grid  →  flex
    justify-content:  normal  →  center
    grid-template-columns:  17px  →  none
    grid-template-rows:  17px  →  none
    width:  29px  →  28px
    height:  29px  →  28px
    background-position:  0px 0px  →  0% 0%
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > header > div > button:nth-of-type(2) > svg  [lucide lucide-icon lucide-moon]
    x:  1279  →  1274  (-5px)
    width:  17px  →  16px
    height:  17px  →  16px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > header > div > div  [lang]
    x:  1318  →  1312  (-6px)
    w:  64.5  →  70.4  (+5.9px)
    align-items:  center  →  normal
    width:  64.4531px  →  70.4062px
    height:  26px  →  27px
    overflow:  visible  →  hidden
    border-radius:  0px  →  4px

body > main > header > div > div > span  [lang-div]  "/"
    x:  1348  →  1344.2  (-3.8px)
    y:  19.5  →  25  (+5.5px)
    w:  4.5  →  6  (+1.5px)
    h:  24  →  13  (-11px)
    align-self:  auto  →  center
    width:  4.45312px  →  6px
    height:  24px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    color:  rgb(23, 33, 43)  →  rgb(109, 120, 131)
    font-family:  "IBM Plex Sans", sans-serif  →  "IBM Plex Mono", monospace
    font-size:  16px  →  10px
    line-height:  24px  →  normal

body > main > header > div > div > button:nth-of-type(2)  [lang-btn]  "EN"
    x:  1352.4  →  1350.2  (-2.2px)
    w:  29  →  31.2  (+2.2px)
    width:  29px  →  31.2031px
    height:  24px  →  25px
    background-position:  0px 0px  →  0% 0%
    letter-spacing:  normal  →  0.6px

body > main > header > div > div > button:nth-of-type(1)  [active lang-btn]  "RU"
    x:  1319  →  1313  (-6px)
    w:  29  →  31.2  (+2.2px)
    width:  29px  →  31.2031px
    height:  24px  →  25px
    letter-spacing:  normal  →  0.6px

body > main > header > nav  [nav]
    x:  792.1  →  528.2  (-263.9px)
    y:  25.5  →  24  (-1.5px)
    w:  296.9  →  376.6  (+79.7px)
    h:  12  →  15  (+3px)
    row-gap:  22px  →  18px
    column-gap:  22px  →  18px
    margin-right:  28px  →  0px
    margin-left:  503.078px  →  24px
    width:  296.938px  →  376.594px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > nav > a:nth-of-type(1)  "Workspace"
    x:  792.1  →  528.2  (-263.9px)
    y:  25.5  →  24  (-1.5px)
    w:  49.5  →  69.1  (+19.6px)
    h:  12  →  15  (+3px)
    width:  49.4844px  →  69.125px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > header > nav > a:nth-of-type(2)  "Catalog"
    x:  863.6  →  615.3  (-248.3px)
    y:  25.5  →  24  (-1.5px)
    w:  38.5  →  53.8  (+15.3px)
    h:  12  →  15  (+3px)
    width:  38.5px  →  53.7656px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > header > nav > a:nth-of-type(3)  "Gradient"
    x:  924.1  →  687.1  (-237px)
    y:  25.5  →  24  (-1.5px)
    w:  44  →  61.5  (+17.5px)
    h:  12  →  15  (+3px)
    width:  43.9844px  →  61.4531px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > header > nav > a:nth-of-type(4)  "Background remover"
    x:  990.1  →  766.5  (-223.6px)
    y:  25.5  →  24  (-1.5px)
    w:  99  →  138.3  (+39.3px)
    h:  12  →  15  (+3px)
    width:  98.9688px  →  138.25px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > div  [ws]
    h:  1468.9  →  2228.9  (+760px)
    grid-template-rows:  1336.89px  →  2096.89px
    height:  1468.89px  →  2228.89px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(2)  [preview-panel]
    h:  1336.9  →  2096.9  (+760px)
    align-self:  start  →  auto
    height:  1336.89px  →  2096.89px

body > main > div > section:nth-of-type(2) > div:nth-of-type(2)  [preview-stack]
    y:  320  →  301.3  (-18.7px)
    h:  1093.4  →  1872.1  (+778.7px)
    grid-template-columns:  276.328px 276.344px  →  564.672px
    grid-template-rows:  345.797px 345.797px 345.797px  →  358.422px 358.422px 358.422px 358.422px 358.422px
    height:  1093.39px  →  1872.11px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1)  [preview-tile]
    y:  336  →  317.3  (-18.7px)
    w:  276.3  →  564.7  (+288.4px)
    h:  345.8  →  358.4  (+12.6px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  4.8px
    column-gap:  normal  →  4.8px
    padding-top:  0px  →  6.4px
    padding-right:  0px  →  6.4px
    padding-bottom:  0px  →  6.4px
    padding-left:  0px  →  6.4px
    width:  276.328px  →  564.672px
    height:  345.797px  →  358.422px
    min-width:  0px  →  auto
    overflow:  hidden  →  visible
    border-radius:  0px  →  4px
    background-color:  rgb(238, 241, 244)  →  rgb(248, 250, 251)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1)  [tile-canvas]
    x:  799.7  →  806.1  (+6.4px)
    y:  337  →  324.7  (-12.3px)
    w:  274.3  →  549.9  (+275.6px)
    h:  316.8  →  325.8  (+9px)
    display:  grid  →  block
    align-items:  center  →  normal
    grid-template-columns:  242.328px  →  none
    grid-template-rows:  284.797px  →  none
    padding-top:  16px  →  0px
    padding-right:  16px  →  0px
    padding-bottom:  16px  →  0px
    padding-left:  16px  →  0px
    width:  274.328px  →  549.891px
    height:  316.797px  →  325.844px
    min-width:  0px  →  auto
    min-height:  316.8px  →  120px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    border-radius:  0px  →  4px
    background-color:  rgb(228, 232, 235)  →  rgba(0, 0, 0, 0)
    background-image:  linear-gradient(45deg, rgb(210, 216, 220) 25%, rgba(0, 0, 0, 0) 25%), linear-gradient(-45deg, rgb(210, 216, 220) 25%, rgba(0, 0, 0, 0) 25%), linear-gradient(45deg, rgba(0, 0, 0, 0) 75%, rgb(210, 216, 220) 75%), linear-gradient(-45deg, rgba(0, 0, 0, 0) 75%, rgb(210, 216, 220) 75%)  →  none
    background-size:  14px 14px, 14px 14px, 14px 14px, 14px 14px  →  auto
    background-position:  0px 0px, 0px 7px, 7px -7px, -7px 0px  →  0% 0%

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div  [ph]
    x:  840  →  806.1  (-33.9px)
    y:  430.8  →  324.7  (-106.1px)
    w:  193.9  →  439.9  (+246px)
    h:  129.2  →  325.8  (+196.6px)
    width:  193.859px  →  439.906px
    height:  129.234px  →  325.844px
    min-height:  auto  →  0px
    max-width:  100%  →  none
    overflow:  hidden  →  visible
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(22, 32, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div > span:nth-of-type(1)  [sample-icon]  "PNG"
    x:  923.5  →  1012  (+88.5px)
    y:  477.9  →  469.1  (-8.8px)
    w:  26.9  →  28.2  (+1.3px)
    width:  26.8594px  →  28.2031px
    height:  18px  →  19px

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div > span:nth-of-type(2)  "easy-png-tools"
    x:  898.4  →  984.1  (+85.7px)
    y:  500.9  →  493.1  (-7.8px)
    w:  77  →  84  (+7px)
    width:  76.9844px  →  84px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(22, 32, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2)  [tile-label]
    x:  799.7  →  806.1  (+6.4px)
    y:  653.8  →  655.3  (+1.5px)
    w:  274.3  →  549.9  (+275.6px)
    h:  27  →  13  (-14px)
    align-items:  normal  →  baseline
    padding-top:  8px  →  0px
    padding-right:  8px  →  0px
    padding-bottom:  8px  →  0px
    padding-left:  8px  →  0px
    width:  274.328px  →  549.891px
    height:  27px  →  13px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  9px  →  16px
    line-height:  normal  →  24px

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > span  "SOURCE"
    x:  807.7  →  806.1  (-1.6px)
    y:  662.8  →  655.3  (-7.5px)
    w:  29.7  →  40.8  (+11.1px)
    h:  10  →  13  (+3px)
    width:  29.7031px  →  40.8125px
    height:  10px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    font-size:  9px  →  10px
    letter-spacing:  normal  →  0.8px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > b  "original.png · 1200 × 800"
    x:  942.3  →  1206  (+263.7px)
    y:  662.8  →  655.3  (-7.5px)
    w:  123.7  →  150  (+26.3px)
    h:  10  →  13  (+3px)
    width:  123.719px  →  150px
    height:  10px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  9px  →  10px
    text-align:  right  →  start

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2)  [preview-tile]
    x:  1087  →  798.7  (-288.3px)
    y:  336  →  687.7  (+351.7px)
    w:  276.3  →  564.7  (+288.4px)
    h:  345.8  →  358.4  (+12.6px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  4.8px
    column-gap:  normal  →  4.8px
    padding-top:  0px  →  6.4px
    padding-right:  0px  →  6.4px
    padding-bottom:  0px  →  6.4px
    padding-left:  0px  →  6.4px
    width:  276.344px  →  564.672px
    height:  345.797px  →  358.422px
    min-width:  0px  →  auto
    overflow:  hidden  →  visible
    border-radius:  0px  →  4px
    background-color:  rgb(238, 241, 244)  →  rgb(248, 250, 251)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1)  [tile-canvas]
    x:  1088  →  806.1  (-281.9px)
    y:  337  →  695.1  (+358.1px)
    w:  274.3  →  549.9  (+275.6px)
    h:  316.8  →  325.8  (+9px)
    display:  grid  →  block
    align-items:  center  →  normal
    grid-template-columns:  242.344px  →  none
    grid-template-rows:  284.797px  →  none
    padding-top:  16px  →  0px
    padding-right:  16px  →  0px
    padding-bottom:  16px  →  0px
    padding-left:  16px  →  0px
    width:  274.344px  →  549.891px
    height:  316.797px  →  325.844px
    min-width:  0px  →  auto
    min-height:  316.8px  →  120px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    border-radius:  0px  →  4px
    background-color:  rgb(228, 232, 235)  →  rgba(0, 0, 0, 0)
    background-image:  linear-gradient(45deg, rgb(210, 216, 220) 25%, rgba(0, 0, 0, 0) 25%), linear-gradient(-45deg, rgb(210, 216, 220) 25%, rgba(0, 0, 0, 0) 25%), linear-gradient(45deg, rgba(0, 0, 0, 0) 75%, rgb(210, 216, 220) 75%), linear-gradient(-45deg, rgba(0, 0, 0, 0) 75%, rgb(210, 216, 220) 75%)  →  none
    background-size:  14px 14px, 14px 14px, 14px 14px, 14px 14px  →  auto
    background-position:  0px 0px, 0px 7px, 7px -7px, -7px 0px  →  0% 0%

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div  [ph]
    x:  1128.3  →  806.1  (-322.2px)
    y:  430.8  →  695.1  (+264.3px)
    w:  193.9  →  439.9  (+246px)
    h:  129.3  →  325.8  (+196.5px)
    width:  193.875px  →  439.906px
    height:  129.25px  →  325.844px
    min-height:  auto  →  0px
    max-width:  100%  →  none
    overflow:  hidden  →  visible
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(22, 32, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div > span:nth-of-type(1)  [sample-icon]  "PNG"
    x:  1211.8  →  1012  (-199.8px)
    y:  477.9  →  839.5  (+361.6px)
    w:  26.9  →  28.2  (+1.3px)
    width:  26.8594px  →  28.2031px
    height:  18px  →  19px

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div > span:nth-of-type(2)  "easy-png-tools"
    x:  1186.7  →  984.1  (-202.6px)
    y:  500.9  →  863.5  (+362.6px)
    w:  77  →  84  (+7px)
    width:  76.9844px  →  84px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(22, 32, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2)  [tile-label]
    x:  1088  →  806.1  (-281.9px)
    y:  653.8  →  1025.7  (+371.9px)
    w:  274.3  →  549.9  (+275.6px)
    h:  27  →  13  (-14px)
    align-items:  normal  →  baseline
    padding-top:  8px  →  0px
    padding-right:  8px  →  0px
    padding-bottom:  8px  →  0px
    padding-left:  8px  →  0px
    width:  274.344px  →  549.891px
    height:  27px  →  13px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  9px  →  16px
    line-height:  normal  →  24px

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > span  "STEP 01"
    x:  1096  →  806.1  (-289.9px)
    y:  662.8  →  1025.7  (+362.9px)
    w:  34.6  →  47.6  (+13px)
    h:  10  →  13  (+3px)
    width:  34.6406px  →  47.6094px
    height:  10px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    font-size:  9px  →  10px
    letter-spacing:  normal  →  0.8px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > b  "gradient applied"
    x:  1275.2  →  1260  (-15.2px)
    y:  662.8  →  1025.7  (+362.9px)
    w:  79.2  →  96  (+16.8px)
    h:  10  →  13  (+3px)
    width:  79.1719px  →  96px
    height:  10px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  9px  →  10px
    text-align:  right  →  start

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3)  [preview-tile]
    y:  693.8  →  1058.1  (+364.3px)
    w:  276.3  →  564.7  (+288.4px)
    h:  345.8  →  358.4  (+12.6px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  4.8px
    column-gap:  normal  →  4.8px
    padding-top:  0px  →  6.4px
    padding-right:  0px  →  6.4px
    padding-bottom:  0px  →  6.4px
    padding-left:  0px  →  6.4px
    width:  276.328px  →  564.672px
    height:  345.797px  →  358.422px
    min-width:  0px  →  auto
    overflow:  hidden  →  visible
    border-radius:  0px  →  4px
    background-color:  rgb(238, 241, 244)  →  rgb(248, 250, 251)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(1)  [tile-canvas]
    x:  799.7  →  806.1  (+6.4px)
    y:  694.8  →  1065.5  (+370.7px)
    w:  274.3  →  549.9  (+275.6px)
    h:  316.8  →  325.8  (+9px)
    display:  grid  →  block
    align-items:  center  →  normal
    grid-template-columns:  242.328px  →  none
    grid-template-rows:  284.797px  →  none
    padding-top:  16px  →  0px
    padding-right:  16px  →  0px
    padding-bottom:  16px  →  0px
    padding-left:  16px  →  0px
    width:  274.328px  →  549.891px
    height:  316.797px  →  325.844px
    min-width:  0px  →  auto
    min-height:  316.8px  →  120px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    border-radius:  0px  →  4px
    background-color:  rgb(228, 232, 235)  →  rgba(0, 0, 0, 0)
    background-image:  linear-gradient(45deg, rgb(210, 216, 220) 25%, rgba(0, 0, 0, 0) 25%), linear-gradient(-45deg, rgb(210, 216, 220) 25%, rgba(0, 0, 0, 0) 25%), linear-gradient(45deg, rgba(0, 0, 0, 0) 75%, rgb(210, 216, 220) 75%), linear-gradient(-45deg, rgba(0, 0, 0, 0) 75%, rgb(210, 216, 220) 75%)  →  none
    background-size:  14px 14px, 14px 14px, 14px 14px, 14px 14px  →  auto
    background-position:  0px 0px, 0px 7px, 7px -7px, -7px 0px  →  0% 0%

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(1) > div  [ph]
    x:  840  →  806.1  (-33.9px)
    y:  788.6  →  1065.5  (+276.9px)
    w:  193.9  →  439.9  (+246px)
    h:  129.2  →  325.8  (+196.6px)
    width:  193.859px  →  439.906px
    height:  129.234px  →  325.844px
    min-height:  auto  →  0px
    max-width:  100%  →  none
    overflow:  hidden  →  visible
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(22, 32, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(1) > div > span:nth-of-type(1)  [sample-icon]  "PNG"
    x:  923.5  →  1012  (+88.5px)
    y:  835.7  →  1209.9  (+374.2px)
    w:  26.9  →  28.2  (+1.3px)
    width:  26.8594px  →  28.2031px
    height:  18px  →  19px

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(1) > div > span:nth-of-type(2)  "easy-png-tools"
    x:  898.4  →  984.1  (+85.7px)
    y:  858.7  →  1233.9  (+375.2px)
    w:  77  →  84  (+7px)
    width:  76.9844px  →  84px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(22, 32, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(2)  [tile-label]
    x:  799.7  →  806.1  (+6.4px)
    y:  1011.6  →  1396.2  (+384.6px)
    w:  274.3  →  549.9  (+275.6px)
    h:  27  →  13  (-14px)
    align-items:  normal  →  baseline
    padding-top:  8px  →  0px
    padding-right:  8px  →  0px
    padding-bottom:  8px  →  0px
    padding-left:  8px  →  0px
    width:  274.328px  →  549.891px
    height:  27px  →  13px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  9px  →  16px
    line-height:  normal  →  24px

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(2) > span  "STEP 02"
    x:  807.7  →  806.1  (-1.6px)
    y:  1020.6  →  1396.2  (+375.6px)
    w:  34.6  →  47.6  (+13px)
    h:  10  →  13  (+3px)
    width:  34.6406px  →  47.6094px
    height:  10px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    font-size:  9px  →  10px
    letter-spacing:  normal  →  0.8px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(2) > b  "background removed"
    x:  977  →  1248  (+271px)
    y:  1020.6  →  1396.2  (+375.6px)
    w:  89.1  →  108  (+18.9px)
    h:  10  →  13  (+3px)
    width:  89.0781px  →  108px
    height:  10px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  9px  →  10px
    text-align:  right  →  start

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4)  [preview-tile]
    x:  1087  →  798.7  (-288.3px)
    y:  693.8  →  1428.5  (+734.7px)
    w:  276.3  →  564.7  (+288.4px)
    h:  345.8  →  358.4  (+12.6px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  4.8px
    column-gap:  normal  →  4.8px
    padding-top:  0px  →  6.4px
    padding-right:  0px  →  6.4px
    padding-bottom:  0px  →  6.4px
    padding-left:  0px  →  6.4px
    width:  276.344px  →  564.672px
    height:  345.797px  →  358.422px
    min-width:  0px  →  auto
    overflow:  hidden  →  visible
    border-radius:  0px  →  4px
    background-color:  rgb(238, 241, 244)  →  rgb(248, 250, 251)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1)  [tile-canvas]
    x:  1088  →  806.1  (-281.9px)
    y:  694.8  →  1435.9  (+741.1px)
    w:  274.3  →  549.9  (+275.6px)
    h:  316.8  →  325.8  (+9px)
    display:  grid  →  block
    align-items:  center  →  normal
    grid-template-columns:  242.344px  →  none
    grid-template-rows:  284.797px  →  none
    padding-top:  16px  →  0px
    padding-right:  16px  →  0px
    padding-bottom:  16px  →  0px
    padding-left:  16px  →  0px
    width:  274.344px  →  549.891px
    height:  316.797px  →  325.844px
    min-width:  0px  →  auto
    min-height:  316.8px  →  120px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    border-radius:  0px  →  4px
    background-color:  rgb(228, 232, 235)  →  rgba(0, 0, 0, 0)
    background-image:  linear-gradient(45deg, rgb(210, 216, 220) 25%, rgba(0, 0, 0, 0) 25%), linear-gradient(-45deg, rgb(210, 216, 220) 25%, rgba(0, 0, 0, 0) 25%), linear-gradient(45deg, rgba(0, 0, 0, 0) 75%, rgb(210, 216, 220) 75%), linear-gradient(-45deg, rgba(0, 0, 0, 0) 75%, rgb(210, 216, 220) 75%)  →  none
    background-size:  14px 14px, 14px 14px, 14px 14px, 14px 14px  →  auto
    background-position:  0px 0px, 0px 7px, 7px -7px, -7px 0px  →  0% 0%

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1) > div  [ph]
    x:  1128.3  →  806.1  (-322.2px)
    y:  788.6  →  1435.9  (+647.3px)
    w:  193.9  →  439.9  (+246px)
    h:  129.3  →  325.8  (+196.5px)
    width:  193.875px  →  439.906px
    height:  129.25px  →  325.844px
    min-height:  auto  →  0px
    max-width:  100%  →  none
    overflow:  hidden  →  visible
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(22, 32, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1) > div > span:nth-of-type(1)  [sample-icon]  "PNG"
    x:  1211.8  →  1012  (-199.8px)
    y:  835.7  →  1580.4  (+744.7px)
    w:  26.9  →  28.2  (+1.3px)
    width:  26.8594px  →  28.2031px
    height:  18px  →  19px

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1) > div > span:nth-of-type(2)  "easy-png-tools"
    x:  1186.7  →  984.1  (-202.6px)
    y:  858.7  →  1604.4  (+745.7px)
    w:  77  →  84  (+7px)
    width:  76.9844px  →  84px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(22, 32, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(2)  [tile-label]
    x:  1088  →  806.1  (-281.9px)
    y:  1011.6  →  1766.6  (+755px)
    w:  274.3  →  549.9  (+275.6px)
    h:  27  →  13  (-14px)
    align-items:  normal  →  baseline
    padding-top:  8px  →  0px
    padding-right:  8px  →  0px
    padding-bottom:  8px  →  0px
    padding-left:  8px  →  0px
    width:  274.344px  →  549.891px
    height:  27px  →  13px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  9px  →  16px
    line-height:  normal  →  24px

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(2) > span  "STEP 03"
    x:  1096  →  806.1  (-289.9px)
    y:  1020.6  →  1766.6  (+746px)
    w:  34.6  →  47.6  (+13px)
    h:  10  →  13  (+3px)
    width:  34.6406px  →  47.6094px
    height:  10px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    font-size:  9px  →  10px
    letter-spacing:  normal  →  0.8px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(2) > b  "outline added"
    x:  1290.1  →  1278  (-12.1px)
    y:  1020.6  →  1766.6  (+746px)
    w:  64.3  →  78  (+13.7px)
    h:  10  →  13  (+3px)
    width:  64.3281px  →  78px
    height:  10px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  9px  →  10px
    text-align:  right  →  start

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(5)  [preview-tile]
    y:  1051.6  →  1799  (+747.4px)
    w:  276.3  →  564.7  (+288.4px)
    h:  345.8  →  358.4  (+12.6px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  4.8px
    column-gap:  normal  →  4.8px
    padding-top:  0px  →  6.4px
    padding-right:  0px  →  6.4px
    padding-bottom:  0px  →  6.4px
    padding-left:  0px  →  6.4px
    width:  276.328px  →  564.672px
    height:  345.797px  →  358.422px
    min-width:  0px  →  auto
    overflow:  hidden  →  visible
    border-top-color:  rgb(23, 105, 210)  →  rgb(203, 211, 218)
    border-radius:  0px  →  4px
    background-color:  rgb(238, 241, 244)  →  rgb(248, 250, 251)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(5) > div:nth-of-type(1)  [tile-canvas]
    x:  799.7  →  806.1  (+6.4px)
    y:  1052.6  →  1806.4  (+753.8px)
    w:  274.3  →  549.9  (+275.6px)
    h:  316.8  →  325.8  (+9px)
    display:  grid  →  block
    align-items:  center  →  normal
    grid-template-columns:  242.328px  →  none
    grid-template-rows:  284.797px  →  none
    padding-top:  16px  →  0px
    padding-right:  16px  →  0px
    padding-bottom:  16px  →  0px
    padding-left:  16px  →  0px
    width:  274.328px  →  549.891px
    height:  316.797px  →  325.844px
    min-width:  0px  →  auto
    min-height:  316.8px  →  120px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    border-radius:  0px  →  4px
    background-color:  rgb(228, 232, 235)  →  rgba(0, 0, 0, 0)
    background-image:  linear-gradient(45deg, rgb(210, 216, 220) 25%, rgba(0, 0, 0, 0) 25%), linear-gradient(-45deg, rgb(210, 216, 220) 25%, rgba(0, 0, 0, 0) 25%), linear-gradient(45deg, rgba(0, 0, 0, 0) 75%, rgb(210, 216, 220) 75%), linear-gradient(-45deg, rgba(0, 0, 0, 0) 75%, rgb(210, 216, 220) 75%)  →  none
    background-size:  14px 14px, 14px 14px, 14px 14px, 14px 14px  →  auto
    background-position:  0px 0px, 0px 7px, 7px -7px, -7px 0px  →  0% 0%

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(5) > div:nth-of-type(1) > div  [active ph]
    x:  840  →  806.1  (-33.9px)
    y:  1146.4  →  1806.4  (+660px)
    w:  193.9  →  439.9  (+246px)
    h:  129.2  →  325.8  (+196.6px)
    width:  193.859px  →  439.906px
    height:  129.234px  →  325.844px
    min-height:  auto  →  0px
    max-width:  100%  →  none
    overflow:  hidden  →  visible
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(5) > div:nth-of-type(1) > div > span:nth-of-type(1)  [sample-icon]  "PNG"
    x:  923.5  →  1012  (+88.5px)
    y:  1193.5  →  1950.8  (+757.3px)
    w:  26.9  →  28.2  (+1.3px)
    width:  26.8594px  →  28.2031px
    height:  18px  →  19px

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(5) > div:nth-of-type(1) > div > span:nth-of-type(2)  "easy-png-tools"
    x:  898.4  →  984.1  (+85.7px)
    y:  1216.5  →  1974.8  (+758.3px)
    w:  77  →  84  (+7px)
    width:  76.9844px  →  84px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(22, 32, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(5) > div:nth-of-type(2)  [tile-label]
    x:  799.7  →  806.1  (+6.4px)
    y:  1369.4  →  2137  (+767.6px)
    w:  274.3  →  549.9  (+275.6px)
    h:  27  →  13  (-14px)
    align-items:  normal  →  baseline
    padding-top:  8px  →  0px
    padding-right:  8px  →  0px
    padding-bottom:  8px  →  0px
    padding-left:  8px  →  0px
    width:  274.328px  →  549.891px
    height:  27px  →  13px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  9px  →  16px
    line-height:  normal  →  24px

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(5) > div:nth-of-type(2) > span  "FINAL OUTPUT"
    x:  807.7  →  806.1  (-1.6px)
    y:  1378.4  →  2137  (+758.6px)
    w:  59.4  →  81.6  (+22.2px)
    h:  10  →  13  (+3px)
    width:  59.3906px  →  81.6094px
    height:  10px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    font-size:  9px  →  10px
    letter-spacing:  normal  →  0.8px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(5) > div:nth-of-type(2) > b  "ready · PNG-24"
    x:  996.8  →  1272  (+275.2px)
    y:  1378.4  →  2137  (+758.6px)
    w:  69.3  →  84  (+14.7px)
    h:  10  →  13  (+3px)
    width:  69.2812px  →  84px
    height:  10px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  9px  →  10px
    text-align:  right  →  start

body > main > div > section:nth-of-type(2) > p  [preview-note]  "Output is generated in-browser. Your fil"
    y:  1425.4  →  2185.4  (+760px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > section:nth-of-type(2) > div:nth-of-type(1)  [section-label]
    h:  177  →  158.3  (-18.7px)
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    padding-bottom:  15px  →  12px
    height:  177px  →  158.281px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1)  [section-text]
    y:  180  →  182.1  (+2.1px)
    w:  86.6  →  92.5  (+5.9px)
    h:  87  →  67  (-20px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  2px
    column-gap:  normal  →  2px
    width:  86.6094px  →  92.5156px
    height:  87px  →  67px
    min-width:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > strong  "Visual history"
    y:  233  →  213.1  (-19.9px)
    w:  86.6  →  92.5  (+5.9px)
    h:  34  →  36  (+2px)
    width:  86.6094px  →  92.5156px
    height:  34px  →  36px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > span  [mono-label]  "PIPELINE OUTPUTS"
    y:  188  →  182.1  (-5.9px)
    w:  53.6  →  92.5  (+38.9px)
    h:  36  →  24  (-12px)
    display:  inline  →  block
    width:  auto  →  92.5156px
    height:  auto  →  24px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    line-height:  normal  →  12px
    letter-spacing:  1.2px  →  1px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2)  [section-actions]
    x:  885.3  →  907.2  (+21.9px)
    w:  478.1  →  456.2  (-21.9px)
    h:  161  →  145.3  (-15.7px)
    width:  478.062px  →  456.156px
    height:  161px  →  145.281px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button:nth-of-type(2)  [download-btn]  "Download result"
    x:  885.3  →  955.4  (+70.1px)
    y:  204  →  231.1  (+27.1px)
    w:  478.1  →  191.2  (-286.9px)
    h:  42  →  36  (-6px)
    justify-content:  center  →  normal
    row-gap:  9px  →  8px
    column-gap:  9px  →  8px
    margin-top:  18px  →  0px
    padding-top:  0px  →  9px
    padding-right:  0px  →  14px
    padding-bottom:  0px  →  9px
    padding-left:  0px  →  14px
    width:  478.062px  →  191.203px
    height:  42px  →  36px
    border-top-width:  0px  →  1px
    border-top-style:  none  →  solid
    border-top-color:  rgb(255, 255, 255)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px
    font-size:  11px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button:nth-of-type(2) > svg:nth-of-type(1)  [lucide lucide-download lucide-icon]
    x:  1055  →  970.4  (-84.6px)
    y:  217  →  241.1  (+24.1px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(255, 255, 255)
    font-size:  11px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button:nth-of-type(2) > svg:nth-of-type(2)  [lucide lucide-arrow-down-to-line lucide-icon]
    x:  1179.7  →  1117.6  (-62.1px)
    y:  218  →  242.1  (+24.1px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(255, 255, 255)
    font-size:  11px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button:nth-of-type(1)  [history-toggle]  "Hide intermediate"
    x:  1218.1  →  907.2  (-310.9px)
    y:  143  →  161  (+18px)
    w:  145.3  →  456.2  (+310.9px)
    h:  33  →  39  (+6px)
    margin-top:  0px  →  18px
    padding-top:  8px  →  11px
    padding-right:  10px  →  14px
    padding-bottom:  8px  →  11px
    padding-left:  10px  →  14px
    width:  145.281px  →  456.156px
    height:  33px  →  39px
    background-position:  0px 0px  →  0% 0%

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button:nth-of-type(1) > svg  [lucide lucide-chevron-down lucide-icon]
    x:  1337.4  →  1186.2  (-151.2px)
    y:  152  →  173  (+21px)
    transform:  matrix(-1, 0, 0, -1, 0, 0)  →  none
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div  [meta-list]
    x:  1072.5  →  1156.6  (+84.1px)
    y:  256  →  210  (-46px)
    w:  251.9  →  164.8  (-87.1px)
    h:  48  →  78.3  (+30.3px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2.4px
    column-gap:  8px  →  2.4px
    grid-template-columns:  78.625px 78.625px 78.625px  →  none
    grid-template-rows:  33px  →  none
    padding-top:  14px  →  0px
    width:  251.875px  →  164.812px
    height:  48px  →  78.2812px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div > div:nth-of-type(1)  [meta-row]
    x:  1072.5  →  1156.6  (+84.1px)
    y:  271  →  210  (-61px)
    w:  78.6  →  164.8  (+86.2px)
    h:  33  →  24.5  (-8.5px)
    display:  grid  →  flex
    justify-content:  normal  →  space-between
    align-items:  normal  →  baseline
    row-gap:  5px  →  16px
    column-gap:  5px  →  16px
    grid-template-columns:  78.625px  →  none
    grid-template-rows:  10px 18px  →  none
    padding-top:  0px  →  4px
    padding-bottom:  0px  →  4px
    width:  78.625px  →  164.812px
    height:  33px  →  24.5px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div > div:nth-of-type(1) > span  [meta-caption]  "DIMENSIONS"
    x:  1072.5  →  1156.6  (+84.1px)
    y:  271  →  216  (-55px)
    w:  78.6  →  63  (-15.6px)
    h:  10  →  13.5  (+3.5px)
    width:  78.625px  →  63px
    height:  10px  →  13.5px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    line-height:  normal  →  13.5px
    letter-spacing:  normal  →  0.9px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div > div:nth-of-type(1) > b  [meta-value]  "1200 × 800 px"
    x:  1072.5  →  1235.6  (+163.1px)
    y:  291  →  214  (-77px)
    w:  78.6  →  85.8  (+7.2px)
    h:  13  →  16.5  (+3.5px)
    margin-top:  5px  →  0px
    width:  78.625px  →  85.8125px
    height:  13px  →  16.5px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-weight:  400  →  700
    line-height:  normal  →  16.5px

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div > div:nth-of-type(2)  [meta-row]
    x:  1159.1  →  1156.6  (-2.5px)
    y:  271  →  236.9  (-34.1px)
    w:  78.6  →  164.8  (+86.2px)
    h:  33  →  24.5  (-8.5px)
    display:  grid  →  flex
    justify-content:  normal  →  space-between
    align-items:  normal  →  baseline
    row-gap:  5px  →  16px
    column-gap:  5px  →  16px
    grid-template-columns:  78.625px  →  none
    grid-template-rows:  10px 18px  →  none
    padding-top:  0px  →  4px
    padding-bottom:  0px  →  4px
    width:  78.625px  →  164.812px
    height:  33px  →  24.5px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div > div:nth-of-type(2) > span  [meta-caption]  "FORMAT"
    x:  1159.1  →  1156.6  (-2.5px)
    y:  271  →  242.9  (-28.1px)
    w:  78.6  →  37.8  (-40.8px)
    h:  10  →  13.5  (+3.5px)
    width:  78.625px  →  37.8125px
    height:  10px  →  13.5px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    line-height:  normal  →  13.5px
    letter-spacing:  normal  →  0.9px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div > div:nth-of-type(2) > b  [meta-value]  "PNG-24"
    x:  1159.1  →  1281.8  (+122.7px)
    y:  291  →  240.9  (-50.1px)
    w:  78.6  →  39.6  (-39px)
    h:  13  →  16.5  (+3.5px)
    margin-top:  5px  →  0px
    width:  78.625px  →  39.6094px
    height:  13px  →  16.5px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-weight:  400  →  700
    line-height:  normal  →  16.5px

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div > div:nth-of-type(3)  [meta-row]
    x:  1245.8  →  1156.6  (-89.2px)
    y:  271  →  263.8  (-7.2px)
    w:  78.6  →  164.8  (+86.2px)
    h:  33  →  24.5  (-8.5px)
    display:  grid  →  flex
    justify-content:  normal  →  space-between
    align-items:  normal  →  baseline
    row-gap:  5px  →  16px
    column-gap:  5px  →  16px
    grid-template-columns:  78.625px  →  none
    grid-template-rows:  10px 18px  →  none
    padding-top:  0px  →  4px
    padding-bottom:  0px  →  4px
    width:  78.625px  →  164.812px
    height:  33px  →  24.5px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div > div:nth-of-type(3) > span  [meta-caption]  "SIZE"
    x:  1245.8  →  1156.6  (-89.2px)
    y:  271  →  269.8  (-1.2px)
    w:  78.6  →  25.2  (-53.4px)
    h:  10  →  13.5  (+3.5px)
    width:  78.625px  →  25.2031px
    height:  10px  →  13.5px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    line-height:  normal  →  13.5px
    letter-spacing:  normal  →  0.9px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div > div:nth-of-type(3) > b  [meta-value]  "1.2 MB"
    x:  1245.8  →  1281.8  (+36px)
    y:  291  →  267.8  (-23.2px)
    w:  78.6  →  39.6  (-39px)
    h:  13  →  16.5  (+3.5px)
    margin-top:  5px  →  0px
    width:  78.625px  →  39.6094px
    height:  13px  →  16.5px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-weight:  400  →  700
    line-height:  normal  →  16.5px

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button:nth-of-type(3)  [icon-btn icon-btn--ghost]
    x:  1334.4  →  1331.4  (-3px)
    y:  265.5  →  233.1  (-32.4px)
    w:  29  →  32  (+3px)
    h:  29  →  32  (+3px)
    display:  grid  →  flex
    justify-content:  normal  →  center
    grid-template-columns:  17px  →  none
    grid-template-rows:  17px  →  none
    padding-top:  6px  →  1px
    padding-bottom:  6px  →  1px
    width:  29px  →  32px
    height:  29px  →  32px
    border-top-width:  0px  →  1px
    border-top-style:  none  →  solid
    border-top-color:  rgb(109, 120, 131)  →  rgb(203, 211, 218)
    border-radius:  0px  →  4px
    background-position:  0px 0px  →  0% 0%
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button:nth-of-type(3) > svg  [lucide lucide-icon lucide-settings-2]
    y:  271.5  →  241.1  (-30.4px)
    width:  17px  →  16px
    height:  17px  →  16px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1)  [ws-settings]
    h:  993.4  →  893  (-100.4px)
    height:  993.375px  →  893.031px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(1)  [eyebrow]  "PNG PROCESSING WORKSPACE"
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    color:  rgb(23, 105, 210)  →  rgb(109, 120, 131)

body > main > div > section:nth-of-type(1) > div:nth-of-type(1) > span  "/"
    x:  165.1  →  172.6  (+7.5px)
    w:  13.4  →  7.2  (-6.2px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    color:  rgb(109, 120, 131)  →  rgb(23, 105, 210)

body > main > div > section:nth-of-type(1) > div:nth-of-type(2)  [title-row]
    h:  182.4  →  170.8  (-11.6px)
    height:  182.375px  →  170.844px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1)
    w:  482.3  →  473.5  (-8.8px)
    h:  182.4  →  170.8  (-11.6px)
    width:  482.344px  →  473.516px
    height:  182.375px  →  170.844px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > h1  "Build your image pipeline."
    w:  482.3  →  473.5  (-8.8px)
    h:  115.2  →  103.7  (-11.5px)
    width:  482.344px  →  473.516px
    height:  115.188px  →  103.656px
    max-width:  700px  →  none
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    line-height:  57.6px  →  51.84px

body > main > div > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > p  [lede]  "Chain simple tools together. Every chang"
    y:  285.2  →  274.7  (-10.5px)
    w:  482.3  →  473.5  (-8.8px)
    width:  482.344px  →  473.516px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2)  [file-chip]
    x:  569.9  →  561.1  (-8.8px)
    y:  299.4  →  288.8  (-10.6px)
    w:  153.8  →  162.6  (+8.8px)
    width:  153.781px  →  162.609px

body > main > div > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > svg  [lucide lucide-icon lucide-upload]
    x:  582.9  →  574.1  (-8.8px)
    y:  310.4  →  299.8  (-10.6px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > span  "source.png"
    x:  605.9  →  597.1  (-8.8px)
    y:  311.4  →  300.3  (-11.1px)
    w:  60.5  →  66  (+5.5px)
    width:  60.4844px  →  66px
    height:  13px  →  14px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > b  "1.8 MB"
    x:  674.4  →  671.1  (-3.3px)
    y:  311.4  →  300.3  (-11.1px)
    w:  36.3  →  39.6  (+3.3px)
    width:  36.2969px  →  39.6094px
    height:  13px  →  14px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4)  [steps-list]
    y:  451.4  →  431.8  (-19.6px)
    h:  630  →  550.2  (-79.8px)
    grid-template-rows:  152px 138px 152px 144px  →  149px 89px 141.188px 127px
    height:  630px  →  550.188px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1)  [step-card]
    y:  465.4  →  445.8  (-19.6px)
    h:  152  →  149  (-3px)
    grid-template-columns:  46px 20px 598.125px  →  46px 618.125px
    grid-template-rows:  150px  →  45px 102px
    height:  152px  →  149px
    min-height:  138px  →  auto
    overflow:  visible  →  hidden
    border-radius:  0px  →  4px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(1)  [step-index]  "01"
    y:  466.4  →  446.8  (-19.6px)
    h:  150  →  45  (-105px)
    padding-bottom:  0px  →  6px
    height:  150px  →  45px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    font-size:  11px  →  22px
    font-weight:  400  →  600
    line-height:  normal  →  22px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > svg  [drag lucide lucide-grip-vertical lucide-icon]
    x:  104.6  →  58.6  (-46px)
    y:  483.4  →  491.8  (+8.4px)
    margin-top:  17px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2)  [step-body]
    x:  124.6  →  104.6  (-20px)
    y:  466.4  →  446.8  (-19.6px)
    w:  598.1  →  618.1  (+20px)
    h:  150  →  147  (-3px)
    display:  block  →  flex
    flex-direction:  row  →  column
    padding-top:  15px  →  0px
    padding-right:  18px  →  0px
    padding-bottom:  18px  →  0px
    padding-left:  18px  →  0px
    width:  598.125px  →  618.125px
    height:  150px  →  147px
    min-width:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1)  [step-heading]
    x:  142.6  →  104.6  (-38px)
    y:  481.4  →  446.8  (-34.6px)
    w:  562.1  →  618.1  (+56px)
    h:  65  →  72  (+7px)
    align-items:  center  →  flex-start
    row-gap:  15px  →  8px
    column-gap:  15px  →  8px
    padding-top:  0px  →  8px
    padding-right:  0px  →  12px
    padding-bottom:  0px  →  8px
    padding-left:  0px  →  12px
    width:  562.125px  →  618.125px
    height:  65px  →  72px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1)  [step-heading-text]
    x:  142.6  →  116.6  (-26px)
    y:  481.4  →  454.8  (-26.6px)
    w:  156.7  →  171  (+14.3px)
    h:  65  →  55  (-10px)
    display:  block  →  flex
    flex-direction:  row  →  column
    width:  156.703px  →  171px
    height:  65px  →  55px
    min-width:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > span  [step-type]  "BACKGROUND"
    x:  142.6  →  116.6  (-26px)
    y:  489.4  →  454.8  (-34.6px)
    w:  67  →  171  (+104px)
    display:  inline  →  block
    width:  auto  →  171px
    height:  auto  →  13px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h2  [step-title]  "Gradient background"
    x:  142.6  →  116.6  (-26px)
    y:  510.4  →  472.8  (-37.6px)
    w:  156.7  →  171  (+14.3px)
    width:  156.703px  →  171px
    height:  18px  →  19px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2)  [step-tools]
    x:  607.7  →  589.3  (-18.4px)
    y:  505.4  →  454.8  (-50.6px)
    w:  97  →  121.4  (+24.4px)
    h:  17  →  21.8  (+4.8px)
    row-gap:  13px  →  8px
    column-gap:  13px  →  8px
    width:  97px  →  121.375px
    height:  17px  →  21.7812px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button  [step-remove]
    y:  505.9  →  456.7  (-49.2px)
    w:  16  →  28  (+12px)
    h:  16  →  18  (+2px)
    display:  block  →  flex
    padding-top:  0px  →  1px
    padding-right:  0px  →  6px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  6px
    width:  16px  →  28px
    height:  16px  →  18px
    background-position:  0px 0px  →  0% 0%
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button > svg  [lucide lucide-icon lucide-x]
    x:  658.7  →  663.7  (+5px)
    y:  505.9  →  457.7  (-48.2px)
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > svg  [lucide lucide-ellipsis lucide-icon]
    x:  687.7  →  693.7  (+6px)
    y:  505.4  →  457.2  (-48.2px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > span  [badge badge--success]  "AUTO"
    x:  607.7  →  589.3  (-18.4px)
    y:  507.9  →  454.8  (-53.1px)
    w:  38  →  60.4  (+22.4px)
    h:  12  →  21.8  (+9.8px)
    row-gap:  4px  →  4.8px
    column-gap:  4px  →  4.8px
    padding-top:  0px  →  2.4px
    padding-right:  0px  →  7.2px
    padding-bottom:  0px  →  2.4px
    padding-left:  0px  →  7.2px
    width:  38px  →  60.375px
    height:  12px  →  21.7812px
    border-top-width:  0px  →  1px
    border-top-color:  rgb(203, 211, 218)  →  color(srgb 0.535686 0.761569 0.679216)
    border-radius:  0px  →  4px
    color:  rgb(35, 131, 84)  →  rgb(37, 169, 106)
    line-height:  normal  →  15px
    letter-spacing:  normal  →  0.8px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > span > svg  [lucide lucide-check lucide-icon]
    x:  607.7  →  597.5  (-10.2px)
    y:  507.9  →  459.7  (-48.2px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(37, 169, 106)
    color:  rgb(35, 131, 84)  →  rgb(37, 169, 106)
    line-height:  normal  →  15px
    letter-spacing:  normal  →  0.8px
    text-transform:  none  →  uppercase
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2)  [controls]
    x:  142.6  →  104.6  (-38px)
    y:  546.4  →  518.8  (-27.6px)
    w:  562.1  →  618.1  (+56px)
    h:  52  →  75  (+23px)
    row-gap:  16px  →  0px
    column-gap:  16px  →  24px
    grid-template-columns:  189px 155.047px 186.078px  →  190.031px 190.047px 190.047px
    grid-template-rows:  52px  →  75px
    width:  562.125px  →  618.125px
    height:  52px  →  75px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1)  [control-block]
    x:  142.6  →  104.6  (-38px)
    y:  546.4  →  518.8  (-27.6px)
    h:  52  →  75  (+23px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  8px
    column-gap:  normal  →  8px
    padding-top:  0px  →  10px
    width:  189px  →  190.031px
    height:  52px  →  75px
    min-width:  auto  →  0px
    border-top-width:  0px  →  1px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > label  "COLOR"
    x:  142.6  →  104.6  (-38px)
    y:  546.4  →  529.8  (-16.6px)
    align-items:  normal  →  baseline
    row-gap:  normal  →  8px
    column-gap:  normal  →  8px
    width:  189px  →  190.031px
    height:  12px  →  13px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  0.8px  →  0.5px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div  [color-field]
    x:  142.6  →  104.6  (-38px)
    y:  566.4  →  558.8  (-7.6px)
    h:  32  →  27.2  (-4.8px)
    row-gap:  8px  →  6.4px
    column-gap:  8px  →  6.4px
    padding-right:  8px  →  0px
    padding-left:  8px  →  0px
    width:  189px  →  190.031px
    height:  32px  →  27.1875px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div > span  [swatch]
    x:  151.6  →  104.6  (-47px)
    y:  575.4  →  559.6  (-15.8px)
    w:  14  →  25.6  (+11.6px)
    h:  14  →  25.6  (+11.6px)
    width:  14px  →  25.5938px
    height:  14px  →  25.5938px
    border-radius:  0px  →  4px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div > input
    x:  173.6  →  136.6  (-37px)
    y:  575.9  →  558.8  (-17.1px)
    w:  127  →  137.7  (+10.7px)
    h:  13  →  27.2  (+14.2px)
    padding-top:  0px  →  5.6px
    padding-right:  0px  →  8px
    padding-bottom:  0px  →  5.6px
    padding-left:  0px  →  8px
    width:  127px  →  137.656px
    height:  13px  →  27.1875px
    border-top-width:  0px  →  1px
    border-top-style:  none  →  solid
    border-top-color:  rgb(23, 33, 43)  →  rgb(203, 211, 218)
    border-radius:  0px  →  4px
    background-color:  rgba(0, 0, 0, 0)  →  rgb(238, 241, 244)
    background-position:  0px 0px  →  0% 0%
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div > svg  [lucide lucide-chevron-down lucide-icon]
    x:  308.6  →  280.6  (-28px)
    y:  575.4  →  565.4  (-10px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    color:  rgb(23, 33, 43)  →  rgb(109, 120, 131)
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2)  [control-block]
    x:  347.6  →  318.6  (-29px)
    y:  546.4  →  518.8  (-27.6px)
    w:  155  →  190  (+35px)
    h:  52  →  75  (+23px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  0px
    column-gap:  normal  →  0px
    padding-top:  0px  →  10px
    width:  155.047px  →  190.047px
    height:  52px  →  75px
    min-width:  auto  →  0px
    border-top-width:  0px  →  1px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > label  "DIRECTION"
    x:  347.6  →  318.6  (-29px)
    y:  546.4  →  529.8  (-16.6px)
    w:  155  →  190  (+35px)
    h:  12  →  14  (+2px)
    align-items:  normal  →  center
    row-gap:  normal  →  8px
    column-gap:  normal  →  8px
    width:  155.047px  →  190.047px
    height:  12px  →  14px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  0.8px  →  0.5px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > label > output  "135 °"
    x:  471.1  →  473.2  (+2.1px)
    y:  546.4  →  529.8  (-16.6px)
    w:  31.5  →  35.5  (+4px)
    h:  12  →  14  (+2px)
    width:  31.5156px  →  35.5px
    height:  12px  →  14px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-size:  10px  →  11px
    letter-spacing:  0.8px  →  0.5px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > input
    x:  347.6  →  320.6  (-27px)
    y:  567.4  →  553.8  (-13.6px)
    w:  155  →  190  (+35px)
    display:  inline-block  →  block
    margin-top:  0px  →  2px
    margin-right:  0px  →  2px
    margin-bottom:  0px  →  2px
    margin-left:  0px  →  2px
    width:  155.047px  →  190.047px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(16, 16, 16)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(255, 255, 255)
    color:  rgb(23, 33, 43)  →  rgb(16, 16, 16)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3)  [control-block]
    x:  518.6  →  532.7  (+14.1px)
    y:  546.4  →  518.8  (-27.6px)
    w:  186.1  →  190  (+3.9px)
    h:  52  →  75  (+23px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  8px
    column-gap:  normal  →  8px
    padding-top:  0px  →  10px
    width:  186.078px  →  190.047px
    height:  52px  →  75px
    min-width:  auto  →  0px
    border-top-width:  0px  →  1px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > label  "OPACITY"
    x:  518.6  →  532.7  (+14.1px)
    y:  546.4  →  529.8  (-16.6px)
    w:  186.1  →  190  (+3.9px)
    h:  12  →  24  (+12px)
    display:  flex  →  block
    justify-content:  space-between  →  normal
    margin-bottom:  8px  →  0px
    width:  186.078px  →  190.047px
    height:  12px  →  24px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  0.8px  →  normal

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > label > output  "100%"
    x:  679.5  →  601.7  (-77.8px)
    y:  546.4  →  531.8  (-14.6px)
    w:  25.2  →  43.6  (+18.4px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  25.2031px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  0.8px  →  normal

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div  [segmented]
    x:  518.6  →  532.7  (+14.1px)
    y:  566.4  →  561.8  (-4.6px)
    w:  186.1  →  190  (+3.9px)
    width:  186.078px  →  190.047px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    overflow:  visible  →  hidden
    border-radius:  0px  →  4px
    background-color:  rgba(0, 0, 0, 0)  →  rgb(238, 241, 244)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div > button:nth-of-type(2)  [segment selected]  "100"
    x:  565.7  →  533.7  (-32px)
    y:  567.4  →  562.8  (-4.6px)
    w:  46  →  42.2  (-3.8px)
    display:  block  →  flex
    align-items:  normal  →  center
    padding-right:  0px  →  11.2px
    padding-left:  0px  →  11.2px
    width:  46.0312px  →  42.1875px
    background-position:  0px 0px  →  0% 0%
    letter-spacing:  normal  →  0.6px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div > button:nth-of-type(3)  [segment]  "75"
    x:  611.7  →  575.9  (-35.8px)
    y:  567.4  →  562.8  (-4.6px)
    w:  46  →  36.6  (-9.4px)
    display:  block  →  flex
    align-items:  normal  →  center
    padding-right:  0px  →  11.2px
    padding-left:  0px  →  11.2px
    width:  46.0156px  →  36.5781px
    background-position:  0px 0px  →  0% 0%
    letter-spacing:  normal  →  0.6px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div > button:nth-of-type(4)  [segment]  "50"
    x:  657.7  →  612.4  (-45.3px)
    y:  567.4  →  562.8  (-4.6px)
    w:  46  →  36.6  (-9.4px)
    display:  block  →  flex
    align-items:  normal  →  center
    padding-right:  0px  →  11.2px
    padding-left:  0px  →  11.2px
    width:  46.0156px  →  36.5781px
    background-position:  0px 0px  →  0% 0%
    letter-spacing:  normal  →  0.6px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div > button:nth-of-type(1)  [segment]  "25"
    x:  519.6  →  649  (+129.4px)
    y:  567.4  →  562.8  (-4.6px)
    w:  46  →  36.6  (-9.4px)
    display:  block  →  flex
    align-items:  normal  →  center
    padding-right:  0px  →  11.2px
    padding-left:  0px  →  11.2px
    width:  46.0156px  →  36.5781px
    border-top-color:  rgb(255, 255, 255)  →  rgb(109, 120, 131)
    background-color:  rgb(23, 105, 210)  →  rgba(0, 0, 0, 0)
    color:  rgb(255, 255, 255)  →  rgb(109, 120, 131)
    letter-spacing:  normal  →  0.6px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2)  [step-card]
    y:  627.4  →  604.8  (-22.6px)
    h:  138  →  89  (-49px)
    grid-template-columns:  46px 20px 598.125px  →  46px 618.125px
    grid-template-rows:  136px  →  45px 42px
    height:  138px  →  89px
    min-height:  138px  →  auto
    overflow:  visible  →  hidden
    border-radius:  0px  →  4px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(1)  [step-index]  "02"
    y:  628.4  →  605.8  (-22.6px)
    h:  136  →  45  (-91px)
    padding-bottom:  0px  →  6px
    height:  136px  →  45px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    font-size:  11px  →  22px
    font-weight:  400  →  600
    line-height:  normal  →  22px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > svg  [drag lucide lucide-grip-vertical lucide-icon]
    x:  104.6  →  58.6  (-46px)
    y:  645.4  →  650.8  (+5.4px)
    margin-top:  17px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(2)  [step-body]
    x:  124.6  →  104.6  (-20px)
    y:  628.4  →  605.8  (-22.6px)
    w:  598.1  →  618.1  (+20px)
    h:  136  →  87  (-49px)
    display:  block  →  flex
    flex-direction:  row  →  column
    padding-top:  15px  →  0px
    padding-right:  18px  →  0px
    padding-bottom:  18px  →  0px
    padding-left:  18px  →  0px
    width:  598.125px  →  618.125px
    height:  136px  →  87px
    min-width:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1)  [step-heading]
    x:  142.6  →  104.6  (-38px)
    y:  643.4  →  605.8  (-37.6px)
    w:  562.1  →  618.1  (+56px)
    h:  65  →  72  (+7px)
    align-items:  center  →  flex-start
    row-gap:  15px  →  8px
    column-gap:  15px  →  8px
    padding-top:  0px  →  8px
    padding-right:  0px  →  12px
    padding-bottom:  0px  →  8px
    padding-left:  0px  →  12px
    width:  562.125px  →  618.125px
    height:  65px  →  72px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1)  [step-heading-text]
    x:  142.6  →  116.6  (-26px)
    y:  643.4  →  613.8  (-29.6px)
    w:  140.2  →  153  (+12.8px)
    h:  65  →  55  (-10px)
    display:  block  →  flex
    flex-direction:  row  →  column
    width:  140.203px  →  153px
    height:  65px  →  55px
    min-width:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > span  [step-type]  "TRANSFORM"
    x:  142.6  →  116.6  (-26px)
    y:  651.4  →  613.8  (-37.6px)
    w:  60.3  →  153  (+92.7px)
    display:  inline  →  block
    width:  auto  →  153px
    height:  auto  →  13px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h2  [step-title]  "Remove background"
    x:  142.6  →  116.6  (-26px)
    y:  672.4  →  631.8  (-40.6px)
    w:  140.2  →  153  (+12.8px)
    width:  140.203px  →  153px
    height:  18px  →  19px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2)  [step-tools]
    x:  607.7  →  589.3  (-18.4px)
    y:  667.4  →  613.8  (-53.6px)
    w:  97  →  121.4  (+24.4px)
    h:  17  →  21.8  (+4.8px)
    row-gap:  13px  →  8px
    column-gap:  13px  →  8px
    width:  97px  →  121.375px
    height:  17px  →  21.7812px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button  [step-remove]
    y:  667.9  →  615.7  (-52.2px)
    w:  16  →  28  (+12px)
    h:  16  →  18  (+2px)
    display:  block  →  flex
    padding-top:  0px  →  1px
    padding-right:  0px  →  6px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  6px
    width:  16px  →  28px
    height:  16px  →  18px
    background-position:  0px 0px  →  0% 0%
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button > svg  [lucide lucide-icon lucide-x]
    x:  658.7  →  663.7  (+5px)
    y:  667.9  →  616.7  (-51.2px)
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > svg  [lucide lucide-ellipsis lucide-icon]
    x:  687.7  →  693.7  (+6px)
    y:  667.4  →  616.2  (-51.2px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > span  [badge badge--success]  "AUTO"
    x:  607.7  →  589.3  (-18.4px)
    y:  669.9  →  613.8  (-56.1px)
    w:  38  →  60.4  (+22.4px)
    h:  12  →  21.8  (+9.8px)
    row-gap:  4px  →  4.8px
    column-gap:  4px  →  4.8px
    padding-top:  0px  →  2.4px
    padding-right:  0px  →  7.2px
    padding-bottom:  0px  →  2.4px
    padding-left:  0px  →  7.2px
    width:  38px  →  60.375px
    height:  12px  →  21.7812px
    border-top-width:  0px  →  1px
    border-top-color:  rgb(203, 211, 218)  →  color(srgb 0.535686 0.761569 0.679216)
    border-radius:  0px  →  4px
    color:  rgb(35, 131, 84)  →  rgb(37, 169, 106)
    line-height:  normal  →  15px
    letter-spacing:  normal  →  0.8px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > span > svg  [lucide lucide-check lucide-icon]
    x:  607.7  →  597.5  (-10.2px)
    y:  669.9  →  618.7  (-51.2px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(37, 169, 106)
    color:  rgb(35, 131, 84)  →  rgb(37, 169, 106)
    line-height:  normal  →  15px
    letter-spacing:  normal  →  0.8px
    text-transform:  none  →  uppercase
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2)  [transform-note]  "Automatic subject detection enabled"
    x:  142.6  →  104.6  (-38px)
    y:  708.4  →  677.8  (-30.6px)
    w:  562.1  →  618.1  (+56px)
    width:  562.125px  →  618.125px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > svg  [lucide lucide-icon lucide-sliders-horizontal]
    x:  142.6  →  104.6  (-38px)
    y:  708.4  →  677.8  (-30.6px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3)  [step-card]
    y:  775.4  →  703.8  (-71.6px)
    h:  152  →  141.2  (-10.8px)
    grid-template-columns:  46px 20px 598.125px  →  46px 618.125px
    grid-template-rows:  150px  →  45px 94.1875px
    height:  152px  →  141.188px
    min-height:  138px  →  auto
    overflow:  visible  →  hidden
    border-radius:  0px  →  4px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(1)  [step-index]  "03"
    y:  776.4  →  704.8  (-71.6px)
    h:  150  →  45  (-105px)
    padding-bottom:  0px  →  6px
    height:  150px  →  45px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    font-size:  11px  →  22px
    font-weight:  400  →  600
    line-height:  normal  →  22px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > svg  [drag lucide lucide-grip-vertical lucide-icon]
    x:  104.6  →  58.6  (-46px)
    y:  793.4  →  749.8  (-43.6px)
    margin-top:  17px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2)  [step-body]
    x:  124.6  →  104.6  (-20px)
    y:  776.4  →  704.8  (-71.6px)
    w:  598.1  →  618.1  (+20px)
    h:  150  →  139.2  (-10.8px)
    display:  block  →  flex
    flex-direction:  row  →  column
    padding-top:  15px  →  0px
    padding-right:  18px  →  0px
    padding-bottom:  18px  →  0px
    padding-left:  18px  →  0px
    width:  598.125px  →  618.125px
    height:  150px  →  139.188px
    min-width:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(1)  [step-heading]
    x:  142.6  →  104.6  (-38px)
    y:  791.4  →  704.8  (-86.6px)
    w:  562.1  →  618.1  (+56px)
    h:  65  →  72  (+7px)
    align-items:  center  →  flex-start
    row-gap:  15px  →  8px
    column-gap:  15px  →  8px
    padding-top:  0px  →  8px
    padding-right:  0px  →  12px
    padding-bottom:  0px  →  8px
    padding-left:  0px  →  12px
    width:  562.125px  →  618.125px
    height:  65px  →  72px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1)  [step-heading-text]
    x:  142.6  →  116.6  (-26px)
    y:  791.4  →  712.8  (-78.6px)
    w:  90.7  →  99  (+8.3px)
    h:  65  →  55  (-10px)
    display:  block  →  flex
    flex-direction:  row  →  column
    width:  90.7188px  →  99px
    height:  65px  →  55px
    min-width:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > span  [step-type]  "STYLE"
    x:  142.6  →  116.6  (-26px)
    y:  799.4  →  712.8  (-86.6px)
    w:  33.5  →  99  (+65.5px)
    display:  inline  →  block
    width:  auto  →  99px
    height:  auto  →  13px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h2  [step-title]  "Add outline"
    x:  142.6  →  116.6  (-26px)
    y:  820.4  →  730.8  (-89.6px)
    w:  90.7  →  99  (+8.3px)
    width:  90.7188px  →  99px
    height:  18px  →  19px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2)  [step-tools]
    x:  607.7  →  589.3  (-18.4px)
    y:  815.4  →  712.8  (-102.6px)
    w:  97  →  121.4  (+24.4px)
    h:  17  →  21.8  (+4.8px)
    row-gap:  13px  →  8px
    column-gap:  13px  →  8px
    width:  97px  →  121.375px
    height:  17px  →  21.7812px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button  [step-remove]
    y:  815.9  →  714.7  (-101.2px)
    w:  16  →  28  (+12px)
    h:  16  →  18  (+2px)
    display:  block  →  flex
    padding-top:  0px  →  1px
    padding-right:  0px  →  6px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  6px
    width:  16px  →  28px
    height:  16px  →  18px
    background-position:  0px 0px  →  0% 0%
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button > svg  [lucide lucide-icon lucide-x]
    x:  658.7  →  663.7  (+5px)
    y:  815.9  →  715.7  (-100.2px)
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > svg  [lucide lucide-ellipsis lucide-icon]
    x:  687.7  →  693.7  (+6px)
    y:  815.4  →  715.2  (-100.2px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > span  [badge badge--success]  "AUTO"
    x:  607.7  →  589.3  (-18.4px)
    y:  817.9  →  712.8  (-105.1px)
    w:  38  →  60.4  (+22.4px)
    h:  12  →  21.8  (+9.8px)
    row-gap:  4px  →  4.8px
    column-gap:  4px  →  4.8px
    padding-top:  0px  →  2.4px
    padding-right:  0px  →  7.2px
    padding-bottom:  0px  →  2.4px
    padding-left:  0px  →  7.2px
    width:  38px  →  60.375px
    height:  12px  →  21.7812px
    border-top-width:  0px  →  1px
    border-top-color:  rgb(203, 211, 218)  →  color(srgb 0.535686 0.761569 0.679216)
    border-radius:  0px  →  4px
    color:  rgb(35, 131, 84)  →  rgb(37, 169, 106)
    line-height:  normal  →  15px
    letter-spacing:  normal  →  0.8px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > span > svg  [lucide lucide-check lucide-icon]
    x:  607.7  →  597.5  (-10.2px)
    y:  817.9  →  717.7  (-100.2px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(37, 169, 106)
    color:  rgb(35, 131, 84)  →  rgb(37, 169, 106)
    line-height:  normal  →  15px
    letter-spacing:  normal  →  0.8px
    text-transform:  none  →  uppercase
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(2)  [compact controls]
    x:  142.6  →  104.6  (-38px)
    y:  856.4  →  776.8  (-79.6px)
    w:  562.1  →  618.1  (+56px)
    h:  52  →  67.2  (+15.2px)
    row-gap:  16px  →  0px
    grid-template-columns:  273.062px 273.062px  →  301.062px 301.062px
    grid-template-rows:  52px  →  67.1875px
    width:  562.125px  →  618.125px
    height:  52px  →  67.1875px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1)  [control-block]
    x:  142.6  →  104.6  (-38px)
    y:  856.4  →  776.8  (-79.6px)
    w:  273.1  →  301.1  (+28px)
    h:  52  →  67.2  (+15.2px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  0px
    column-gap:  normal  →  0px
    padding-top:  0px  →  10px
    width:  273.062px  →  301.062px
    height:  52px  →  67.1875px
    min-width:  auto  →  0px
    border-top-width:  0px  →  1px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > label  "WIDTH"
    x:  142.6  →  104.6  (-38px)
    y:  856.4  →  787.8  (-68.6px)
    w:  273.1  →  301.1  (+28px)
    h:  12  →  14  (+2px)
    align-items:  normal  →  center
    row-gap:  normal  →  8px
    column-gap:  normal  →  8px
    width:  273.062px  →  301.062px
    height:  12px  →  14px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  0.8px  →  0.5px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > label > output  "2 px"
    x:  390.4  →  377.3  (-13.1px)
    y:  856.4  →  787.8  (-68.6px)
    w:  25.2  →  28.4  (+3.2px)
    h:  12  →  14  (+2px)
    width:  25.2188px  →  28.4062px
    height:  12px  →  14px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-size:  10px  →  11px
    letter-spacing:  0.8px  →  0.5px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > input
    x:  142.6  →  106.6  (-36px)
    y:  877.4  →  811.8  (-65.6px)
    w:  273.1  →  301.1  (+28px)
    display:  inline-block  →  block
    margin-top:  0px  →  2px
    margin-right:  0px  →  2px
    margin-bottom:  0px  →  2px
    margin-left:  0px  →  2px
    width:  273.062px  →  301.062px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(16, 16, 16)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(255, 255, 255)
    color:  rgb(23, 33, 43)  →  rgb(16, 16, 16)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2)  [control-block]
    x:  431.7  →  421.7  (-10px)
    y:  856.4  →  776.8  (-79.6px)
    w:  273.1  →  301.1  (+28px)
    h:  52  →  67.2  (+15.2px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  8px
    column-gap:  normal  →  8px
    padding-top:  0px  →  10px
    width:  273.062px  →  301.062px
    height:  52px  →  67.1875px
    min-width:  auto  →  0px
    border-top-width:  0px  →  1px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > label  "COLOR"
    x:  431.7  →  421.7  (-10px)
    y:  856.4  →  787.8  (-68.6px)
    w:  273.1  →  301.1  (+28px)
    align-items:  normal  →  baseline
    row-gap:  normal  →  8px
    column-gap:  normal  →  8px
    width:  273.062px  →  301.062px
    height:  12px  →  13px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  0.8px  →  0.5px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div  [color-field]
    x:  431.7  →  421.7  (-10px)
    y:  876.4  →  816.8  (-59.6px)
    w:  273.1  →  301.1  (+28px)
    h:  32  →  27.2  (-4.8px)
    row-gap:  8px  →  6.4px
    column-gap:  8px  →  6.4px
    padding-right:  8px  →  0px
    padding-left:  8px  →  0px
    width:  273.062px  →  301.062px
    height:  32px  →  27.1875px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div > span  [dark swatch]
    x:  440.7  →  421.7  (-19px)
    y:  885.4  →  817.6  (-67.8px)
    w:  14  →  25.6  (+11.6px)
    h:  14  →  25.6  (+11.6px)
    width:  14px  →  25.5938px
    height:  14px  →  25.5938px
    border-radius:  0px  →  4px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(3) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div > input
    x:  462.7  →  453.6  (-9.1px)
    y:  885.9  →  816.8  (-69.1px)
    w:  233.1  →  269.1  (+36px)
    h:  13  →  27.2  (+14.2px)
    padding-top:  0px  →  5.6px
    padding-right:  0px  →  8px
    padding-bottom:  0px  →  5.6px
    padding-left:  0px  →  8px
    width:  233.062px  →  269.078px
    height:  13px  →  27.1875px
    border-top-width:  0px  →  1px
    border-top-style:  none  →  solid
    border-top-color:  rgb(23, 33, 43)  →  rgb(203, 211, 218)
    border-radius:  0px  →  4px
    background-color:  rgba(0, 0, 0, 0)  →  rgb(238, 241, 244)
    background-position:  0px 0px  →  0% 0%
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4)  [step-card]
    y:  937.4  →  855  (-82.4px)
    h:  144  →  127  (-17px)
    grid-template-columns:  46px 20px 598.125px  →  46px 618.125px
    grid-template-rows:  142px  →  45px 80px
    height:  144px  →  127px
    min-height:  138px  →  auto
    overflow:  visible  →  hidden
    border-radius:  0px  →  4px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(1)  [step-index]  "04"
    y:  938.4  →  856  (-82.4px)
    h:  142  →  45  (-97px)
    padding-bottom:  0px  →  6px
    height:  142px  →  45px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    font-size:  11px  →  22px
    font-weight:  400  →  600
    line-height:  normal  →  22px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > svg  [drag lucide lucide-grip-vertical lucide-icon]
    x:  104.6  →  58.6  (-46px)
    y:  955.4  →  901  (-54.4px)
    margin-top:  17px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2)  [step-body]
    x:  124.6  →  104.6  (-20px)
    y:  938.4  →  856  (-82.4px)
    w:  598.1  →  618.1  (+20px)
    h:  142  →  125  (-17px)
    display:  block  →  flex
    flex-direction:  row  →  column
    padding-top:  15px  →  0px
    padding-right:  18px  →  0px
    padding-bottom:  18px  →  0px
    padding-left:  18px  →  0px
    width:  598.125px  →  618.125px
    height:  142px  →  125px
    min-width:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(1)  [step-heading]
    x:  142.6  →  104.6  (-38px)
    y:  953.4  →  856  (-97.4px)
    w:  562.1  →  618.1  (+56px)
    h:  65  →  72  (+7px)
    align-items:  center  →  flex-start
    row-gap:  15px  →  8px
    column-gap:  15px  →  8px
    padding-top:  0px  →  8px
    padding-right:  0px  →  12px
    padding-bottom:  0px  →  8px
    padding-left:  0px  →  12px
    width:  562.125px  →  618.125px
    height:  65px  →  72px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1)  [step-heading-text]
    x:  142.6  →  116.6  (-26px)
    y:  953.4  →  864  (-89.4px)
    w:  107.2  →  117  (+9.8px)
    h:  65  →  55  (-10px)
    display:  block  →  flex
    flex-direction:  row  →  column
    width:  107.219px  →  117px
    height:  65px  →  55px
    min-width:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > span  [step-type]  "STYLE"
    x:  142.6  →  116.6  (-26px)
    y:  961.4  →  864  (-97.4px)
    w:  33.5  →  117  (+83.5px)
    display:  inline  →  block
    width:  auto  →  117px
    height:  auto  →  13px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > h2  [step-title]  "Round corners"
    x:  142.6  →  116.6  (-26px)
    y:  982.4  →  882  (-100.4px)
    w:  107.2  →  117  (+9.8px)
    width:  107.219px  →  117px
    height:  18px  →  19px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2)  [step-tools]
    x:  607.7  →  589.3  (-18.4px)
    y:  977.4  →  864  (-113.4px)
    w:  97  →  121.4  (+24.4px)
    h:  17  →  21.8  (+4.8px)
    row-gap:  13px  →  8px
    column-gap:  13px  →  8px
    width:  97px  →  121.375px
    height:  17px  →  21.7812px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button  [step-remove]
    y:  977.9  →  865.9  (-112px)
    w:  16  →  28  (+12px)
    h:  16  →  18  (+2px)
    display:  block  →  flex
    padding-top:  0px  →  1px
    padding-right:  0px  →  6px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  6px
    width:  16px  →  28px
    height:  16px  →  18px
    background-position:  0px 0px  →  0% 0%
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button > svg  [lucide lucide-icon lucide-x]
    x:  658.7  →  663.7  (+5px)
    y:  977.9  →  866.9  (-111px)
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > svg  [lucide lucide-ellipsis lucide-icon]
    x:  687.7  →  693.7  (+6px)
    y:  977.4  →  866.4  (-111px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > span  [badge badge--success]  "AUTO"
    x:  607.7  →  589.3  (-18.4px)
    y:  979.9  →  864  (-115.9px)
    w:  38  →  60.4  (+22.4px)
    h:  12  →  21.8  (+9.8px)
    row-gap:  4px  →  4.8px
    column-gap:  4px  →  4.8px
    padding-top:  0px  →  2.4px
    padding-right:  0px  →  7.2px
    padding-bottom:  0px  →  2.4px
    padding-left:  0px  →  7.2px
    width:  38px  →  60.375px
    height:  12px  →  21.7812px
    border-top-width:  0px  →  1px
    border-top-color:  rgb(203, 211, 218)  →  color(srgb 0.535686 0.761569 0.679216)
    border-radius:  0px  →  4px
    color:  rgb(35, 131, 84)  →  rgb(37, 169, 106)
    line-height:  normal  →  15px
    letter-spacing:  normal  →  0.8px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > span > svg  [lucide lucide-check lucide-icon]
    x:  607.7  →  597.5  (-10.2px)
    y:  979.9  →  868.9  (-111px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(37, 169, 106)
    color:  rgb(35, 131, 84)  →  rgb(37, 169, 106)
    line-height:  normal  →  15px
    letter-spacing:  normal  →  0.8px
    text-transform:  none  →  uppercase
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(2)  [compact controls]
    x:  142.6  →  104.6  (-38px)
    y:  1018.4  →  928  (-90.4px)
    w:  562.1  →  618.1  (+56px)
    h:  44  →  53  (+9px)
    row-gap:  16px  →  0px
    grid-template-columns:  273.062px 273.062px  →  301.062px 301.062px
    grid-template-rows:  44px  →  53px
    width:  562.125px  →  618.125px
    height:  44px  →  53px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1)  [control-block]
    x:  142.6  →  104.6  (-38px)
    y:  1018.4  →  928  (-90.4px)
    w:  273.1  →  301.1  (+28px)
    h:  44  →  53  (+9px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  0px
    column-gap:  normal  →  0px
    padding-top:  0px  →  10px
    width:  273.062px  →  301.062px
    height:  44px  →  53px
    min-width:  auto  →  0px
    border-top-width:  0px  →  1px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > label  "RADIUS"
    x:  142.6  →  104.6  (-38px)
    y:  1018.4  →  939  (-79.4px)
    w:  273.1  →  301.1  (+28px)
    h:  12  →  14  (+2px)
    align-items:  normal  →  center
    row-gap:  normal  →  8px
    column-gap:  normal  →  8px
    width:  273.062px  →  301.062px
    height:  12px  →  14px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  0.8px  →  0.5px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > label > output  "18 px"
    x:  384.1  →  370.2  (-13.9px)
    y:  1018.4  →  939  (-79.4px)
    w:  31.5  →  35.5  (+4px)
    h:  12  →  14  (+2px)
    width:  31.5156px  →  35.5px
    height:  12px  →  14px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-size:  10px  →  11px
    letter-spacing:  0.8px  →  0.5px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > input
    x:  142.6  →  106.6  (-36px)
    y:  1039.4  →  963  (-76.4px)
    w:  273.1  →  301.1  (+28px)
    display:  inline-block  →  block
    margin-top:  0px  →  2px
    margin-right:  0px  →  2px
    margin-bottom:  0px  →  2px
    margin-left:  0px  →  2px
    width:  273.062px  →  301.062px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(16, 16, 16)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(255, 255, 255)
    color:  rgb(23, 33, 43)  →  rgb(16, 16, 16)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2)  [toggle-row]
    x:  431.7  →  421.7  (-10px)
    y:  1018.4  →  928  (-90.4px)
    w:  273.1  →  301.1  (+28px)
    h:  44  →  53  (+9px)
    display:  block  →  flex
    justify-content:  normal  →  space-between
    align-items:  normal  →  center
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    padding-top:  0px  →  10px
    width:  273.062px  →  301.062px
    height:  44px  →  53px
    min-width:  auto  →  0px
    border-top-width:  0px  →  1px
    font-size:  16px  →  13.6px
    line-height:  24px  →  20.4px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > span  "Preserve aspect ratio"
    x:  431.7  →  421.7  (-10px)
    y:  1021.4  →  949.8  (-71.6px)
    w:  155.6  →  129  (-26.6px)
    h:  17  →  20.4  (+3.4px)
    display:  inline  →  block
    width:  auto  →  129.031px
    height:  auto  →  20.3906px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-size:  16px  →  13.6px
    line-height:  24px  →  20.4px

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > button  [on toggle]
    x:  587.3  →  684.3  (+97px)
    y:  1018.4  →  949.6  (-68.8px)
    w:  32  →  38.4  (+6.4px)
    h:  18  →  20.8  (+2.8px)
    display:  inline-block  →  block
    width:  32px  →  38.3906px
    height:  18px  →  20.7969px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  999px
    background-color:  rgba(0, 0, 0, 0)  →  rgb(23, 105, 210)
    color:  rgb(23, 33, 43)  →  rgb(0, 0, 0)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > section:nth-of-type(1) > div:nth-of-type(4) > article:nth-of-type(4) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > button > i  [toggle-knob]
    x:  603.3  →  703.9  (+100.6px)
    y:  1027.4  →  951.6  (-75.8px)
    w:  0  →  16.8  (+16.8px)
    h:  0  →  16.8  (+16.8px)
    display:  inline  →  block
    position:  static  →  absolute
    top:  auto  →  1px
    right:  auto  →  18.5938px
    bottom:  auto  →  1px
    left:  auto  →  1px
    width:  auto  →  16.7969px
    height:  auto  →  16.7969px
    transform:  none  →  matrix(1, 0, 0, 1, 17.6, 0)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    border-radius:  0px  →  50%
    background-color:  rgba(0, 0, 0, 0)  →  rgb(255, 255, 255)
    color:  rgb(23, 33, 43)  →  rgb(0, 0, 0)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > section:nth-of-type(1) > div:nth-of-type(5)  [pipeline-footer]
    y:  1081.4  →  982  (-99.4px)
    height:  36px  →  35px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(5) > button  [reset-btn]  "Reset pipeline"
    y:  1099.4  →  1000  (-99.4px)
    w:  97.1  →  109.8  (+12.7px)
    padding-top:  0px  →  1px
    padding-right:  0px  →  6px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  6px
    width:  97.0625px  →  109.75px
    height:  18px  →  17px
    background-position:  0px 0px  →  0% 0%
    line-height:  18px  →  normal

body > main > div > section:nth-of-type(1) > div:nth-of-type(5) > button > svg  [lucide lucide-icon lucide-rotate-ccw]
    x:  57.6  →  63.6  (+6px)
    y:  1101.4  →  1001.5  (-99.9px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    line-height:  18px  →  normal
    vertical-align:  middle  →  baseline

body > main > div > section:nth-of-type(1) > div:nth-of-type(5) > span  [auto-note]  "changes are applied automatically"
    x:  510.1  →  489.9  (-20.2px)
    y:  1101.9  →  1001.5  (-100.4px)
    w:  213.6  →  233.8  (+20.2px)
    width:  213.594px  →  233.812px
    height:  13px  →  14px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > section:nth-of-type(1) > div:nth-of-type(5) > span > i  [status-dot]
    x:  510.1  →  489.9  (-20.2px)
    y:  1105.4  →  1004.5  (-100.9px)
    w:  6  →  8  (+2px)
    h:  6  →  8  (+2px)
    width:  6px  →  8px
    height:  6px  →  8px
    box-shadow:  none  →  color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > section:nth-of-type(1) > div:nth-of-type(3)  [section-label]
    y:  392.4  →  381.8  (-10.6px)
    h:  59  →  50  (-9px)
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    height:  59px  →  50px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(3) > div  [section-text]
    y:  392.4  →  381.8  (-10.6px)
    w:  148.5  →  153.6  (+5.1px)
    h:  46  →  37  (-9px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  2px
    column-gap:  normal  →  2px
    width:  148.484px  →  153.609px
    height:  46px  →  37px
    min-width:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(3) > div > strong  "4 active steps"
    y:  421.4  →  400.8  (-20.6px)
    w:  148.5  →  153.6  (+5.1px)
    width:  148.484px  →  153.609px
    height:  17px  →  18px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > section:nth-of-type(1) > div:nth-of-type(3) > div > strong > em  "• LIVE"
    x:  173.1  →  175.2  (+2.1px)
    y:  425.4  →  404.8  (-20.6px)
    w:  33  →  36  (+3px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(37, 169, 106)

body > main > div > section:nth-of-type(1) > div:nth-of-type(3) > div > span  [mono-label]  "PROCESSING PIPELINE"
    y:  400.4  →  381.8  (-18.6px)
    w:  127.3  →  153.6  (+26.3px)
    display:  inline  →  block
    width:  auto  →  153.609px
    height:  auto  →  12px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    line-height:  normal  →  12px
    letter-spacing:  1.2px  →  1px
    text-transform:  none  →  uppercase

body > main > div > section:nth-of-type(1) > div:nth-of-type(3) > button  [add-btn]  "Add tool"
    x:  657.7  →  644.4  (-13.3px)
    y:  406.4  →  391.8  (-14.6px)
    w:  66  →  79.3  (+13.3px)
    padding-top:  0px  →  1px
    padding-right:  0px  →  6px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  6px
    width:  66.0469px  →  79.3125px
    height:  18px  →  17px
    background-position:  0px 0px  →  0% 0%
    line-height:  18px  →  normal

body > main > div > section:nth-of-type(1) > div:nth-of-type(3) > button > svg  [lucide lucide-icon lucide-plus]
    x:  657.7  →  650.4  (-7.3px)
    y:  407.9  →  392.8  (-15.1px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    line-height:  18px  →  normal
    vertical-align:  middle  →  baseline

body > main > footer  [preview-footer]
    y:  1532.9  →  2292.9  (+760px)
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    letter-spacing:  normal  →  0.8px

body > main > footer > span:nth-of-type(1)  "easy-png-tools"
    y:  1550.4  →  2309.9  (+759.5px)
    w:  117  →  142.8  (+25.8px)
    display:  flex  →  block
    align-items:  center  →  normal
    row-gap:  7px  →  normal
    column-gap:  7px  →  normal
    width:  116.984px  →  142.812px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  normal  →  0.8px

body > main > footer > span:nth-of-type(1) > b  [version]  "v2.4.0"
    x:  141.6  →  159.6  (+18px)
    y:  1550.4  →  2309.9  (+759.5px)
    w:  33  →  40.8  (+7.8px)
    display:  block  →  inline
    width:  33px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    font-weight:  400  →  700
    letter-spacing:  normal  →  0.8px

body > main > footer > span:nth-of-type(2)  "© 2024"
    x:  691.5  →  1341.6  (+650.1px)
    y:  1549.9  →  2309.9  (+760px)
    w:  141  →  40.8  (-100.2px)
    display:  flex  →  block
    align-items:  center  →  normal
    row-gap:  7px  →  normal
    column-gap:  7px  →  normal
    width:  140.969px  →  40.8125px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  normal  →  0.8px

body >main >footer >span:nth-of-type(2) >svg  [lucide lucide-link-2 lucide-link2]
    ✗ present in reference, absent in project

body >main >footer >span:nth-of-type(3)  "© 2024"
    ✗ present in reference, absent in project

body >div
    ✗ present in reference, absent in project


=== /preview/list-tools  (vs list-tools.html)  —  305 differences ===

body
    h:  2416.4  →  2361.6  (-54.8px)
    height:  2416.38px  →  2361.59px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main  [preview-root]
    h:  2416.4  →  2361.6  (-54.8px)
    height:  2416.38px  →  2361.59px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header  [topbar]
    position:  static  →  sticky
    top:  auto  →  0px
    z-index:  auto  →  20
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > a  [brand]
    w:  218.1  →  232.4  (+14.3px)
    width:  218.062px  →  232.422px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > a > span:nth-of-type(1)  [brand-mark]  "EP"
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(255, 255, 255)

body > main > header > a > span:nth-of-type(2)  "easy-png-tools"
    w:  107.8  →  117.6  (+9.8px)
    width:  107.766px  →  117.609px
    height:  17px  →  18px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > a > span:nth-of-type(3)  [version]  "/ CATALOG"
    x:  215.4  →  225.2  (+9.8px)
    w:  60.3  →  64.8  (+4.5px)
    width:  60.2969px  →  64.8125px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)

body > main > header > div  [top-actions]
    x:  1085.6  →  1070.6  (-15px)
    w:  296.8  →  311.8  (+15px)
    width:  296.828px  →  311.812px
    height:  29px  →  28px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > div > span  [status]  "LOCAL MODE / READY"
    x:  1085.6  →  1070.6  (-15px)
    w:  126.4  →  137.4  (+11px)
    width:  126.375px  →  137.406px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > header > div > span > i  [status-dot]
    x:  1085.6  →  1070.6  (-15px)
    w:  6  →  8  (+2px)
    h:  6  →  8  (+2px)
    width:  6px  →  8px
    height:  6px  →  8px
    box-shadow:  none  →  color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > header > div > button:nth-of-type(1)  [icon-btn icon-btn--bare]
    x:  1228  →  1224  (-4px)
    display:  grid  →  flex
    justify-content:  normal  →  center
    grid-template-columns:  17px  →  none
    grid-template-rows:  17px  →  none
    width:  29px  →  28px
    height:  29px  →  28px
    background-position:  0px 0px  →  0% 0%
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > header > div > button:nth-of-type(1) > svg  [lucide lucide-circle-question-mark lucide-icon]
    x:  1234  →  1230  (-4px)
    width:  17px  →  16px
    height:  17px  →  16px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > header > div > button:nth-of-type(2)  [icon-btn icon-btn--bare]
    x:  1273  →  1268  (-5px)
    display:  grid  →  flex
    justify-content:  normal  →  center
    grid-template-columns:  17px  →  none
    grid-template-rows:  17px  →  none
    width:  29px  →  28px
    height:  29px  →  28px
    background-position:  0px 0px  →  0% 0%
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > header > div > button:nth-of-type(2) > svg  [lucide lucide-icon lucide-moon]
    x:  1279  →  1274  (-5px)
    width:  17px  →  16px
    height:  17px  →  16px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > header > div > div  [lang]
    x:  1318  →  1312  (-6px)
    w:  64.5  →  70.4  (+5.9px)
    align-items:  center  →  normal
    width:  64.4531px  →  70.4062px
    height:  26px  →  27px
    overflow:  visible  →  hidden
    border-radius:  0px  →  4px

body > main > header > div > div > span  [lang-div]  "/"
    x:  1348  →  1344.2  (-3.8px)
    y:  19.5  →  25  (+5.5px)
    w:  4.5  →  6  (+1.5px)
    h:  24  →  13  (-11px)
    align-self:  auto  →  center
    width:  4.45312px  →  6px
    height:  24px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    color:  rgb(23, 33, 43)  →  rgb(109, 120, 131)
    font-family:  "IBM Plex Sans", sans-serif  →  "IBM Plex Mono", monospace
    font-size:  16px  →  10px
    line-height:  24px  →  normal

body > main > header > div > div > button:nth-of-type(2)  [lang-btn]  "EN"
    x:  1352.4  →  1350.2  (-2.2px)
    w:  29  →  31.2  (+2.2px)
    width:  29px  →  31.2031px
    height:  24px  →  25px
    background-position:  0px 0px  →  0% 0%
    letter-spacing:  normal  →  0.6px

body > main > header > div > div > button:nth-of-type(1)  [active lang-btn]  "RU"
    x:  1319  →  1313  (-6px)
    w:  29  →  31.2  (+2.2px)
    width:  29px  →  31.2031px
    height:  24px  →  25px
    letter-spacing:  normal  →  0.6px

body > main > header > nav  [nav]
    x:  760.6  →  504  (-256.6px)
    y:  25.5  →  24  (-1.5px)
    w:  296.9  →  376.6  (+79.7px)
    h:  12  →  15  (+3px)
    row-gap:  22px  →  18px
    column-gap:  22px  →  18px
    margin-right:  28px  →  0px
    margin-left:  484.984px  →  24px
    width:  296.938px  →  376.594px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > nav > a:nth-of-type(1)  "Workspace"
    x:  760.6  →  504  (-256.6px)
    y:  25.5  →  24  (-1.5px)
    w:  49.5  →  69.1  (+19.6px)
    h:  12  →  15  (+3px)
    width:  49.4844px  →  69.125px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > header > nav > a:nth-of-type(2)  "Catalog"
    x:  832.1  →  591.1  (-241px)
    y:  25.5  →  24  (-1.5px)
    w:  38.5  →  53.8  (+15.3px)
    h:  12  →  15  (+3px)
    width:  38.5px  →  53.7656px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    color:  rgb(23, 105, 210)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > header > nav > a:nth-of-type(3)  "Gradient"
    x:  892.6  →  662.9  (-229.7px)
    y:  25.5  →  24  (-1.5px)
    w:  44  →  61.5  (+17.5px)
    h:  12  →  15  (+3px)
    width:  43.9844px  →  61.4531px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > header > nav > a:nth-of-type(4)  "Background remover"
    x:  958.6  →  742.4  (-216.2px)
    y:  25.5  →  24  (-1.5px)
    w:  99  →  138.3  (+39.3px)
    h:  12  →  15  (+3px)
    width:  98.9688px  →  138.25px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > div  [catalog-page]
    h:  2352.4  →  2251.6  (-100.8px)
    height:  2352.38px  →  2251.59px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(1)  [catalog-head]
    h:  189.4  →  124.6  (-64.8px)
    flex-wrap:  nowrap  →  wrap
    row-gap:  40px  →  24px
    column-gap:  40px  →  24px
    padding-bottom:  42px  →  0px
    height:  189.375px  →  124.594px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(1) > div:nth-of-type(1)
    w:  660  →  510.7  (-149.3px)
    h:  146.4  →  124.6  (-21.8px)
    width:  660px  →  510.719px
    height:  146.375px  →  124.594px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(1) > div:nth-of-type(1) > div  [eyebrow]  "EASY-PNG-TOOLS / CATALOG"
    w:  660  →  510.7  (-149.3px)
    h:  12  →  15  (+3px)
    margin-bottom:  18px  →  8px
    width:  660px  →  510.719px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    color:  rgb(23, 105, 210)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  1.2px  →  2.16px

body > main > div > div:nth-of-type(1) > div:nth-of-type(1) > h1  "Tool catalog"
    y:  154  →  147  (-7px)
    w:  660  →  510.7  (-149.3px)
    h:  57.6  →  48  (-9.6px)
    margin-top:  12px  →  0px
    margin-bottom:  14px  →  0px
    width:  660px  →  510.719px
    height:  57.5938px  →  48px
    max-width:  700px  →  none
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-size:  57.6px  →  32px
    font-weight:  650  →  700
    line-height:  57.6px  →  48px
    letter-spacing:  -3.456px  →  normal

body > main > div > div:nth-of-type(1) > div:nth-of-type(1) > p  "Focused utilities for working with PNG. "
    y:  225.6  →  203  (-22.6px)
    w:  660  →  510.7  (-149.3px)
    margin-top:  0px  →  8px
    width:  660px  →  510.719px
    height:  44.7812px  →  45.5938px
    max-width:  660px  →  510.72px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  14px  →  15.2px
    line-height:  22.4px  →  22.8px

body > main > div > div:nth-of-type(1) > div:nth-of-type(2)  [catalog-total]
    x:  1251.3  →  1321.2  (+69.9px)
    y:  205.6  →  175  (-30.6px)
    w:  131.1  →  61.2  (-69.9px)
    h:  64.8  →  73.6  (+8.8px)
    flex-direction:  row  →  column
    align-items:  center  →  flex-end
    row-gap:  14px  →  normal
    column-gap:  14px  →  normal
    width:  131.141px  →  61.2031px
    height:  64.7969px  →  73.5938px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  14px  →  16px
    text-align:  right  →  start

body > main > div > div:nth-of-type(1) > div:nth-of-type(2) > b  "32"
    x:  1251.3  →  1344  (+92.7px)
    y:  205.6  →  175  (-30.6px)
    w:  67.7  →  38.4  (-29.3px)
    h:  64.8  →  42  (-22.8px)
    width:  67.6562px  →  38.4062px
    height:  64.7969px  →  42px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-size:  72px  →  32px
    font-weight:  400  →  700
    line-height:  64.8px  →  normal
    letter-spacing:  -5.76px  →  normal
    text-align:  right  →  start

body > main > div > div:nth-of-type(1) > div:nth-of-type(2) > span  "TOOLS AVAILABLE"
    x:  1332.9  →  1321.2  (-11.7px)
    y:  224  →  222.6  (-1.4px)
    w:  49.5  →  61.2  (+11.7px)
    h:  28  →  26  (-2px)
    margin-top:  0px  →  5.6px
    width:  49.4844px  →  61.2031px
    height:  28px  →  26px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    line-height:  14px  →  normal
    letter-spacing:  normal  →  0.8px

body > main > div > div:nth-of-type(1) > div:nth-of-type(2) > span > br
    y:  225  →  222.6  (-2.4px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    line-height:  14px  →  normal
    letter-spacing:  normal  →  0.8px

body > main > div > div:nth-of-type(2)  [catalog-toolbar]
    y:  313.4  →  248.6  (-64.8px)
    h:  108  →  75  (-33px)
    flex-wrap:  nowrap  →  wrap
    row-gap:  24px  →  16px
    column-gap:  24px  →  16px
    padding-top:  24px  →  20px
    padding-bottom:  42px  →  20px
    height:  108px  →  75px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(2) > label  [catalog-search]
    y:  337.4  →  268.6  (-68.8px)
    w:  420  →  202  (-218px)
    h:  42  →  35  (-7px)
    row-gap:  12px  →  8px
    column-gap:  12px  →  8px
    padding-top:  12px  →  8px
    padding-right:  14px  →  12px
    padding-bottom:  12px  →  8px
    padding-left:  14px  →  12px
    width:  420px  →  202px
    height:  42px  →  35px
    border-radius:  0px  →  4px
    background-color:  rgba(0, 0, 0, 0)  →  rgb(248, 250, 251)

body > main > div > div:nth-of-type(2) > label > svg  [lucide lucide-icon lucide-search]
    x:  72.6  →  70.6  (-2px)
    y:  350.4  →  278.1  (-72.3px)
    w:  14.9  →  16  (+1.1px)
    width:  14.8906px  →  16px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(2) > label > input
    x:  99.5  →  94.6  (-4.9px)
    y:  351.4  →  277.6  (-73.8px)
    w:  363.1  →  152  (-211.1px)
    h:  14  →  17  (+3px)
    padding-top:  0px  →  1px
    padding-right:  0px  →  2px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  2px
    width:  363.109px  →  152px
    height:  14px  →  17px
    background-position:  0px 0px  →  0% 0%

body > main > div > div:nth-of-type(2) > div  [catalog-filters]
    x:  901.9  →  850.9  (-51px)
    y:  343.4  →  272.2  (-71.2px)
    w:  480.5  →  531.5  (+51px)
    h:  30  →  27.8  (-2.2px)
    row-gap:  6px  →  6.4px
    column-gap:  6px  →  6.4px
    width:  480.469px  →  531.484px
    height:  30px  →  27.7812px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(2) > div > svg  [lucide lucide-funnel lucide-icon]
    x:  901.9  →  850.9  (-51px)
    y:  350.9  →  278.6  (-72.3px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(2) > div > button:nth-of-type(1)  [active]  "ALL"
    x:  922.9  →  872.3  (-50.6px)
    y:  343.4  →  272.2  (-71.2px)
    w:  38.5  →  41  (+2.5px)
    h:  30  →  27.8  (-2.2px)
    padding-top:  8px  →  6.4px
    padding-right:  10px  →  9.6px
    padding-bottom:  8px  →  6.4px
    padding-left:  10px  →  9.6px
    width:  38.5px  →  41px
    height:  30px  →  27.7812px
    border-radius:  0px  →  4px
    background-color:  rgba(0, 0, 0, 0)  →  rgb(23, 105, 210)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(23, 105, 210)  →  rgb(255, 255, 255)
    letter-spacing:  normal  →  0.6px

body > main > div > div:nth-of-type(2) > div > button:nth-of-type(2)  "CONVERT"
    x:  967.4  →  919.7  (-47.7px)
    y:  343.4  →  272.2  (-71.2px)
    w:  60.5  →  67.4  (+6.9px)
    h:  30  →  27.8  (-2.2px)
    padding-top:  8px  →  6.4px
    padding-right:  10px  →  9.6px
    padding-bottom:  8px  →  6.4px
    padding-left:  10px  →  9.6px
    width:  60.5px  →  67.3906px
    height:  30px  →  27.7812px
    border-top-color:  rgba(0, 0, 0, 0)  →  rgb(203, 211, 218)
    border-radius:  0px  →  4px
    background-position:  0px 0px  →  0% 0%
    letter-spacing:  normal  →  0.6px

body > main > div > div:nth-of-type(2) > div > button:nth-of-type(3)  "TRANSPARENCY"
    x:  1033.9  →  993.5  (-40.4px)
    y:  343.4  →  272.2  (-71.2px)
    w:  88  →  100.4  (+12.4px)
    h:  30  →  27.8  (-2.2px)
    padding-top:  8px  →  6.4px
    padding-right:  10px  →  9.6px
    padding-bottom:  8px  →  6.4px
    padding-left:  10px  →  9.6px
    width:  87.9844px  →  100.391px
    height:  30px  →  27.7812px
    border-top-color:  rgba(0, 0, 0, 0)  →  rgb(203, 211, 218)
    border-radius:  0px  →  4px
    background-position:  0px 0px  →  0% 0%
    letter-spacing:  normal  →  0.6px

body > main > div > div:nth-of-type(2) > div > button:nth-of-type(4)  "COLOR"
    x:  1127.9  →  1100.3  (-27.6px)
    y:  343.4  →  272.2  (-71.2px)
    w:  49.5  →  54.2  (+4.7px)
    h:  30  →  27.8  (-2.2px)
    padding-top:  8px  →  6.4px
    padding-right:  10px  →  9.6px
    padding-bottom:  8px  →  6.4px
    padding-left:  10px  →  9.6px
    width:  49.5px  →  54.1875px
    height:  30px  →  27.7812px
    border-top-color:  rgba(0, 0, 0, 0)  →  rgb(203, 211, 218)
    border-radius:  0px  →  4px
    background-position:  0px 0px  →  0% 0%
    letter-spacing:  normal  →  0.6px

body > main > div > div:nth-of-type(2) > div > button:nth-of-type(5)  "GEOMETRY"
    x:  1183.4  →  1160.8  (-22.6px)
    y:  343.4  →  272.2  (-71.2px)
    w:  66  →  74  (+8px)
    h:  30  →  27.8  (-2.2px)
    padding-top:  8px  →  6.4px
    padding-right:  10px  →  9.6px
    padding-bottom:  8px  →  6.4px
    padding-left:  10px  →  9.6px
    width:  65.9844px  →  74px
    height:  30px  →  27.7812px
    border-top-color:  rgba(0, 0, 0, 0)  →  rgb(203, 211, 218)
    border-radius:  0px  →  4px
    background-position:  0px 0px  →  0% 0%
    letter-spacing:  normal  →  0.6px

body > main > div > div:nth-of-type(2) > div > button:nth-of-type(6)  "FILTERS"
    x:  1255.4  →  1241.2  (-14.2px)
    y:  343.4  →  272.2  (-71.2px)
    w:  60.5  →  67.4  (+6.9px)
    h:  30  →  27.8  (-2.2px)
    padding-top:  8px  →  6.4px
    padding-right:  10px  →  9.6px
    padding-bottom:  8px  →  6.4px
    padding-left:  10px  →  9.6px
    width:  60.5px  →  67.3906px
    height:  30px  →  27.7812px
    border-top-color:  rgba(0, 0, 0, 0)  →  rgb(203, 211, 218)
    border-radius:  0px  →  4px
    background-position:  0px 0px  →  0% 0%
    letter-spacing:  normal  →  0.6px

body > main > div > div:nth-of-type(2) > div > button:nth-of-type(7)  "ANALYZE"
    x:  1321.9  →  1315  (-6.9px)
    y:  343.4  →  272.2  (-71.2px)
    w:  60.5  →  67.4  (+6.9px)
    h:  30  →  27.8  (-2.2px)
    padding-top:  8px  →  6.4px
    padding-right:  10px  →  9.6px
    padding-bottom:  8px  →  6.4px
    padding-left:  10px  →  9.6px
    width:  60.5px  →  67.3906px
    height:  30px  →  27.7812px
    border-top-color:  rgba(0, 0, 0, 0)  →  rgb(203, 211, 218)
    border-radius:  0px  →  4px
    background-position:  0px 0px  →  0% 0%
    letter-spacing:  normal  →  0.6px

body > main > div > div:nth-of-type(3)  [catalog-groups]
    y:  421.4  →  323.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1)  [catalog-group]
    y:  421.4  →  323.6  (-97.8px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    min-width:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(1)  [group-title]
    y:  421.4  →  323.6  (-97.8px)
    h:  26  →  24  (-2px)
    align-items:  center  →  baseline
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    padding-bottom:  12px  →  8px
    height:  26px  →  24px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  16px
    font-weight:  600  →  400
    line-height:  normal  →  24px
    letter-spacing:  1.32px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(1) > span  "CONVERT"
    y:  421.4  →  323.6  (-97.8px)
    w:  51.6  →  62.2  (+10.6px)
    h:  13  →  15  (+2px)
    width:  51.5781px  →  62.1719px
    height:  13px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-size:  11px  →  12px
    font-weight:  600  →  400
    letter-spacing:  1.32px  →  1.68px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(1) > i  "05 TOOLS"
    y:  421.9  →  325.6  (-96.3px)
    width:  54.5625px  →  54.4062px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  1.32px  →  0.8px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2)  [tool-cards]
    y:  447.4  →  363.6  (-83.8px)
    h:  584  →  570  (-14px)
    padding-top:  14px  →  0px
    height:  584px  →  570px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(1)  [tool-card]
    y:  461.4  →  363.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(1)  [tool-icon]
    y:  493.4  →  395.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(1) > svg  [lucide lucide-file-image lucide-icon]
    y:  504.9  →  407.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2)  [tool-copy]
    y:  493.9  →  398.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2) > strong  "Convert JPG to PNG"
    y:  493.9  →  398.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2) > span  "Re-encode JPEG files as lossless PNG whi"
    y:  516.9  →  417.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(3)  [tool-index]  "01"
    y:  478.4  →  380.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(1) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  506.4  →  408.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(2)  [tool-card]
    y:  577.4  →  479.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(1)  [tool-icon]
    y:  609.4  →  511.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(1) > svg  [lucide lucide-file-image lucide-icon]
    y:  620.9  →  523.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2)  [tool-copy]
    y:  609.9  →  514.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2) > strong  "Convert WebP to PNG"
    y:  609.9  →  514.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2) > span  "Turn WebP images into a universal PNG fo"
    y:  632.9  →  533.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(3)  [tool-index]  "02"
    y:  594.4  →  496.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(2) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  622.4  →  524.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(3)  [tool-card]
    y:  693.4  →  595.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(1)  [tool-icon]
    y:  725.4  →  627.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(1) > svg  [lucide lucide-binary lucide-icon]
    y:  736.9  →  639.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2)  [tool-copy]
    y:  725.9  →  630.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2) > strong  "PNG to Base64"
    y:  725.9  →  630.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2) > span  "Encode an image as a base64 string for e"
    y:  748.9  →  649.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(3)  [tool-index]  "03"
    y:  710.4  →  612.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(3) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  738.4  →  640.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(4)  [tool-card]
    y:  809.4  →  711.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(1)  [tool-icon]
    y:  841.4  →  743.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-link-2]
    y:  852.9  →  755.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2)  [tool-copy]
    y:  841.9  →  746.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2) > strong  "PNG to Data URI"
    y:  841.9  →  746.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2) > span  "Build a complete data URI ready for HTML"
    y:  864.9  →  765.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(3)  [tool-index]  "04"
    y:  826.4  →  728.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(4) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  854.4  →  756.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(5)  [tool-card]
    y:  925.4  →  827.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(1)  [tool-icon]
    y:  957.4  →  859.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(1) > svg  [lucide lucide-file-image lucide-icon]
    y:  968.9  →  871.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(2)  [tool-copy]
    y:  957.9  →  862.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(2) > strong  "Convert PNG to JPG"
    y:  957.9  →  862.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(2) > span  "Composite transparency over a selected b"
    y:  980.9  →  881.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(3)  [tool-index]  "05"
    y:  942.4  →  844.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > a:nth-of-type(5) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  970.4  →  872.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2)  [catalog-group]
    y:  421.4  →  323.6  (-97.8px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    min-width:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1)  [group-title]
    y:  421.4  →  323.6  (-97.8px)
    h:  26  →  24  (-2px)
    align-items:  center  →  baseline
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    padding-bottom:  12px  →  8px
    height:  26px  →  24px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  16px
    font-weight:  600  →  400
    line-height:  normal  →  24px
    letter-spacing:  1.32px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > span  "TRANSPARENCY"
    y:  421.4  →  323.6  (-97.8px)
    w:  88.4  →  106.6  (+18.2px)
    h:  13  →  15  (+2px)
    width:  88.4219px  →  106.562px
    height:  13px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-size:  11px  →  12px
    font-weight:  600  →  400
    letter-spacing:  1.32px  →  1.68px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > i  "05 TOOLS"
    y:  421.9  →  325.6  (-96.3px)
    width:  54.5625px  →  54.4062px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  1.32px  →  0.8px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2)  [tool-cards]
    y:  447.4  →  363.6  (-83.8px)
    h:  584  →  570  (-14px)
    padding-top:  14px  →  0px
    height:  584px  →  570px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(1)  [tool-card]
    y:  461.4  →  363.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(1)  [tool-icon]
    y:  493.4  →  395.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-scissors]
    y:  504.9  →  407.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2)  [tool-copy]
    y:  493.9  →  389.1  (-104.8px)
    h:  41  →  55  (+14px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  55px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2) > strong  "Remove background PNG"
    y:  493.9  →  389.1  (-104.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2) > span  "Remove a solid background by color, tole"
    y:  516.9  →  408.1  (-108.8px)
    h:  18  →  36  (+18px)
    height:  18px  →  36px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(3)  [tool-index]  "01"
    y:  478.4  →  380.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(1) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  506.4  →  408.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(2)  [tool-card]
    y:  577.4  →  479.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(1)  [tool-icon]
    y:  609.4  →  511.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-layers]
    y:  620.9  →  523.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2)  [tool-copy]
    y:  609.9  →  514.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2) > strong  "Extract alpha mask"
    y:  609.9  →  514.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2) > span  "Turn the alpha channel into a clean blac"
    y:  632.9  →  533.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(3)  [tool-index]  "02"
    y:  594.4  →  496.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(2) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  622.4  →  524.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(3)  [tool-card]
    y:  693.4  →  595.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(1)  [tool-icon]
    y:  725.4  →  627.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(1) > svg  [lucide lucide-frame lucide-icon]
    y:  736.9  →  639.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2)  [tool-copy]
    y:  725.9  →  630.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2) > strong  "Round corners PNG"
    y:  725.9  →  630.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2) > span  "Clip the image corners by a precise radi"
    y:  748.9  →  649.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(3)  [tool-index]  "03"
    y:  710.4  →  612.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(3) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  738.4  →  640.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(4)  [tool-card]
    y:  809.4  →  711.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(1)  [tool-icon]
    y:  841.4  →  743.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-square]
    y:  852.9  →  755.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2)  [tool-copy]
    y:  841.9  →  746.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2) > strong  "Outline PNG"
    y:  841.9  →  746.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2) > span  "Add a colored ring around opaque content"
    y:  864.9  →  765.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(3)  [tool-index]  "04"
    y:  826.4  →  728.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(4) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  854.4  →  756.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(5)  [tool-card]
    y:  925.4  →  827.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(1)  [tool-icon]
    y:  957.4  →  859.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(1) > svg  [lucide lucide-droplet lucide-icon]
    y:  968.9  →  871.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(2)  [tool-copy]
    y:  957.9  →  853.1  (-104.8px)
    h:  41  →  55  (+14px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  55px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(2) > strong  "Change PNG opacity"
    y:  957.9  →  853.1  (-104.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(2) > span  "Multiply the alpha channel while keeping"
    y:  980.9  →  872.1  (-108.8px)
    h:  18  →  36  (+18px)
    height:  18px  →  36px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(3)  [tool-index]  "05"
    y:  942.4  →  844.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > a:nth-of-type(5) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  970.4  →  872.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(3)  [catalog-group]
    y:  1087.4  →  989.6  (-97.8px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    min-width:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(1)  [group-title]
    y:  1087.4  →  989.6  (-97.8px)
    h:  26  →  24  (-2px)
    align-items:  center  →  baseline
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    padding-bottom:  12px  →  8px
    height:  26px  →  24px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  16px
    font-weight:  600  →  400
    line-height:  normal  →  24px
    letter-spacing:  1.32px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(1) > span  "COLOR"
    y:  1087.4  →  989.6  (-97.8px)
    w:  36.8  →  44.4  (+7.6px)
    h:  13  →  15  (+2px)
    width:  36.8438px  →  44.4062px
    height:  13px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-size:  11px  →  12px
    font-weight:  600  →  400
    letter-spacing:  1.32px  →  1.68px

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(1) > i  "05 TOOLS"
    y:  1087.9  →  991.6  (-96.3px)
    width:  54.5625px  →  54.4062px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  1.32px  →  0.8px

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2)  [tool-cards]
    y:  1113.4  →  1029.6  (-83.8px)
    h:  584  →  570  (-14px)
    padding-top:  14px  →  0px
    height:  584px  →  570px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(1)  [tool-card]
    y:  1127.4  →  1029.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(1)  [tool-icon]
    y:  1159.4  →  1061.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-sun]
    y:  1170.9  →  1073.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2)  [tool-copy]
    y:  1159.9  →  1055.1  (-104.8px)
    h:  41  →  55  (+14px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  55px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2) > strong  "Create gradient PNG"
    y:  1159.9  →  1055.1  (-104.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2) > span  "Generate a smooth transition between two"
    y:  1182.9  →  1074.1  (-108.8px)
    h:  18  →  36  (+18px)
    height:  18px  →  36px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(3)  [tool-index]  "01"
    y:  1144.4  →  1046.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(1) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1172.4  →  1074.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(2)  [tool-card]
    y:  1243.4  →  1145.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(1)  [tool-icon]
    y:  1275.4  →  1177.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(1) > svg  [lucide lucide-contrast lucide-icon]
    y:  1286.9  →  1189.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2)  [tool-copy]
    y:  1275.9  →  1180.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2) > strong  "Grayscale PNG"
    y:  1275.9  →  1180.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2) > span  "Convert the image to luminance-based sha"
    y:  1298.9  →  1199.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(3)  [tool-index]  "02"
    y:  1260.4  →  1162.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(2) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1288.4  →  1190.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(3)  [tool-card]
    y:  1359.4  →  1261.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(1)  [tool-icon]
    y:  1391.4  →  1293.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(1) > svg  [lucide lucide-blend lucide-icon]
    y:  1402.9  →  1305.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2)  [tool-copy]
    y:  1391.9  →  1296.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2) > strong  "Invert colors PNG"
    y:  1391.9  →  1296.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2) > span  "Invert every color channel while leaving"
    y:  1414.9  →  1315.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(3)  [tool-index]  "03"
    y:  1376.4  →  1278.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(3) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1404.4  →  1306.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(4)  [tool-card]
    y:  1475.4  →  1377.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(1)  [tool-icon]
    y:  1507.4  →  1409.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-sun]
    y:  1518.9  →  1421.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2)  [tool-copy]
    y:  1507.9  →  1412.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2) > strong  "Brightness & contrast"
    y:  1507.9  →  1412.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2) > span  "Adjust brightness and contrast across a "
    y:  1530.9  →  1431.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(3)  [tool-index]  "04"
    y:  1492.4  →  1394.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(4) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1520.4  →  1422.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(5)  [tool-card]
    y:  1591.4  →  1493.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(1)  [tool-icon]
    y:  1623.4  →  1525.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-sun]
    y:  1634.9  →  1537.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(2)  [tool-copy]
    y:  1623.9  →  1528.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(2) > strong  "Temperature PNG"
    y:  1623.9  →  1528.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(2) > span  "Make an image warmer or cooler with a si"
    y:  1646.9  →  1547.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(3)  [tool-index]  "05"
    y:  1608.4  →  1510.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(3) > div:nth-of-type(2) > a:nth-of-type(5) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1636.4  →  1538.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(4)  [catalog-group]
    y:  1087.4  →  989.6  (-97.8px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    min-width:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(1)  [group-title]
    y:  1087.4  →  989.6  (-97.8px)
    h:  26  →  24  (-2px)
    align-items:  center  →  baseline
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    padding-bottom:  12px  →  8px
    height:  26px  →  24px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  16px
    font-weight:  600  →  400
    line-height:  normal  →  24px
    letter-spacing:  1.32px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(1) > span  "GEOMETRY"
    y:  1087.4  →  989.6  (-97.8px)
    w:  59  →  71  (+12px)
    h:  13  →  15  (+2px)
    width:  58.9531px  →  71.0469px
    height:  13px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-size:  11px  →  12px
    font-weight:  600  →  400
    letter-spacing:  1.32px  →  1.68px

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(1) > i  "05 TOOLS"
    y:  1087.9  →  991.6  (-96.3px)
    width:  54.5625px  →  54.4062px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  1.32px  →  0.8px

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2)  [tool-cards]
    y:  1113.4  →  1029.6  (-83.8px)
    h:  584  →  570  (-14px)
    padding-top:  14px  →  0px
    height:  584px  →  570px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(1)  [tool-card]
    y:  1127.4  →  1029.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(1)  [tool-icon]
    y:  1159.4  →  1061.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-scaling]
    y:  1170.9  →  1073.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2)  [tool-copy]
    y:  1159.9  →  1055.1  (-104.8px)
    h:  41  →  55  (+14px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  55px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2) > strong  "Resize PNG"
    y:  1159.9  →  1055.1  (-104.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2) > span  "Scale an image with bilinear interpolati"
    y:  1182.9  →  1074.1  (-108.8px)
    h:  18  →  36  (+18px)
    height:  18px  →  36px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(3)  [tool-index]  "01"
    y:  1144.4  →  1046.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(1) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1172.4  →  1074.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(2)  [tool-card]
    y:  1243.4  →  1145.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(1)  [tool-icon]
    y:  1275.4  →  1177.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(1) > svg  [lucide lucide-crop lucide-icon]
    y:  1286.9  →  1189.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2)  [tool-copy]
    y:  1275.9  →  1180.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2) > strong  "Crop PNG"
    y:  1275.9  →  1180.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2) > span  "Cut a rectangular area with exact coordi"
    y:  1298.9  →  1199.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(3)  [tool-index]  "02"
    y:  1260.4  →  1162.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(2) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1288.4  →  1190.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(3)  [tool-card]
    y:  1359.4  →  1261.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(1)  [tool-icon]
    y:  1391.4  →  1293.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-rotate-cw]
    y:  1402.9  →  1305.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2)  [tool-copy]
    y:  1391.9  →  1296.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2) > strong  "Rotate PNG"
    y:  1391.9  →  1296.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2) > span  "Rotate by 90, 180, or 270 degrees withou"
    y:  1414.9  →  1315.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(3)  [tool-index]  "03"
    y:  1376.4  →  1278.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(3) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1404.4  →  1306.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(4)  [tool-card]
    y:  1475.4  →  1377.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(1)  [tool-icon]
    y:  1507.4  →  1409.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(1) > svg  [lucide lucide-flip-horizontal-2 lucide-icon]
    y:  1518.9  →  1421.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2)  [tool-copy]
    y:  1507.9  →  1412.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2) > strong  "Flip PNG"
    y:  1507.9  →  1412.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2) > span  "Mirror the image horizontally or vertica"
    y:  1530.9  →  1431.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(3)  [tool-index]  "04"
    y:  1492.4  →  1394.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(4) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1520.4  →  1422.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(5)  [tool-card]
    y:  1591.4  →  1493.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(1)  [tool-icon]
    y:  1623.4  →  1525.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-maximize-2]
    y:  1634.9  →  1537.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(2)  [tool-copy]
    y:  1623.9  →  1528.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(2) > strong  "Add padding to PNG"
    y:  1623.9  →  1528.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(2) > span  "Expand the canvas on all sides by a chos"
    y:  1646.9  →  1547.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(5) > span:nth-of-type(3)  [tool-index]  "05"
    y:  1608.4  →  1510.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(4) > div:nth-of-type(2) > a:nth-of-type(5) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1636.4  →  1538.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(5)  [catalog-group]
    y:  1753.4  →  1655.6  (-97.8px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    min-width:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(1)  [group-title]
    y:  1753.4  →  1655.6  (-97.8px)
    h:  26  →  24  (-2px)
    align-items:  center  →  baseline
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    padding-bottom:  12px  →  8px
    height:  26px  →  24px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  16px
    font-weight:  600  →  400
    line-height:  normal  →  24px
    letter-spacing:  1.32px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(1) > span  "FILTERS"
    y:  1753.4  →  1655.6  (-97.8px)
    w:  51.6  →  62.2  (+10.6px)
    h:  13  →  15  (+2px)
    width:  51.5781px  →  62.1719px
    height:  13px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-size:  11px  →  12px
    font-weight:  600  →  400
    letter-spacing:  1.32px  →  1.68px

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(1) > i  "04 TOOLS"
    y:  1753.9  →  1657.6  (-96.3px)
    width:  54.5625px  →  54.4062px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  1.32px  →  0.8px

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2)  [tool-cards]
    y:  1779.4  →  1695.6  (-83.8px)
    h:  468  →  454  (-14px)
    padding-top:  14px  →  0px
    height:  468px  →  454px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(1)  [tool-card]
    y:  1793.4  →  1695.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(1)  [tool-icon]
    y:  1825.4  →  1727.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(1) > svg  [lucide lucide-droplets lucide-icon]
    y:  1836.9  →  1739.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2)  [tool-copy]
    y:  1825.9  →  1730.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2) > strong  "Blur PNG"
    y:  1825.9  →  1730.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2) > span  "Apply a fast Gaussian-style blur with tr"
    y:  1848.9  →  1749.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(3)  [tool-index]  "01"
    y:  1810.4  →  1712.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(1) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1838.4  →  1740.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(2)  [tool-card]
    y:  1909.4  →  1811.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(1)  [tool-icon]
    y:  1941.4  →  1843.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(1) > svg  [lucide lucide-focus lucide-icon]
    y:  1952.9  →  1855.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2)  [tool-copy]
    y:  1941.9  →  1846.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2) > strong  "Sharpen PNG"
    y:  1941.9  →  1846.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2) > span  "Emphasize edges with an adjustable sharp"
    y:  1964.9  →  1865.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(3)  [tool-index]  "02"
    y:  1926.4  →  1828.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(2) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1954.4  →  1856.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(3)  [tool-card]
    y:  2025.4  →  1927.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(1)  [tool-icon]
    y:  2057.4  →  1959.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-sun]
    y:  2068.9  →  1971.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2)  [tool-copy]
    y:  2057.9  →  1962.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2) > strong  "Vignette PNG"
    y:  2057.9  →  1962.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2) > span  "Smoothly darken the image edges while pr"
    y:  2080.9  →  1981.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(3)  [tool-index]  "03"
    y:  2042.4  →  1944.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(3) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  2070.4  →  1972.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(4)  [tool-card]
    y:  2141.4  →  2043.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(1)  [tool-icon]
    y:  2173.4  →  2075.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-layers]
    y:  2184.9  →  2087.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2)  [tool-copy]
    y:  2173.9  →  2078.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2) > strong  "JPEG artifacts"
    y:  2173.9  →  2078.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2) > span  "Simulate low-quality JPEG recompression "
    y:  2196.9  →  2097.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(3)  [tool-index]  "04"
    y:  2158.4  →  2060.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(5) > div:nth-of-type(2) > a:nth-of-type(4) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  2186.4  →  2088.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(6)  [catalog-group]
    y:  1753.4  →  1655.6  (-97.8px)
    display:  block  →  flex
    flex-direction:  row  →  column
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    min-width:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(1)  [group-title]
    y:  1753.4  →  1655.6  (-97.8px)
    h:  26  →  24  (-2px)
    align-items:  center  →  baseline
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    padding-bottom:  12px  →  8px
    height:  26px  →  24px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  16px
    font-weight:  600  →  400
    line-height:  normal  →  24px
    letter-spacing:  1.32px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(1) > span  "ANALYZE"
    y:  1753.4  →  1655.6  (-97.8px)
    w:  51.6  →  62.2  (+10.6px)
    h:  13  →  15  (+2px)
    width:  51.5781px  →  62.1719px
    height:  13px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-size:  11px  →  12px
    font-weight:  600  →  400
    letter-spacing:  1.32px  →  1.68px

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(1) > i  "04 TOOLS"
    y:  1753.9  →  1657.6  (-96.3px)
    width:  54.5625px  →  54.4062px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  1.32px  →  0.8px

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2)  [tool-cards]
    y:  1779.4  →  1695.6  (-83.8px)
    h:  468  →  454  (-14px)
    padding-top:  14px  →  0px
    height:  468px  →  454px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(1)  [tool-card]
    y:  1793.4  →  1695.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(1)  [tool-icon]
    y:  1825.4  →  1727.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-info]
    y:  1836.9  →  1739.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2)  [tool-copy]
    y:  1825.9  →  1730.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2) > strong  "PNG info"
    y:  1825.9  →  1730.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(2) > span  "Inspect dimensions, alpha presence, and "
    y:  1848.9  →  1749.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(1) > span:nth-of-type(3)  [tool-index]  "01"
    y:  1810.4  →  1712.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(1) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1838.4  →  1740.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(2)  [tool-card]
    y:  1909.4  →  1811.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(1)  [tool-icon]
    y:  1941.4  →  1843.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-search-check]
    y:  1952.9  →  1855.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2)  [tool-copy]
    y:  1941.9  →  1846.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2) > strong  "Check grayscale"
    y:  1941.9  →  1846.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(2) > span  "Report whether the image contains only s"
    y:  1964.9  →  1865.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(2) > span:nth-of-type(3)  [tool-index]  "02"
    y:  1926.4  →  1828.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(2) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  1954.4  →  1856.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(3)  [tool-card]
    y:  2025.4  →  1927.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(1)  [tool-icon]
    y:  2057.4  →  1959.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(1) > svg  [lucide lucide-eye lucide-icon]
    y:  2068.9  →  1971.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2)  [tool-copy]
    y:  2057.9  →  1962.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2) > strong  "Check transparency"
    y:  2057.9  →  1962.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(2) > span  "Detect transparent and semi-transparent "
    y:  2080.9  →  1981.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(3) > span:nth-of-type(3)  [tool-index]  "03"
    y:  2042.4  →  1944.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(3) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  2070.4  →  1972.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(4)  [tool-card]
    y:  2141.4  →  2043.6  (-97.8px)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(1)  [tool-icon]
    y:  2173.4  →  2075.6  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    border-radius:  0px  →  4px

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(1) > svg  [lucide lucide-icon lucide-ruler]
    y:  2184.9  →  2087.1  (-97.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2)  [tool-copy]
    y:  2173.9  →  2078.1  (-95.8px)
    h:  41  →  37  (-4px)
    display:  grid  →  flex
    flex-direction:  row  →  column
    row-gap:  8px  →  2px
    column-gap:  8px  →  2px
    grid-template-columns:  488.406px  →  none
    grid-template-rows:  15px 18px  →  none
    height:  41px  →  37px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2) > strong  "PNG orientation"
    y:  2173.9  →  2078.1  (-95.8px)
    h:  15  →  17  (+2px)
    height:  15px  →  17px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(2) > span  "Classify the image as portrait, landscap"
    y:  2196.9  →  2097.1  (-99.8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(4) > span:nth-of-type(3)  [tool-index]  "04"
    y:  2158.4  →  2060.6  (-97.8px)
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > div > div:nth-of-type(3) > section:nth-of-type(6) > div:nth-of-type(2) > a:nth-of-type(4) > svg  [lucide lucide-arrow-up-right lucide-icon tool-arrow]
    y:  2186.4  →  2088.6  (-97.8px)
    opacity:  0  →  1
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    vertical-align:  middle  →  baseline

body > main > div > footer  [catalog-footer]  "ALL OPERATIONS RUN LOCALLY YOUR FILES NE"
    y:  2311.4  →  2205.6  (-105.8px)
    h:  33  →  38  (+5px)
    display:  block  →  flex
    flex-wrap:  nowrap  →  wrap
    row-gap:  normal  →  24px
    column-gap:  normal  →  24px
    margin-top:  64px  →  56px
    padding-top:  20px  →  24px
    height:  33px  →  38px
    letter-spacing:  normal  →  0.8px

body > main > div > footer > span  "•"
    x:  214  →  258.4  (+44.4px)
    y:  2332.4  →  2230.6  (-101.8px)
    w:  11  →  6.8  (-4.2px)
    display:  inline  →  block
    margin-right:  8px  →  0px
    margin-left:  8px  →  0px
    width:  auto  →  6.8125px
    height:  auto  →  13px
    min-width:  0px  →  auto
    min-height:  0px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    color:  rgb(23, 105, 210)  →  rgb(109, 120, 131)
    letter-spacing:  normal  →  0.8px

body >main >footer  [preview-footer]
    + present in project, absent in reference

body >div
    ✗ present in reference, absent in project


=== /preview/tools/linear-gradient-png  (vs gradient.html)  —  104 differences ===

body
    h:  1373  →  900  (-473px)
    height:  1372.95px  →  900px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main  [preview-root]
    h:  1373  →  900  (-473px)
    height:  1372.95px  →  900px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header  [topbar]
    position:  static  →  sticky
    top:  auto  →  0px
    z-index:  auto  →  20
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > a  [brand]
    w:  224.8  →  239.6  (+14.8px)
    width:  224.766px  →  239.609px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > a > span:nth-of-type(1)  [brand-mark]  "EP"
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(255, 255, 255)

body > main > header > a > span:nth-of-type(2)  "easy-png-tools"
    w:  107.8  →  117.6  (+9.8px)
    width:  107.766px  →  117.609px
    height:  17px  →  18px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > a > span:nth-of-type(3)  [version]  "/ GRADIENT"
    x:  215.4  →  225.2  (+9.8px)
    w:  67  →  72  (+5px)
    width:  67px  →  72px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)

body > main > header > div  [top-actions]
    x:  1123.4  →  1111.4  (-12px)
    w:  259  →  271  (+12px)
    width:  259.031px  →  271.016px
    height:  29px  →  28px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > div > span  [status]  "LIVE PREVIEW"
    x:  1123.4  →  1111.4  (-12px)
    w:  88.6  →  96.6  (+8px)
    width:  88.5781px  →  96.6094px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > header > div > span > i  [status-dot]
    x:  1123.4  →  1111.4  (-12px)
    w:  6  →  8  (+2px)
    h:  6  →  8  (+2px)
    width:  6px  →  8px
    height:  6px  →  8px
    box-shadow:  none  →  color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > header > div > button:nth-of-type(1)  [icon-btn icon-btn--bare]
    x:  1228  →  1224  (-4px)
    display:  grid  →  flex
    justify-content:  normal  →  center
    grid-template-columns:  17px  →  none
    grid-template-rows:  17px  →  none
    width:  29px  →  28px
    height:  29px  →  28px
    background-position:  0px 0px  →  0% 0%
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > header > div > button:nth-of-type(1) > svg  [lucide lucide-circle-question-mark lucide-icon]
    x:  1234  →  1230  (-4px)
    width:  17px  →  16px
    height:  17px  →  16px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > header > div > button:nth-of-type(2)  [icon-btn icon-btn--bare]
    x:  1273  →  1268  (-5px)
    display:  grid  →  flex
    justify-content:  normal  →  center
    grid-template-columns:  17px  →  none
    grid-template-rows:  17px  →  none
    width:  29px  →  28px
    height:  29px  →  28px
    background-position:  0px 0px  →  0% 0%
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > header > div > button:nth-of-type(2) > svg  [lucide lucide-icon lucide-moon]
    x:  1279  →  1274  (-5px)
    width:  17px  →  16px
    height:  17px  →  16px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > header > div > div  [lang]
    x:  1318  →  1312  (-6px)
    w:  64.5  →  70.4  (+5.9px)
    align-items:  center  →  normal
    width:  64.4531px  →  70.4062px
    height:  26px  →  27px
    overflow:  visible  →  hidden
    border-radius:  0px  →  4px

body > main > header > div > div > span  [lang-div]  "/"
    x:  1348  →  1344.2  (-3.8px)
    y:  19.5  →  25  (+5.5px)
    w:  4.5  →  6  (+1.5px)
    h:  24  →  13  (-11px)
    align-self:  auto  →  center
    width:  4.45312px  →  6px
    height:  24px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    color:  rgb(23, 33, 43)  →  rgb(109, 120, 131)
    font-family:  "IBM Plex Sans", sans-serif  →  "IBM Plex Mono", monospace
    font-size:  16px  →  10px
    line-height:  24px  →  normal

body > main > header > div > div > button:nth-of-type(2)  [lang-btn]  "EN"
    x:  1352.4  →  1350.2  (-2.2px)
    w:  29  →  31.2  (+2.2px)
    width:  29px  →  31.2031px
    height:  24px  →  25px
    background-position:  0px 0px  →  0% 0%
    letter-spacing:  normal  →  0.6px

body > main > header > div > div > button:nth-of-type(1)  [active lang-btn]  "RU"
    x:  1319  →  1313  (-6px)
    w:  29  →  31.2  (+2.2px)
    width:  29px  →  31.2031px
    height:  24px  →  25px
    letter-spacing:  normal  →  0.6px

body > main > header > nav  [nav]
    x:  798.4  →  528  (-270.4px)
    y:  25.5  →  24  (-1.5px)
    w:  296.9  →  376.6  (+79.7px)
    h:  12  →  15  (+3px)
    row-gap:  22px  →  18px
    column-gap:  22px  →  18px
    margin-right:  28px  →  0px
    margin-left:  516.078px  →  24px
    width:  296.938px  →  376.594px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > nav > a:nth-of-type(1)  "Workspace"
    x:  798.4  →  528  (-270.4px)
    y:  25.5  →  24  (-1.5px)
    w:  49.5  →  69.1  (+19.6px)
    h:  12  →  15  (+3px)
    width:  49.4844px  →  69.125px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > header > nav > a:nth-of-type(2)  "Catalog"
    x:  869.9  →  615.1  (-254.8px)
    y:  25.5  →  24  (-1.5px)
    w:  38.5  →  53.8  (+15.3px)
    h:  12  →  15  (+3px)
    width:  38.5px  →  53.7656px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > header > nav > a:nth-of-type(3)  "Gradient"
    x:  930.4  →  686.9  (-243.5px)
    y:  25.5  →  24  (-1.5px)
    w:  44  →  61.5  (+17.5px)
    h:  12  →  15  (+3px)
    width:  43.9844px  →  61.4531px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    color:  rgb(23, 105, 210)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > header > nav > a:nth-of-type(4)  "Background remover"
    x:  996.4  →  766.3  (-230.1px)
    y:  25.5  →  24  (-1.5px)
    w:  99  →  138.3  (+39.3px)
    h:  12  →  15  (+3px)
    width:  98.9688px  →  138.25px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > div  [tool-page]
    h:  1264  →  657.9  (-606.1px)
    padding-top:  60px  →  0px
    padding-right:  57.6px  →  0px
    padding-bottom:  72px  →  0px
    padding-left:  57.6px  →  0px
    height:  1263.95px  →  657.875px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(1)  [eyebrow]  "PNG PROCESSING SINGLE TOOL"
    x:  57.6  →  0  (-57.6px)
    y:  124  →  64  (-60px)
    w:  1324.8  →  1440  (+115.2px)
    h:  12  →  24  (+12px)
    margin-bottom:  18px  →  0px
    width:  1324.81px  →  1440px
    height:  12px  →  24px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1.2px  →  normal

body > main > div > div:nth-of-type(1) > span  "/"
    x:  165.1  →  137.3  (-27.8px)
    y:  124  →  66  (-58px)
    w:  13.4  →  6.1  (-7.3px)
    h:  12  →  20  (+8px)
    margin-right:  7px  →  0px
    margin-left:  7px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1.2px  →  normal

body > main > div > div:nth-of-type(2)  [tool-title]
    x:  57.6  →  0  (-57.6px)
    y:  154  →  109.4  (-44.6px)
    w:  1324.8  →  1440  (+115.2px)
    h:  122.8  →  133.4  (+10.6px)
    display:  flex  →  block
    justify-content:  space-between  →  normal
    align-items:  end  →  normal
    row-gap:  32px  →  normal
    column-gap:  32px  →  normal
    margin-bottom:  48px  →  0px
    width:  1324.81px  →  1440px
    height:  122.781px  →  133.438px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(2) > div
    x:  57.6  →  0  (-57.6px)
    y:  154  →  109.4  (-44.6px)
    w:  550  →  1440  (+890px)
    h:  122.8  →  93.4  (-29.4px)
    width:  550px  →  1440px
    height:  122.781px  →  93.4375px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(2) > div > h1  "Gradient background."
    x:  57.6  →  0  (-57.6px)
    y:  154  →  109.4  (-44.6px)
    w:  550  →  1440  (+890px)
    h:  57.6  →  48  (-9.6px)
    margin-top:  0px  →  21.44px
    margin-bottom:  14px  →  21.44px
    width:  550px  →  1440px
    height:  57.5938px  →  48px
    max-width:  700px  →  none
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-size:  57.6px  →  32px
    font-weight:  650  →  700
    line-height:  57.6px  →  48px
    letter-spacing:  -3.456px  →  normal

body > main > div > div:nth-of-type(2) > div > p  [lede]  "Create a clean, export-ready gradient wi"
    x:  57.6  →  0  (-57.6px)
    y:  225.6  →  178.9  (-46.7px)
    w:  550  →  1440  (+890px)
    h:  51.2  →  24  (-27.2px)
    margin-top:  0px  →  16px
    margin-bottom:  0px  →  16px
    width:  550px  →  1440px
    height:  51.1875px  →  24px
    max-width:  550px  →  none
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    line-height:  25.6px  →  24px

body > main > div > div:nth-of-type(2) > span  [tool-status]  "LIVE PREVIEW"
    x:  1302.4  →  0  (-1302.4px)
    y:  264.8  →  220.9  (-43.9px)
    w:  80  →  106.1  (+26.1px)
    h:  12  →  20  (+8px)
    display:  flex  →  inline
    align-items:  center  →  normal
    row-gap:  8px  →  normal
    column-gap:  8px  →  normal
    width:  79.9844px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(37, 169, 106)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    white-space:  nowrap  →  normal

body > main > div > div:nth-of-type(2) > span > i
    x:  1302.4  →  0  (-1302.4px)
    y:  267.8  →  220.9  (-46.9px)
    w:  6  →  0  (-6px)
    h:  6  →  20  (+14px)
    display:  block  →  inline
    width:  6px  →  auto
    height:  6px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    border-radius:  50%  →  0px
    background-color:  rgb(37, 169, 106)  →  rgba(0, 0, 0, 0)
    color:  rgb(37, 169, 106)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    white-space:  nowrap  →  normal

body > main > div > div:nth-of-type(3)  [gradient-layout]
    x:  57.6  →  0  (-57.6px)
    y:  324.8  →  242.9  (-81.9px)
    w:  1324.8  →  1440  (+115.2px)
    h:  931.2  →  479  (-452.2px)
    display:  grid  →  block
    align-items:  start  →  normal
    row-gap:  56px  →  normal
    column-gap:  56px  →  normal
    grid-template-columns:  444.078px 824.734px  →  none
    grid-template-rows:  931.172px  →  none
    width:  1324.81px  →  1440px
    height:  931.172px  →  479px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1)  [settings-panel]
    x:  57.6  →  0  (-57.6px)
    y:  324.8  →  242.9  (-81.9px)
    w:  444.1  →  1440  (+995.9px)
    h:  635  →  293  (-342px)
    width:  444.078px  →  1440px
    height:  635px  →  293px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    background-color:  rgb(248, 250, 251)  →  rgba(0, 0, 0, 0)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(1)  [panel-heading]
    x:  58.6  →  0  (-58.6px)
    y:  325.8  →  242.9  (-82.9px)
    w:  442.1  →  1440  (+997.9px)
    h:  83  →  48  (-35px)
    display:  flex  →  block
    justify-content:  space-between  →  normal
    align-items:  center  →  normal
    padding-top:  18px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  18px  →  0px
    padding-left:  20px  →  0px
    width:  442.078px  →  1440px
    height:  83px  →  48px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(1) > div
    x:  78.6  →  0  (-78.6px)
    y:  343.8  →  242.9  (-100.9px)
    w:  123.2  →  1440  (+1316.8px)
    h:  46  →  24  (-22px)
    width:  123.156px  →  1440px
    height:  46px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(1) > div > span  [label]  "GRADIENT SETTINGS"
    x:  78.6  →  0  (-78.6px)
    y:  351.8  →  244.9  (-106.9px)
    w:  113.9  →  157.6  (+43.7px)
    h:  12  →  20  (+8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1.2px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(1) > div > strong  "Configure output"
    x:  78.6  →  161.4  (+82.8px)
    y:  372.8  →  244.9  (-127.9px)
    w:  123.2  →  126.9  (+3.7px)
    h:  17  →  20  (+3px)
    display:  block  →  inline
    margin-top:  5px  →  0px
    width:  123.156px  →  auto
    height:  17px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  14px  →  16px
    font-weight:  600  →  700
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(1) > span  [step-type]  "TOOL 01"
    x:  433.8  →  0  (-433.8px)
    y:  360.8  →  268.9  (-91.9px)
    w:  46.9  →  62.5  (+15.6px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  46.8906px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1.2px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2)  [setting-group]
    x:  58.6  →  0  (-58.6px)
    y:  408.8  →  290.9  (-117.9px)
    w:  442.1  →  1440  (+997.9px)
    h:  101  →  49  (-52px)
    padding-top:  22px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  22px  →  0px
    padding-left:  20px  →  0px
    width:  442.078px  →  1440px
    height:  101px  →  49px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > label  "GRADIENT TYPE"
    x:  78.6  →  0  (-78.6px)
    y:  430.8  →  292.9  (-137.9px)
    w:  402.1  →  120.1  (-282px)
    h:  12  →  20  (+8px)
    display:  flex  →  inline
    justify-content:  space-between  →  normal
    margin-bottom:  12px  →  0px
    width:  402.078px  →  auto
    height:  12px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > div  [segmented wide]
    x:  78.6  →  0  (-78.6px)
    y:  454.8  →  314.9  (-139.9px)
    w:  402.1  →  1440  (+1037.9px)
    h:  32  →  25  (-7px)
    display:  flex  →  block
    width:  402.078px  →  1440px
    height:  32px  →  25px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > div > button:nth-of-type(1)  [selected]  "Linear"
    x:  79.6  →  0  (-79.6px)
    y:  455.8  →  315.9  (-139.9px)
    w:  200  →  52.9  (-147.1px)
    h:  30  →  24  (-6px)
    display:  block  →  inline-block
    padding-top:  0px  →  1px
    padding-right:  0px  →  6px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  6px
    width:  200.031px  →  52.9219px
    height:  30px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  0px  →  2px
    border-top-style:  none  →  outset
    border-top-color:  rgb(255, 255, 255)  →  rgb(0, 0, 0)
    background-color:  rgb(23, 105, 210)  →  rgb(240, 240, 240)
    color:  rgb(255, 255, 255)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > div > button:nth-of-type(2)  "Radial"
    x:  279.6  →  52.9  (-226.7px)
    y:  455.8  →  315.9  (-139.9px)
    w:  200  →  53.3  (-146.7px)
    h:  30  →  24  (-6px)
    display:  block  →  inline-block
    padding-top:  0px  →  1px
    padding-right:  0px  →  6px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  6px
    width:  200.047px  →  53.3281px
    height:  30px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  0px  →  2px
    border-top-style:  none  →  outset
    border-top-color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(240, 240, 240)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3)  [setting-group]
    x:  58.6  →  0  (-58.6px)
    y:  509.8  →  339.9  (-169.9px)
    w:  442.1  →  1440  (+997.9px)
    h:  129  →  98  (-31px)
    padding-top:  22px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  22px  →  0px
    padding-left:  20px  →  0px
    width:  442.078px  →  1440px
    height:  129px  →  98px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > label  "COLOR STOPS"
    x:  78.6  →  0  (-78.6px)
    y:  531.8  →  341.9  (-189.9px)
    w:  402.1  →  102.2  (-299.9px)
    h:  12  →  20  (+8px)
    display:  flex  →  inline
    justify-content:  space-between  →  normal
    margin-bottom:  12px  →  0px
    width:  402.078px  →  auto
    height:  12px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1)  [color-row]
    x:  78.6  →  0  (-78.6px)
    y:  555.8  →  363.9  (-191.9px)
    w:  402.1  →  1440  (+1037.9px)
    h:  32  →  74  (+42px)
    display:  flex  →  block
    align-items:  center  →  normal
    row-gap:  10px  →  normal
    column-gap:  10px  →  normal
    width:  402.078px  →  1440px
    height:  32px  →  74px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1)  [color-field]
    x:  78.6  →  0  (-78.6px)
    y:  555.8  →  363.9  (-191.9px)
    w:  183  →  1440  (+1257px)
    h:  32  →  25  (-7px)
    display:  flex  →  block
    align-items:  center  →  normal
    row-gap:  8px  →  normal
    column-gap:  8px  →  normal
    padding-right:  8px  →  0px
    padding-left:  8px  →  0px
    width:  183.031px  →  1440px
    height:  32px  →  25px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > span  [swatch]
    x:  87.6  →  0  (-87.6px)
    y:  564.8  →  365.9  (-198.9px)
    w:  14  →  0  (-14px)
    h:  14  →  20  (+6px)
    display:  block  →  inline
    width:  14px  →  auto
    height:  14px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(1) > input
    x:  109.6  →  0  (-109.6px)
    y:  565.3  →  364.9  (-200.4px)
    w:  143  →  157  (+14px)
    h:  13  →  24  (+11px)
    display:  block  →  inline-block
    padding-top:  0px  →  1px
    padding-right:  0px  →  2px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  2px
    width:  143.031px  →  157px
    height:  13px  →  24px
    min-height:  auto  →  0px
    border-top-width:  0px  →  2px
    border-top-style:  none  →  inset
    border-top-color:  rgb(23, 33, 43)  →  rgb(118, 118, 118)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(255, 255, 255)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(23, 33, 43)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1) > span  [stop-arrow]  "→"
    x:  271.6  →  0  (-271.6px)
    y:  559.8  →  390.9  (-168.9px)
    h:  24  →  20  (-4px)
    display:  block  →  inline
    width:  16px  →  auto
    height:  24px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2)  [color-field]
    x:  297.6  →  0  (-297.6px)
    y:  555.8  →  412.9  (-142.9px)
    w:  183  →  1440  (+1257px)
    h:  32  →  25  (-7px)
    display:  flex  →  block
    align-items:  center  →  normal
    row-gap:  8px  →  normal
    column-gap:  8px  →  normal
    padding-right:  8px  →  0px
    padding-left:  8px  →  0px
    width:  183.047px  →  1440px
    height:  32px  →  25px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > span  [swatch]
    x:  306.6  →  0  (-306.6px)
    y:  564.8  →  414.9  (-149.9px)
    w:  14  →  0  (-14px)
    h:  14  →  20  (+6px)
    display:  block  →  inline
    width:  14px  →  auto
    height:  14px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(1) > div:nth-of-type(2) > input
    x:  328.6  →  0  (-328.6px)
    y:  565.3  →  413.9  (-151.4px)
    w:  143  →  157  (+14px)
    h:  13  →  24  (+11px)
    display:  block  →  inline-block
    padding-top:  0px  →  1px
    padding-right:  0px  →  2px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  2px
    width:  143.047px  →  157px
    height:  13px  →  24px
    min-height:  auto  →  0px
    border-top-width:  0px  →  2px
    border-top-style:  none  →  inset
    border-top-color:  rgb(23, 33, 43)  →  rgb(118, 118, 118)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(255, 255, 255)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(23, 33, 43)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > div:nth-of-type(2)  [gradient-bar]
    x:  78.6  →  0  (-78.6px)
    y:  601.8  →  437.9  (-163.9px)
    w:  402.1  →  1440  (+1037.9px)
    h:  14  →  0  (-14px)
    margin-top:  14px  →  0px
    width:  402.078px  →  1440px
    height:  14px  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4)  [setting-group]
    x:  58.6  →  0  (-58.6px)
    y:  638.8  →  437.9  (-200.9px)
    w:  442.1  →  1440  (+997.9px)
    h:  177  →  49  (-128px)
    padding-top:  22px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  22px  →  0px
    padding-left:  20px  →  0px
    width:  442.078px  →  1440px
    height:  177px  →  49px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > label  "DIRECTION"
    x:  78.6  →  0  (-78.6px)
    y:  660.8  →  439.9  (-220.9px)
    w:  402.1  →  128.6  (-273.5px)
    h:  12  →  20  (+8px)
    display:  flex  →  inline
    justify-content:  space-between  →  normal
    margin-bottom:  12px  →  0px
    width:  402.078px  →  auto
    height:  12px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > label > output  "135 °"
    x:  448.2  →  88.5  (-359.7px)
    y:  660.8  →  439.9  (-220.9px)
    w:  32.5  →  40.1  (+7.6px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  32.5px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > input
    x:  78.6  →  134.4  (+55.8px)
    y:  685.8  →  439.9  (-245.9px)
    margin-top:  0px  →  2px
    margin-right:  0px  →  2px
    margin-bottom:  0px  →  2px
    margin-left:  0px  →  2px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(16, 16, 16)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(255, 255, 255)
    color:  rgb(23, 33, 43)  →  rgb(16, 16, 16)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > div  [direction-grid]
    x:  78.6  →  0  (-78.6px)
    y:  722.8  →  461.9  (-260.9px)
    w:  402.1  →  1440  (+1037.9px)
    h:  70  →  25  (-45px)
    display:  grid  →  block
    row-gap:  6px  →  normal
    column-gap:  6px  →  normal
    grid-template-columns:  96.0156px 96.0156px 96.0156px 96.0312px  →  none
    grid-template-rows:  32px 32px  →  none
    margin-top:  14px  →  0px
    width:  402.078px  →  1440px
    height:  70px  →  25px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > div > button:nth-of-type(1)  "0° →"
    x:  78.6  →  0  (-78.6px)
    y:  722.8  →  462.9  (-259.9px)
    w:  96  →  46.7  (-49.3px)
    h:  32  →  24  (-8px)
    display:  block  →  inline-block
    padding-top:  8px  →  1px
    padding-bottom:  8px  →  1px
    width:  96.0156px  →  46.7188px
    height:  32px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  2px
    border-top-style:  solid  →  outset
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(240, 240, 240)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > div > button:nth-of-type(2)  "45° ↗"
    x:  180.6  →  46.7  (-133.9px)
    y:  722.8  →  462.9  (-259.9px)
    w:  96  →  51.1  (-44.9px)
    h:  32  →  24  (-8px)
    display:  block  →  inline-block
    padding-top:  8px  →  1px
    padding-bottom:  8px  →  1px
    width:  96.0156px  →  51.1406px
    height:  32px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  2px
    border-top-style:  solid  →  outset
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(240, 240, 240)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > div > button:nth-of-type(3)  "90° ↑"
    x:  282.6  →  97.9  (-184.7px)
    y:  722.8  →  462.9  (-259.9px)
    w:  96  →  52.3  (-43.7px)
    h:  32  →  24  (-8px)
    display:  block  →  inline-block
    padding-top:  8px  →  1px
    padding-bottom:  8px  →  1px
    width:  96.0156px  →  52.3125px
    height:  32px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  2px
    border-top-style:  solid  →  outset
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(240, 240, 240)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > div > button:nth-of-type(4)  [selected]  "135° ↖"
    x:  384.6  →  150.2  (-234.4px)
    y:  722.8  →  462.9  (-259.9px)
    w:  96  →  59.2  (-36.8px)
    h:  32  →  24  (-8px)
    display:  block  →  inline-block
    padding-top:  8px  →  1px
    padding-bottom:  8px  →  1px
    width:  96.0312px  →  59.1562px
    height:  32px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  2px
    border-top-style:  solid  →  outset
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    background-color:  rgb(23, 33, 43)  →  rgb(240, 240, 240)
    color:  rgb(238, 241, 244)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > div > button:nth-of-type(5)  "180° ←"
    x:  78.6  →  209.3  (+130.7px)
    y:  760.8  →  462.9  (-297.9px)
    w:  96  →  62.7  (-33.3px)
    h:  32  →  24  (-8px)
    display:  block  →  inline-block
    padding-top:  8px  →  1px
    padding-bottom:  8px  →  1px
    width:  96.0156px  →  62.7188px
    height:  32px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  2px
    border-top-style:  solid  →  outset
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(240, 240, 240)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > div > button:nth-of-type(6)  "225° ↙"
    x:  180.6  →  272  (+91.4px)
    y:  760.8  →  462.9  (-297.9px)
    w:  96  →  59.2  (-36.8px)
    h:  32  →  24  (-8px)
    display:  block  →  inline-block
    padding-top:  8px  →  1px
    padding-bottom:  8px  →  1px
    width:  96.0156px  →  59.1562px
    height:  32px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  2px
    border-top-style:  solid  →  outset
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(240, 240, 240)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > div > button:nth-of-type(7)  "270° ↓"
    x:  282.6  →  331.2  (+48.6px)
    y:  760.8  →  462.9  (-297.9px)
    w:  96  →  60.3  (-35.7px)
    h:  32  →  24  (-8px)
    display:  block  →  inline-block
    padding-top:  8px  →  1px
    padding-bottom:  8px  →  1px
    width:  96.0156px  →  60.3125px
    height:  32px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  2px
    border-top-style:  solid  →  outset
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(240, 240, 240)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > div > button:nth-of-type(8)  "315° ↘"
    x:  384.6  →  391.5  (+6.9px)
    y:  760.8  →  462.9  (-297.9px)
    w:  96  →  59.2  (-36.8px)
    h:  32  →  24  (-8px)
    display:  block  →  inline-block
    padding-top:  8px  →  1px
    padding-bottom:  8px  →  1px
    width:  96.0312px  →  59.1562px
    height:  32px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  2px
    border-top-style:  solid  →  outset
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(240, 240, 240)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(5)  [setting-group]
    x:  58.6  →  0  (-58.6px)
    y:  815.8  →  486.9  (-328.9px)
    w:  442.1  →  1440  (+997.9px)
    h:  93  →  24  (-69px)
    padding-top:  22px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  22px  →  0px
    padding-left:  20px  →  0px
    width:  442.078px  →  1440px
    height:  93px  →  24px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(5) > label  "OPACITY"
    x:  78.6  →  0  (-78.6px)
    y:  837.8  →  488.9  (-348.9px)
    w:  402.1  →  116.5  (-285.6px)
    h:  12  →  20  (+8px)
    display:  flex  →  inline
    justify-content:  space-between  →  normal
    margin-bottom:  12px  →  0px
    width:  402.078px  →  auto
    height:  12px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(5) > label > output  "100 %"
    x:  448.2  →  69  (-379.2px)
    y:  837.8  →  488.9  (-348.9px)
    w:  32.5  →  47.4  (+14.9px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  32.5px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(5) > input
    x:  78.6  →  122.3  (+43.7px)
    y:  862.8  →  488.9  (-373.9px)
    margin-top:  0px  →  2px
    margin-right:  0px  →  2px
    margin-bottom:  0px  →  2px
    margin-left:  0px  →  2px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(16, 16, 16)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(255, 255, 255)
    color:  rgb(23, 33, 43)  →  rgb(16, 16, 16)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(6)  [settings-footer]
    x:  58.6  →  0  (-58.6px)
    y:  908.8  →  510.9  (-397.9px)
    w:  442.1  →  1440  (+997.9px)
    h:  50  →  25  (-25px)
    display:  flex  →  block
    justify-content:  space-between  →  normal
    align-items:  center  →  normal
    padding-top:  16px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  16px  →  0px
    padding-left:  20px  →  0px
    width:  442.078px  →  1440px
    height:  50px  →  25px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(6) > button  [reset-btn]  "Reset"
    x:  78.6  →  0  (-78.6px)
    y:  924.8  →  511.9  (-412.9px)
    w:  52.4  →  67.3  (+14.9px)
    h:  18  →  24  (+6px)
    display:  flex  →  inline-block
    align-items:  center  →  normal
    row-gap:  7px  →  normal
    column-gap:  7px  →  normal
    padding-top:  0px  →  1px
    padding-right:  0px  →  6px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  6px
    width:  52.3594px  →  67.2969px
    height:  18px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  0px  →  2px
    border-top-style:  none  →  outset
    border-top-color:  rgb(23, 105, 210)  →  rgb(0, 0, 0)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(240, 240, 240)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(23, 105, 210)  →  rgb(0, 0, 0)
    font-size:  12px  →  13.3333px
    line-height:  18px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(6) > button > svg  [lucide lucide-icon lucide-rotate-ccw]
    x:  78.6  →  8  (-70.6px)
    y:  926.8  →  514.9  (-411.9px)
    display:  block  →  inline
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    color:  rgb(23, 105, 210)  →  rgb(0, 0, 0)
    font-size:  12px  →  13.3333px
    line-height:  18px  →  normal
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(6) > span  [auto-note]  "updates automatically"
    x:  339.7  →  71.1  (-268.6px)
    y:  927.3  →  512.9  (-414.4px)
    w:  141  →  159.4  (+18.4px)
    h:  13  →  20  (+7px)
    display:  flex  →  inline
    align-items:  center  →  normal
    row-gap:  8px  →  normal
    column-gap:  8px  →  normal
    width:  141.016px  →  auto
    height:  13px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(6) > span > i
    x:  339.7  →  71.1  (-268.6px)
    y:  930.8  →  512.9  (-417.9px)
    w:  6  →  0  (-6px)
    h:  6  →  20  (+14px)
    display:  block  →  inline
    width:  6px  →  auto
    height:  6px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    border-radius:  50%  →  0px
    background-color:  rgb(37, 169, 106)  →  rgba(0, 0, 0, 0)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2)  [gradient-preview]
    x:  557.7  →  0  (-557.7px)
    y:  324.8  →  535.9  (+211.1px)
    w:  824.7  →  1440  (+615.3px)
    h:  931.2  →  186  (-745.2px)
    width:  824.734px  →  1440px
    height:  931.172px  →  186px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    background-color:  rgb(248, 250, 251)  →  rgba(0, 0, 0, 0)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1)  [preview-toolbar]
    x:  558.7  →  0  (-558.7px)
    y:  325.8  →  535.9  (+210.1px)
    w:  822.7  →  1440  (+617.3px)
    h:  140  →  49  (-91px)
    display:  flex  →  block
    justify-content:  space-between  →  normal
    align-items:  center  →  normal
    padding-top:  18px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  18px  →  0px
    padding-left:  20px  →  0px
    width:  822.734px  →  1440px
    height:  140px  →  49px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1)
    x:  578.7  →  0  (-578.7px)
    y:  372.3  →  535.9  (+163.6px)
    w:  93.8  →  1440  (+1346.2px)
    h:  46  →  24  (-22px)
    width:  93.7812px  →  1440px
    height:  46px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > span  [label]  "OUTPUT PREVIEW"
    x:  578.7  →  0  (-578.7px)
    y:  380.3  →  537.9  (+157.6px)
    w:  93.8  →  133.6  (+39.8px)
    h:  12  →  20  (+8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1.2px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > strong  "gradient.png"
    x:  578.7  →  137.4  (-441.3px)
    y:  401.3  →  537.9  (+136.6px)
    w:  93.8  →  96.2  (+2.4px)
    h:  17  →  20  (+3px)
    display:  block  →  inline
    margin-top:  5px  →  0px
    width:  93.7812px  →  auto
    height:  17px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  14px  →  16px
    font-weight:  600  →  700
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2)  [preview-actions]
    x:  1150.8  →  0  (-1150.8px)
    y:  343.8  →  559.9  (+216.1px)
    w:  210.6  →  1440  (+1229.4px)
    h:  103  →  25  (-78px)
    display:  flex  →  block
    flex-wrap:  wrap  →  nowrap
    justify-content:  flex-end  →  normal
    align-items:  center  →  normal
    row-gap:  10px  →  normal
    column-gap:  10px  →  normal
    width:  210.562px  →  1440px
    height:  103px  →  25px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button:nth-of-type(1)  [secondary-btn]  "Copy CSS"
    x:  1280.4  →  0  (-1280.4px)
    y:  343.8  →  559.9  (+216.1px)
    w:  81  →  91  (+10px)
    h:  33  →  25  (-8px)
    display:  flex  →  inline-block
    align-items:  center  →  normal
    row-gap:  8px  →  normal
    column-gap:  8px  →  normal
    padding-top:  8px  →  1px
    padding-bottom:  8px  →  1px
    width:  80.9844px  →  91px
    height:  33px  →  25px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  2px
    border-top-style:  solid  →  outset
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(240, 240, 240)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button:nth-of-type(1) > svg  [lucide lucide-copy lucide-icon]
    x:  1287.4  →  8  (-1279.4px)
    y:  352.8  →  562.9  (+210.1px)
    display:  block  →  inline
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  13.3333px
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button:nth-of-type(2)  [download-btn]  "Download PNG"
    x:  1150.8  →  94.8  (-1056px)
    y:  404.8  →  559.9  (+155.1px)
    w:  210.6  →  141.3  (-69.3px)
    h:  42  →  25  (-17px)
    display:  flex  →  inline-block
    justify-content:  center  →  normal
    align-items:  center  →  normal
    row-gap:  9px  →  normal
    column-gap:  9px  →  normal
    margin-top:  18px  →  0px
    padding-top:  0px  →  1px
    padding-right:  0px  →  6px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  6px
    width:  210.562px  →  141.297px
    height:  42px  →  25px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  0px  →  2px
    border-top-style:  none  →  outset
    border-top-color:  rgb(255, 255, 255)  →  rgb(0, 0, 0)
    background-color:  rgb(23, 105, 210)  →  rgb(240, 240, 240)
    color:  rgb(255, 255, 255)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  13.3333px
    white-space:  nowrap  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button:nth-of-type(2) > svg:nth-of-type(1)  [lucide lucide-download lucide-icon]
    x:  1196.3  →  102.8  (-1093.5px)
    y:  418.3  →  562.9  (+144.6px)
    display:  block  →  inline
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    color:  rgb(255, 255, 255)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  13.3333px
    white-space:  nowrap  →  normal
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button:nth-of-type(2) > svg:nth-of-type(2)  [lucide lucide-chevron-down lucide-icon]
    x:  1301.9  →  214.1  (-1087.8px)
    y:  418.8  →  563.9  (+145.1px)
    display:  block  →  inline
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    color:  rgb(255, 255, 255)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  13.3333px
    white-space:  nowrap  →  normal
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2)  [large-canvas]
    x:  558.7  →  0  (-558.7px)
    y:  465.8  →  584.9  (+119.1px)
    w:  822.7  →  1440  (+617.3px)
    h:  652.8  →  48  (-604.8px)
    padding-top:  24px  →  0px
    padding-right:  24px  →  0px
    padding-bottom:  24px  →  0px
    padding-left:  24px  →  0px
    width:  822.734px  →  1440px
    height:  652.797px  →  48px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    background-color:  rgb(32, 42, 49)  →  rgba(0, 0, 0, 0)
    background-image:  linear-gradient(45deg, rgb(41, 52, 60) 25%, rgba(0, 0, 0, 0) 25%), linear-gradient(-45deg, rgb(41, 52, 60) 25%, rgba(0, 0, 0, 0) 25%), linear-gradient(45deg, rgba(0, 0, 0, 0) 75%, rgb(41, 52, 60) 75%), linear-gradient(-45deg, rgba(0, 0, 0, 0) 75%, rgb(41, 52, 60) 75%)  →  none
    background-size:  28px 28px, 28px 28px, 28px 28px, 28px 28px  →  auto
    background-position:  0px 0px, 0px 14px, 14px -14px, -14px 0px  →  0% 0%

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div  [gradient-art]
    x:  582.7  →  0  (-582.7px)
    y:  489.8  →  584.9  (+95.1px)
    w:  774.7  →  1440  (+665.3px)
    h:  604.8  →  48  (-556.8px)
    display:  grid  →  block
    justify-content:  center  →  normal
    grid-template-columns:  92.375px  →  none
    grid-template-rows:  82px 14px  →  none
    width:  774.734px  →  1440px
    height:  604.797px  →  48px
    min-height:  604.8px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(255, 255, 255)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  12px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div > div  [art-mark]  "PNG"
    x:  935  →  0  (-935px)
    y:  744.2  →  584.9  (-159.3px)
    w:  70  →  1440  (+1370px)
    h:  70  →  24  (-46px)
    display:  grid  →  block
    align-items:  center  →  normal
    grid-template-columns:  68px  →  none
    grid-template-rows:  68px  →  none
    margin-bottom:  12px  →  0px
    width:  70px  →  1440px
    height:  70px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgba(255, 255, 255, 0.65)  →  rgb(23, 33, 43)
    color:  rgb(255, 255, 255)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div > span  "easy-png-tools"
    x:  923.8  →  0  (-923.8px)
    y:  826.2  →  610.9  (-215.3px)
    w:  92.4  →  107.9  (+15.5px)
    h:  14  →  20  (+6px)
    display:  block  →  inline
    width:  92.375px  →  auto
    height:  14px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(255, 255, 255)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  12px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(3)  [code-block]
    x:  558.7  →  0  (-558.7px)
    y:  1118.6  →  632.9  (-485.7px)
    w:  822.7  →  1440  (+617.3px)
    h:  136.4  →  89  (-47.4px)
    padding-top:  16px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  16px  →  0px
    padding-left:  20px  →  0px
    width:  822.734px  →  1440px
    height:  136.375px  →  89px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(3) > div
    x:  578.7  →  0  (-578.7px)
    y:  1134.6  →  632.9  (-501.7px)
    w:  782.7  →  1440  (+657.3px)
    display:  flex  →  block
    justify-content:  space-between  →  normal
    align-items:  center  →  normal
    width:  782.734px  →  1440px
    height:  26px  →  25px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(3) > div > span  [label]  "GENERATED CSS"
    x:  578.7  →  0  (-578.7px)
    y:  1141.6  →  634.9  (-506.7px)
    w:  87.1  →  121.9  (+34.8px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  87.0781px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1.2px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(3) > div > button  [icon-btn]
    x:  1335.4  →  125.7  (-1209.7px)
    y:  1134.6  →  633.9  (-500.7px)
    w:  26  →  30  (+4px)
    h:  26  →  24  (-2px)
    display:  grid  →  inline-block
    align-items:  center  →  normal
    grid-template-columns:  14px  →  none
    grid-template-rows:  14px  →  none
    padding-top:  6px  →  1px
    padding-bottom:  6px  →  1px
    width:  26px  →  30px
    height:  26px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  0px  →  2px
    border-top-style:  none  →  outset
    border-top-color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(240, 240, 240)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(3) > div > button > svg  [lucide lucide-copy lucide-icon]
    x:  1341.4  →  133.7  (-1207.7px)
    y:  1140.6  →  636.9  (-503.7px)
    display:  block  →  inline
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    color:  rgb(109, 120, 131)  →  rgb(0, 0, 0)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(3) > pre  "background: linear-gradient(135deg, #176"
    x:  578.7  →  0  (-578.7px)
    y:  1172.6  →  673.9  (-498.7px)
    w:  782.7  →  1440  (+657.3px)
    h:  66.4  →  48  (-18.4px)
    margin-top:  12px  →  16px
    margin-bottom:  0px  →  16px
    padding-top:  14px  →  0px
    padding-right:  14px  →  0px
    padding-bottom:  14px  →  0px
    padding-left:  14px  →  0px
    width:  782.734px  →  1440px
    height:  66.375px  →  48px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    background-color:  rgb(238, 241, 244)  →  rgba(0, 0, 0, 0)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  monospace
    font-size:  12px  →  16px
    line-height:  19.2px  →  24px
    white-space:  pre-wrap  →  pre

body > main > footer  [preview-footer]
    y:  1328  →  737.9  (-590.1px)
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    height:  45px  →  46px
    letter-spacing:  normal  →  0.8px

body > main > footer > span:nth-of-type(1)  "easy-png-tools"
    y:  1345  →  754.9  (-590.1px)
    w:  117  →  142.8  (+25.8px)
    display:  flex  →  block
    align-items:  center  →  normal
    row-gap:  7px  →  normal
    column-gap:  7px  →  normal
    width:  116.984px  →  142.812px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  normal  →  0.8px

body > main > footer > span:nth-of-type(1) > b  [version]  "v2.4.0"
    x:  141.6  →  159.6  (+18px)
    y:  1345  →  754.9  (-590.1px)
    w:  33  →  40.8  (+7.8px)
    display:  block  →  inline
    width:  33px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    font-weight:  400  →  700
    letter-spacing:  normal  →  0.8px

body > main > footer > span:nth-of-type(2)  "© 2024"
    x:  690.5  →  1341.6  (+651.1px)
    y:  1345  →  754.9  (-590.1px)
    w:  143  →  40.8  (-102.2px)
    display:  flex  →  block
    align-items:  center  →  normal
    row-gap:  7px  →  normal
    column-gap:  7px  →  normal
    width:  142.953px  →  40.8125px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  normal  →  0.8px

body >main >footer >span:nth-of-type(3)  "© 2024"
    ✗ present in reference, absent in project

body >div
    ✗ present in reference, absent in project


=== /preview/tools/remove-background-png  (vs background-remover.html)  —  111 differences ===

body
    h:  1103.8  →  900  (-203.8px)
    height:  1103.78px  →  900px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main  [preview-root]
    h:  1103.8  →  900  (-203.8px)
    height:  1103.78px  →  900px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header  [topbar]
    position:  static  →  sticky
    top:  auto  →  0px
    z-index:  auto  →  20
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > a  [brand]
    w:  291.8  →  311.6  (+19.8px)
    width:  291.75px  →  311.609px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > a > span:nth-of-type(1)  [brand-mark]  "EP"
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(255, 255, 255)

body > main > header > a > span:nth-of-type(2)  "easy-png-tools"
    w:  107.8  →  117.6  (+9.8px)
    width:  107.766px  →  117.609px
    height:  17px  →  18px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > a > span:nth-of-type(3)  [version]  "/ BACKGROUND REMOVER"
    x:  215.4  →  225.2  (+9.8px)
    w:  134  →  144  (+10px)
    width:  133.984px  →  144px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)

body > main > header > div  [top-actions]
    x:  1104.5  →  1091  (-13.5px)
    w:  277.9  →  291.4  (+13.5px)
    width:  277.938px  →  291.406px
    height:  29px  →  28px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > div > span  [status]  "AUTO PROCESSING"
    x:  1104.5  →  1091  (-13.5px)
    w:  107.5  →  117  (+9.5px)
    width:  107.484px  →  117px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > header > div > span > i  [status-dot]
    x:  1104.5  →  1091  (-13.5px)
    w:  6  →  8  (+2px)
    h:  6  →  8  (+2px)
    width:  6px  →  8px
    height:  6px  →  8px
    box-shadow:  none  →  color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)

body > main > header > div > button:nth-of-type(1)  [icon-btn icon-btn--bare]
    x:  1228  →  1224  (-4px)
    display:  grid  →  flex
    justify-content:  normal  →  center
    grid-template-columns:  17px  →  none
    grid-template-rows:  17px  →  none
    width:  29px  →  28px
    height:  29px  →  28px
    background-position:  0px 0px  →  0% 0%
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > header > div > button:nth-of-type(1) > svg  [lucide lucide-circle-question-mark lucide-icon]
    x:  1234  →  1230  (-4px)
    width:  17px  →  16px
    height:  17px  →  16px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > header > div > button:nth-of-type(2)  [icon-btn icon-btn--bare]
    x:  1273  →  1268  (-5px)
    display:  grid  →  flex
    justify-content:  normal  →  center
    grid-template-columns:  17px  →  none
    grid-template-rows:  17px  →  none
    width:  29px  →  28px
    height:  29px  →  28px
    background-position:  0px 0px  →  0% 0%
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > header > div > button:nth-of-type(2) > svg  [lucide lucide-icon lucide-moon]
    x:  1279  →  1274  (-5px)
    width:  17px  →  16px
    height:  17px  →  16px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal
    vertical-align:  middle  →  baseline

body > main > header > div > div  [lang]
    x:  1318  →  1312  (-6px)
    w:  64.5  →  70.4  (+5.9px)
    align-items:  center  →  normal
    width:  64.4531px  →  70.4062px
    height:  26px  →  27px
    overflow:  visible  →  hidden
    border-radius:  0px  →  4px

body > main > header > div > div > span  [lang-div]  "/"
    x:  1348  →  1344.2  (-3.8px)
    y:  19.5  →  25  (+5.5px)
    w:  4.5  →  6  (+1.5px)
    h:  24  →  13  (-11px)
    align-self:  auto  →  center
    width:  4.45312px  →  6px
    height:  24px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    color:  rgb(23, 33, 43)  →  rgb(109, 120, 131)
    font-family:  "IBM Plex Sans", sans-serif  →  "IBM Plex Mono", monospace
    font-size:  16px  →  10px
    line-height:  24px  →  normal

body > main > header > div > div > button:nth-of-type(2)  [lang-btn]  "EN"
    x:  1352.4  →  1350.2  (-2.2px)
    w:  29  →  31.2  (+2.2px)
    width:  29px  →  31.2031px
    height:  24px  →  25px
    background-position:  0px 0px  →  0% 0%
    letter-spacing:  normal  →  0.6px

body > main > header > div > div > button:nth-of-type(1)  [active lang-btn]  "RU"
    x:  1319  →  1313  (-6px)
    w:  29  →  31.2  (+2.2px)
    width:  29px  →  31.2031px
    height:  24px  →  25px
    letter-spacing:  normal  →  0.6px

body > main > header > nav  [nav]
    x:  779.5  →  553.8  (-225.7px)
    y:  25.5  →  24  (-1.5px)
    w:  296.9  →  376.6  (+79.7px)
    h:  12  →  15  (+3px)
    row-gap:  22px  →  18px
    column-gap:  22px  →  18px
    margin-right:  28px  →  0px
    margin-left:  430.188px  →  24px
    width:  296.938px  →  376.594px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > header > nav > a:nth-of-type(1)  "Workspace"
    x:  779.5  →  553.8  (-225.7px)
    y:  25.5  →  24  (-1.5px)
    w:  49.5  →  69.1  (+19.6px)
    h:  12  →  15  (+3px)
    width:  49.4844px  →  69.125px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > header > nav > a:nth-of-type(2)  "Catalog"
    x:  851  →  640.9  (-210.1px)
    y:  25.5  →  24  (-1.5px)
    w:  38.5  →  53.8  (+15.3px)
    h:  12  →  15  (+3px)
    width:  38.5px  →  53.7656px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > header > nav > a:nth-of-type(3)  "Gradient"
    x:  911.5  →  712.7  (-198.8px)
    y:  25.5  →  24  (-1.5px)
    w:  44  →  61.5  (+17.5px)
    h:  12  →  15  (+3px)
    width:  43.9844px  →  61.4531px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > header > nav > a:nth-of-type(4)  "Background remover"
    x:  977.5  →  792.2  (-185.3px)
    y:  25.5  →  24  (-1.5px)
    w:  99  →  138.3  (+39.3px)
    h:  12  →  15  (+3px)
    width:  98.9688px  →  138.25px
    height:  12px  →  15px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    color:  rgb(23, 105, 210)  →  rgb(109, 120, 131)
    font-size:  10px  →  12px
    letter-spacing:  normal  →  0.48px
    white-space:  nowrap  →  normal

body > main > div  [tool-page]
    h:  994.8  →  752.9  (-241.9px)
    padding-top:  60px  →  0px
    padding-right:  57.6px  →  0px
    padding-bottom:  72px  →  0px
    padding-left:  57.6px  →  0px
    height:  994.781px  →  752.875px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(1)  [eyebrow]  "PNG PROCESSING SINGLE TOOL"
    x:  57.6  →  0  (-57.6px)
    y:  124  →  64  (-60px)
    w:  1324.8  →  1440  (+115.2px)
    h:  12  →  24  (+12px)
    margin-bottom:  18px  →  0px
    width:  1324.81px  →  1440px
    height:  12px  →  24px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1.2px  →  normal

body > main > div > div:nth-of-type(1) > span  "/"
    x:  165.1  →  137.3  (-27.8px)
    y:  124  →  66  (-58px)
    w:  13.4  →  6.1  (-7.3px)
    h:  12  →  20  (+8px)
    margin-right:  7px  →  0px
    margin-left:  7px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1.2px  →  normal

body > main > div > div:nth-of-type(2)  [tool-title]
    x:  57.6  →  0  (-57.6px)
    y:  154  →  109.4  (-44.6px)
    w:  1324.8  →  1440  (+115.2px)
    h:  122.8  →  133.4  (+10.6px)
    display:  flex  →  block
    justify-content:  space-between  →  normal
    align-items:  end  →  normal
    row-gap:  32px  →  normal
    column-gap:  32px  →  normal
    margin-bottom:  48px  →  0px
    width:  1324.81px  →  1440px
    height:  122.781px  →  133.438px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(2) > div
    x:  57.6  →  0  (-57.6px)
    y:  154  →  109.4  (-44.6px)
    w:  550  →  1440  (+890px)
    h:  122.8  →  93.4  (-29.4px)
    width:  550px  →  1440px
    height:  122.781px  →  93.4375px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(2) > div > h1  "Remove background."
    x:  57.6  →  0  (-57.6px)
    y:  154  →  109.4  (-44.6px)
    w:  550  →  1440  (+890px)
    h:  57.6  →  48  (-9.6px)
    margin-top:  0px  →  21.44px
    margin-bottom:  14px  →  21.44px
    width:  550px  →  1440px
    height:  57.5938px  →  48px
    max-width:  700px  →  none
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-size:  57.6px  →  32px
    font-weight:  650  →  700
    line-height:  57.6px  →  48px
    letter-spacing:  -3.456px  →  normal

body > main > div > div:nth-of-type(2) > div > p  [lede]  "Select a background color and tune the e"
    x:  57.6  →  0  (-57.6px)
    y:  225.6  →  178.9  (-46.7px)
    w:  550  →  1440  (+890px)
    h:  51.2  →  24  (-27.2px)
    margin-top:  0px  →  16px
    margin-bottom:  0px  →  16px
    width:  550px  →  1440px
    height:  51.1875px  →  24px
    max-width:  550px  →  none
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    line-height:  25.6px  →  24px

body > main > div > div:nth-of-type(2) > span  [tool-status]  "LIVE PREVIEW"
    x:  1302.4  →  0  (-1302.4px)
    y:  264.8  →  220.9  (-43.9px)
    w:  80  →  106.1  (+26.1px)
    h:  12  →  20  (+8px)
    display:  flex  →  inline
    align-items:  center  →  normal
    row-gap:  8px  →  normal
    column-gap:  8px  →  normal
    width:  79.9844px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(37, 169, 106)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    white-space:  nowrap  →  normal

body > main > div > div:nth-of-type(2) > span > i
    x:  1302.4  →  0  (-1302.4px)
    y:  267.8  →  220.9  (-46.9px)
    w:  6  →  0  (-6px)
    h:  6  →  20  (+14px)
    display:  block  →  inline
    width:  6px  →  auto
    height:  6px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    border-radius:  50%  →  0px
    background-color:  rgb(37, 169, 106)  →  rgba(0, 0, 0, 0)
    color:  rgb(37, 169, 106)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    white-space:  nowrap  →  normal

body > main > div > div:nth-of-type(3)  [remover-layout]
    x:  57.6  →  0  (-57.6px)
    y:  324.8  →  242.9  (-81.9px)
    w:  1324.8  →  1440  (+115.2px)
    h:  662  →  574  (-88px)
    display:  grid  →  block
    align-items:  start  →  normal
    row-gap:  56px  →  normal
    column-gap:  56px  →  normal
    grid-template-columns:  393.328px 875.484px  →  none
    grid-template-rows:  662px  →  none
    width:  1324.81px  →  1440px
    height:  662px  →  574px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1)  [settings-panel]
    x:  57.6  →  0  (-57.6px)
    y:  324.8  →  242.9  (-81.9px)
    w:  393.3  →  1440  (+1046.7px)
    h:  559  →  357  (-202px)
    width:  393.328px  →  1440px
    height:  559px  →  357px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    background-color:  rgb(248, 250, 251)  →  rgba(0, 0, 0, 0)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(1)  [panel-heading]
    x:  58.6  →  0  (-58.6px)
    y:  325.8  →  242.9  (-82.9px)
    w:  391.3  →  1440  (+1048.7px)
    h:  83  →  48  (-35px)
    display:  flex  →  block
    justify-content:  space-between  →  normal
    align-items:  center  →  normal
    padding-top:  18px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  18px  →  0px
    padding-left:  20px  →  0px
    width:  391.328px  →  1440px
    height:  83px  →  48px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(1) > div
    x:  78.6  →  0  (-78.6px)
    y:  343.8  →  242.9  (-100.9px)
    w:  146.3  →  1440  (+1293.7px)
    h:  46  →  24  (-22px)
    width:  146.25px  →  1440px
    height:  46px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(1) > div > span  [label]  "REMOVER SETTINGS"
    x:  78.6  →  0  (-78.6px)
    y:  351.8  →  244.9  (-106.9px)
    w:  107.2  →  152.1  (+44.9px)
    h:  12  →  20  (+8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1.2px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(1) > div > strong  "Configure detection"
    x:  78.6  →  155.9  (+77.3px)
    y:  372.8  →  244.9  (-127.9px)
    w:  146.3  →  148.1  (+1.8px)
    h:  17  →  20  (+3px)
    display:  block  →  inline
    margin-top:  5px  →  0px
    width:  146.25px  →  auto
    height:  17px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  14px  →  16px
    font-weight:  600  →  700
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(1) > span  [step-type]  "TOOL 02"
    x:  383  →  0  (-383px)
    y:  360.8  →  268.9  (-91.9px)
    w:  46.9  →  62.5  (+15.6px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  46.8906px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1.2px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2)  [setting-group]
    x:  58.6  →  0  (-58.6px)
    y:  408.8  →  290.9  (-117.9px)
    w:  391.3  →  1440  (+1048.7px)
    h:  123  →  76  (-47px)
    padding-top:  22px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  22px  →  0px
    padding-left:  20px  →  0px
    width:  391.328px  →  1440px
    height:  123px  →  76px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > label  "BACKGROUND COLOR"
    x:  78.6  →  0  (-78.6px)
    y:  430.8  →  292.9  (-137.9px)
    w:  351.3  →  159.4  (-191.9px)
    h:  12  →  20  (+8px)
    display:  flex  →  inline
    justify-content:  space-between  →  normal
    margin-bottom:  12px  →  0px
    width:  351.328px  →  auto
    height:  12px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1)  [color-field]
    x:  78.6  →  0  (-78.6px)
    y:  454.8  →  314.9  (-139.9px)
    w:  351.3  →  1440  (+1088.7px)
    h:  32  →  28  (-4px)
    display:  flex  →  block
    align-items:  center  →  normal
    row-gap:  8px  →  normal
    column-gap:  8px  →  normal
    padding-right:  8px  →  0px
    padding-left:  8px  →  0px
    width:  351.328px  →  1440px
    height:  32px  →  28px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > span  [swatch]
    x:  87.6  →  0  (-87.6px)
    y:  463.8  →  319.9  (-143.9px)
    w:  14  →  0  (-14px)
    h:  14  →  20  (+6px)
    display:  block  →  inline
    width:  14px  →  auto
    height:  14px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > input:nth-of-type(1)
    x:  109.6  →  0  (-109.6px)
    y:  464.3  →  318.9  (-145.4px)
    w:  151.7  →  157  (+5.3px)
    h:  13  →  24  (+11px)
    display:  block  →  inline-block
    padding-top:  0px  →  1px
    padding-right:  0px  →  2px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  2px
    width:  151.656px  →  157px
    height:  13px  →  24px
    min-height:  auto  →  0px
    border-top-width:  0px  →  2px
    border-top-style:  none  →  inset
    border-top-color:  rgb(23, 33, 43)  →  rgb(118, 118, 118)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(255, 255, 255)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(23, 33, 43)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > input:nth-of-type(2)  [native-color]
    x:  269.3  →  160.8  (-108.5px)
    y:  457.3  →  314.9  (-142.4px)
    w:  151.7  →  50  (-101.7px)
    display:  block  →  inline-block
    padding-top:  0px  →  1px
    padding-right:  0px  →  2px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  2px
    width:  151.672px  →  50px
    min-height:  auto  →  0px
    border-top-width:  0px  →  1px
    border-top-style:  none  →  solid
    border-top-color:  rgb(23, 33, 43)  →  rgb(0, 0, 0)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(240, 240, 240)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(23, 33, 43)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  13.3333px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2)  [color-reference]  "sampled from image background"
    x:  78.6  →  0  (-78.6px)
    y:  496.8  →  342.9  (-153.9px)
    w:  351.3  →  1440  (+1088.7px)
    h:  12  →  24  (+12px)
    display:  flex  →  block
    justify-content:  flex-start  →  normal
    row-gap:  8px  →  normal
    column-gap:  8px  →  normal
    margin-top:  10px  →  0px
    width:  351.328px  →  1440px
    height:  12px  →  24px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > span
    x:  78.6  →  0  (-78.6px)
    y:  496.8  →  344.9  (-151.9px)
    w:  9  →  0  (-9px)
    h:  9  →  20  (+11px)
    display:  block  →  inline
    width:  9px  →  auto
    height:  9px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3)  [setting-group]
    x:  58.6  →  0  (-58.6px)
    y:  531.8  →  366.9  (-164.9px)
    w:  391.3  →  1440  (+1048.7px)
    h:  115  →  48  (-67px)
    padding-top:  22px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  22px  →  0px
    padding-left:  20px  →  0px
    width:  391.328px  →  1440px
    height:  115px  →  48px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > label  "COLOR SIMILARITY"
    x:  78.6  →  0  (-78.6px)
    y:  553.8  →  368.9  (-184.9px)
    w:  351.3  →  184.4  (-166.9px)
    h:  12  →  20  (+8px)
    display:  flex  →  inline
    justify-content:  space-between  →  normal
    margin-bottom:  12px  →  0px
    width:  351.328px  →  auto
    height:  12px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > label > output  "72 %"
    x:  403.9  →  146.6  (-257.3px)
    y:  553.8  →  368.9  (-184.9px)
    w:  26  →  37.8  (+11.8px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  26px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > input
    x:  78.6  →  190.2  (+111.6px)
    y:  578.8  →  368.9  (-209.9px)
    margin-top:  0px  →  2px
    margin-right:  0px  →  2px
    margin-bottom:  0px  →  2px
    margin-left:  0px  →  2px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(16, 16, 16)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(255, 255, 255)
    color:  rgb(23, 33, 43)  →  rgb(16, 16, 16)
    font-size:  16px  →  13.3333px
    line-height:  24px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > div  [range-hints]
    x:  78.6  →  0  (-78.6px)
    y:  611.8  →  390.9  (-220.9px)
    w:  351.3  →  1440  (+1088.7px)
    h:  12  →  24  (+12px)
    display:  flex  →  block
    justify-content:  space-between  →  normal
    margin-top:  10px  →  0px
    width:  351.328px  →  1440px
    height:  12px  →  24px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > div > span:nth-of-type(1)  "strict edges"
    x:  78.6  →  0  (-78.6px)
    y:  611.8  →  392.9  (-218.9px)
    w:  66  →  83.6  (+17.6px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  65.9844px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(3) > div > span:nth-of-type(2)  "more removal"
    x:  363.9  →  87.4  (-276.5px)
    y:  611.8  →  392.9  (-218.9px)
    w:  66  →  99.3  (+33.3px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  65.9844px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4)  [setting-group toggle-group]
    x:  58.6  →  0  (-58.6px)
    y:  646.8  →  414.9  (-231.9px)
    w:  391.3  →  1440  (+1048.7px)
    h:  93  →  64  (-29px)
    padding-top:  22px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  22px  →  0px
    padding-left:  20px  →  0px
    width:  391.328px  →  1440px
    height:  93px  →  64px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > label
    x:  78.6  →  0  (-78.6px)
    y:  668.8  →  416.9  (-251.9px)
    w:  351.3  →  147.6  (-203.7px)
    h:  18  →  20  (+2px)
    display:  flex  →  inline
    justify-content:  space-between  →  normal
    align-items:  center  →  normal
    margin-bottom:  12px  →  0px
    width:  351.328px  →  auto
    height:  18px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > label > span  "OUTER COLOR ONLY"
    x:  78.6  →  0  (-78.6px)
    y:  671.8  →  416.9  (-254.9px)
    w:  104  →  147.6  (+43.6px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  103.969px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > label > b  [on toggle]
    x:  397.9  →  147.6  (-250.3px)
    y:  668.8  →  416.9  (-251.9px)
    w:  32  →  0  (-32px)
    h:  18  →  20  (+2px)
    display:  block  →  inline
    position:  relative  →  static
    top:  0px  →  auto
    right:  0px  →  auto
    bottom:  0px  →  auto
    left:  0px  →  auto
    width:  32px  →  auto
    height:  18px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    background-color:  rgb(23, 105, 210)  →  rgba(0, 0, 0, 0)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body >main >div >div:nth-of-type(3) >section:nth-of-type(1) >div:nth-of-type(4) >label >input
    ✗ present in reference, absent in project

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(4) > p  "Only remove connected background pixels "
    x:  78.6  →  0  (-78.6px)
    y:  698.8  →  454.9  (-243.9px)
    w:  351.3  →  1440  (+1088.7px)
    h:  18  →  24  (+6px)
    margin-top:  8px  →  16px
    margin-bottom:  0px  →  16px
    width:  351.328px  →  1440px
    height:  18px  →  24px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-size:  12px  →  16px
    line-height:  18px  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(5)  [setting-group toggle-group]
    x:  58.6  →  0  (-58.6px)
    y:  739.8  →  494.9  (-244.9px)
    w:  391.3  →  1440  (+1048.7px)
    h:  93  →  64  (-29px)
    padding-top:  22px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  22px  →  0px
    padding-left:  20px  →  0px
    width:  391.328px  →  1440px
    height:  93px  →  64px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(5) > label
    x:  78.6  →  0  (-78.6px)
    y:  761.8  →  496.9  (-264.9px)
    w:  351.3  →  92.7  (-258.6px)
    h:  18  →  20  (+2px)
    display:  flex  →  inline
    justify-content:  space-between  →  normal
    align-items:  center  →  normal
    margin-bottom:  12px  →  0px
    width:  351.328px  →  auto
    height:  18px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(5) > label > span  "SHOW MASK"
    x:  78.6  →  0  (-78.6px)
    y:  764.8  →  496.9  (-267.9px)
    w:  58.5  →  92.7  (+34.2px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  58.4844px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(5) > label > b  [toggle]
    x:  397.9  →  92.7  (-305.2px)
    y:  761.8  →  496.9  (-264.9px)
    w:  32  →  0  (-32px)
    h:  18  →  20  (+2px)
    display:  block  →  inline
    position:  relative  →  static
    top:  0px  →  auto
    right:  0px  →  auto
    bottom:  0px  →  auto
    left:  0px  →  auto
    width:  32px  →  auto
    height:  18px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1px  →  normal

body >main >div >div:nth-of-type(3) >section:nth-of-type(1) >div:nth-of-type(5) >label >input
    ✗ present in reference, absent in project

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(5) > p  "Preview the detected transparency mask."
    x:  78.6  →  0  (-78.6px)
    y:  791.8  →  534.9  (-256.9px)
    w:  351.3  →  1440  (+1088.7px)
    h:  18  →  24  (+6px)
    margin-top:  8px  →  16px
    margin-bottom:  0px  →  16px
    width:  351.328px  →  1440px
    height:  18px  →  24px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-size:  12px  →  16px
    line-height:  18px  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(6)  [settings-footer]
    x:  58.6  →  0  (-58.6px)
    y:  832.8  →  574.9  (-257.9px)
    w:  391.3  →  1440  (+1048.7px)
    h:  50  →  25  (-25px)
    display:  flex  →  block
    justify-content:  space-between  →  normal
    align-items:  center  →  normal
    padding-top:  16px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  16px  →  0px
    padding-left:  20px  →  0px
    width:  391.328px  →  1440px
    height:  50px  →  25px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(6) > button  [reset-btn]  "Reset"
    x:  78.6  →  0  (-78.6px)
    y:  848.8  →  575.9  (-272.9px)
    w:  52.4  →  67.3  (+14.9px)
    h:  18  →  24  (+6px)
    display:  flex  →  inline-block
    align-items:  center  →  normal
    row-gap:  7px  →  normal
    column-gap:  7px  →  normal
    padding-top:  0px  →  1px
    padding-right:  0px  →  6px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  6px
    width:  52.3594px  →  67.2969px
    height:  18px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  0px  →  2px
    border-top-style:  none  →  outset
    border-top-color:  rgb(23, 105, 210)  →  rgb(0, 0, 0)
    background-color:  rgba(0, 0, 0, 0)  →  rgb(240, 240, 240)
    background-position:  0px 0px  →  0% 0%
    color:  rgb(23, 105, 210)  →  rgb(0, 0, 0)
    font-size:  12px  →  13.3333px
    line-height:  18px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(6) > button > svg  [lucide lucide-icon lucide-rotate-ccw]
    x:  78.6  →  8  (-70.6px)
    y:  850.8  →  578.9  (-271.9px)
    display:  block  →  inline
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    color:  rgb(23, 105, 210)  →  rgb(0, 0, 0)
    font-size:  12px  →  13.3333px
    line-height:  18px  →  normal
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(6) > span  [auto-note]  "updates automatically"
    x:  288.9  →  71.1  (-217.8px)
    y:  851.3  →  576.9  (-274.4px)
    w:  141  →  159.4  (+18.4px)
    h:  13  →  20  (+7px)
    display:  flex  →  inline
    align-items:  center  →  normal
    row-gap:  8px  →  normal
    column-gap:  8px  →  normal
    width:  141.016px  →  auto
    height:  13px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(6) > span > i
    x:  288.9  →  71.1  (-217.8px)
    y:  854.8  →  576.9  (-277.9px)
    w:  6  →  0  (-6px)
    h:  6  →  20  (+14px)
    display:  block  →  inline
    width:  6px  →  auto
    height:  6px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    border-radius:  50%  →  0px
    background-color:  rgb(37, 169, 106)  →  rgba(0, 0, 0, 0)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2)  [remover-preview]
    x:  506.9  →  0  (-506.9px)
    y:  324.8  →  599.9  (+275.1px)
    w:  875.5  →  1440  (+564.5px)
    h:  662  →  217  (-445px)
    width:  875.484px  →  1440px
    height:  662px  →  217px
    min-height:  auto  →  0px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    background-color:  rgb(248, 250, 251)  →  rgba(0, 0, 0, 0)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1)  [preview-toolbar]
    x:  507.9  →  0  (-507.9px)
    y:  325.8  →  599.9  (+274.1px)
    w:  873.5  →  1440  (+566.5px)
    h:  121  →  49  (-72px)
    display:  flex  →  block
    justify-content:  space-between  →  normal
    align-items:  center  →  normal
    padding-top:  18px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  18px  →  0px
    padding-left:  20px  →  0px
    width:  873.484px  →  1440px
    height:  121px  →  49px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1)
    x:  527.9  →  0  (-527.9px)
    y:  362.8  →  599.9  (+237.1px)
    w:  107.8  →  1440  (+1332.2px)
    h:  46  →  24  (-22px)
    width:  107.766px  →  1440px
    height:  46px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > span  [label]  "SOURCE / RESULT"
    x:  527.9  →  0  (-527.9px)
    y:  370.8  →  601.9  (+231.1px)
    w:  100.5  →  130.3  (+29.8px)
    h:  12  →  20  (+8px)
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    letter-spacing:  1.2px  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > strong  "comparison.png"
    x:  527.9  →  134  (-393.9px)
    y:  391.8  →  601.9  (+210.1px)
    w:  107.8  →  121.1  (+13.3px)
    h:  17  →  20  (+3px)
    display:  block  →  inline
    margin-top:  5px  →  0px
    width:  107.766px  →  auto
    height:  17px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  14px  →  16px
    font-weight:  600  →  700
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2)  [preview-actions]
    x:  1168.2  →  0  (-1168.2px)
    y:  343.8  →  623.9  (+280.1px)
    w:  193.2  →  1440  (+1246.8px)
    h:  84  →  25  (-59px)
    display:  flex  →  block
    flex-wrap:  wrap  →  nowrap
    justify-content:  flex-end  →  normal
    align-items:  center  →  normal
    row-gap:  10px  →  normal
    column-gap:  10px  →  normal
    width:  193.203px  →  1440px
    height:  84px  →  25px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > span  [processed]  "processed"
    x:  1292.9  →  0  (-1292.9px)
    y:  343.8  →  625.9  (+282.1px)
    w:  68.5  →  92.1  (+23.6px)
    h:  14  →  20  (+6px)
    display:  flex  →  inline
    align-items:  center  →  normal
    row-gap:  5px  →  normal
    column-gap:  5px  →  normal
    width:  68.4844px  →  auto
    height:  14px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(37, 169, 106)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > span > svg  [lucide lucide-check lucide-icon]
    x:  1292.9  →  0  (-1292.9px)
    y:  343.8  →  627.9  (+284.1px)
    display:  block  →  inline
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(37, 169, 106)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button  [download-btn]  "Download result"
    x:  1168.2  →  95.9  (-1072.3px)
    y:  385.8  →  623.9  (+238.1px)
    w:  193.2  →  131.8  (-61.4px)
    h:  42  →  25  (-17px)
    display:  flex  →  inline-block
    justify-content:  center  →  normal
    align-items:  center  →  normal
    row-gap:  9px  →  normal
    column-gap:  9px  →  normal
    margin-top:  18px  →  0px
    padding-top:  0px  →  1px
    padding-right:  0px  →  6px
    padding-bottom:  0px  →  1px
    padding-left:  0px  →  6px
    width:  193.203px  →  131.828px
    height:  42px  →  25px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-width:  0px  →  2px
    border-top-style:  none  →  outset
    border-top-color:  rgb(255, 255, 255)  →  rgb(0, 0, 0)
    background-color:  rgb(23, 105, 210)  →  rgb(240, 240, 240)
    color:  rgb(255, 255, 255)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  13.3333px
    white-space:  nowrap  →  normal

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > button > svg  [lucide lucide-download lucide-icon]
    x:  1207.4  →  103.9  (-1103.5px)
    y:  399.3  →  626.9  (+227.6px)
    display:  block  →  inline
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(0, 0, 0)
    color:  rgb(255, 255, 255)  →  rgb(0, 0, 0)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  11px  →  13.3333px
    white-space:  nowrap  →  normal
    vertical-align:  middle  →  baseline

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2)  [comparison-grid]
    x:  507.9  →  0  (-507.9px)
    y:  446.8  →  648.9  (+202.1px)
    w:  873.5  →  1440  (+566.5px)
    h:  494  →  144  (-350px)
    display:  grid  →  block
    row-gap:  18px  →  normal
    column-gap:  18px  →  normal
    grid-template-columns:  407.734px 407.75px  →  none
    grid-template-rows:  454px  →  none
    padding-top:  20px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  20px  →  0px
    padding-left:  20px  →  0px
    width:  873.484px  →  1440px
    height:  494px  →  144px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1)  [image-card]
    x:  527.9  →  0  (-527.9px)
    y:  466.8  →  648.9  (+182.1px)
    w:  407.7  →  1440  (+1032.3px)
    h:  454  →  72  (-382px)
    width:  407.734px  →  1440px
    height:  454px  →  72px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1)  [image-label]
    x:  527.9  →  0  (-527.9px)
    y:  466.8  →  648.9  (+182.1px)
    w:  407.7  →  1440  (+1032.3px)
    h:  12  →  24  (+12px)
    display:  flex  →  block
    justify-content:  space-between  →  normal
    margin-bottom:  10px  →  0px
    width:  407.734px  →  1440px
    height:  12px  →  24px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > span  "SOURCE"
    x:  527.9  →  0  (-527.9px)
    y:  466.8  →  650.9  (+184.1px)
    w:  33  →  60.8  (+27.8px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  33px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > b  "original.png"
    x:  869.7  →  60.8  (-808.9px)
    y:  466.8  →  650.9  (+184.1px)
    w:  66  →  90.2  (+24.2px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  65.9844px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    font-weight:  400  →  700
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2)  [remover-canvas source-canvas]
    x:  527.9  →  0  (-527.9px)
    y:  488.8  →  672.9  (+184.1px)
    w:  407.7  →  1440  (+1032.3px)
    h:  432  →  48  (-384px)
    display:  grid  →  block
    position:  relative  →  static
    top:  0px  →  auto
    right:  0px  →  auto
    bottom:  0px  →  auto
    left:  0px  →  auto
    align-items:  center  →  normal
    grid-template-columns:  405.734px  →  none
    grid-template-rows:  430px  →  none
    width:  407.734px  →  1440px
    height:  432px  →  48px
    min-height:  432px  →  0px
    overflow:  hidden  →  visible
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    background-color:  rgb(232, 238, 242)  →  rgba(0, 0, 0, 0)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div  [subject subject-source]
    x:  574.2  →  0  (-574.2px)
    y:  550.9  →  672.9  (+122px)
    w:  315.1  →  1440  (+1124.9px)
    h:  307.7  →  24  (-283.7px)
    display:  grid  →  block
    align-items:  center  →  normal
    grid-template-columns:  300.234px  →  none
    grid-template-rows:  292.391px  →  none
    width:  300.234px  →  1440px
    height:  292.391px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    transform:  matrix(0.99863, -0.052336, 0.052336, 0.99863, 0, 0)  →  none
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgba(255, 255, 255, 0.85)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  14px  →  16px
    font-weight:  600  →  400
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div > span  "OBJECT"
    x:  708.3  →  0  (-708.3px)
    y:  695.1  →  674.9  (-20.2px)
    w:  47  →  58.2  (+11.2px)
    display:  block  →  inline
    width:  46.1875px  →  auto
    height:  17px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgba(255, 255, 255, 0.85)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  14px  →  16px
    font-weight:  600  →  400
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > span  [canvas-size]  "1200 × 800"
    x:  875.2  →  0  (-875.2px)
    y:  900.8  →  698.9  (-201.9px)
    w:  49.5  →  84.4  (+34.9px)
    h:  10  →  20  (+10px)
    display:  block  →  inline
    position:  absolute  →  static
    top:  411px  →  auto
    right:  10px  →  auto
    bottom:  9px  →  auto
    left:  346.25px  →  auto
    width:  49.4844px  →  auto
    height:  10px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  9px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2)  [image-card]
    x:  953.7  →  0  (-953.7px)
    y:  466.8  →  720.9  (+254.1px)
    w:  407.8  →  1440  (+1032.2px)
    h:  454  →  72  (-382px)
    width:  407.75px  →  1440px
    height:  454px  →  72px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1)  [image-label]
    x:  953.7  →  0  (-953.7px)
    y:  466.8  →  720.9  (+254.1px)
    w:  407.8  →  1440  (+1032.2px)
    h:  12  →  24  (+12px)
    display:  flex  →  block
    justify-content:  space-between  →  normal
    margin-bottom:  10px  →  0px
    width:  407.75px  →  1440px
    height:  12px  →  24px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > span  "RESULT"
    x:  953.7  →  0  (-953.7px)
    y:  466.8  →  722.9  (+256.1px)
    w:  33  →  55.8  (+22.8px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  33px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(23, 105, 210)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > b  "removed-bg.png"
    x:  1284.4  →  55.8  (-1228.6px)
    y:  466.8  →  722.9  (+256.1px)
    w:  77  →  123.9  (+46.9px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  76.9844px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    font-weight:  400  →  700
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2)  [remover-canvas]
    x:  953.7  →  0  (-953.7px)
    y:  488.8  →  744.9  (+256.1px)
    w:  407.8  →  1440  (+1032.2px)
    h:  432  →  48  (-384px)
    display:  grid  →  block
    position:  relative  →  static
    top:  0px  →  auto
    right:  0px  →  auto
    bottom:  0px  →  auto
    left:  0px  →  auto
    align-items:  center  →  normal
    grid-template-columns:  405.75px  →  none
    grid-template-rows:  430px  →  none
    width:  407.75px  →  1440px
    height:  432px  →  48px
    min-height:  432px  →  0px
    overflow:  hidden  →  visible
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div  [subject]
    x:  1007.4  →  0  (-1007.4px)
    y:  558.6  →  744.9  (+186.3px)
    w:  300.3  →  1440  (+1139.7px)
    h:  292.4  →  24  (-268.4px)
    display:  grid  →  block
    align-items:  center  →  normal
    grid-template-columns:  300.25px  →  none
    grid-template-rows:  292.391px  →  none
    width:  300.25px  →  1440px
    height:  292.391px  →  24px
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgba(255, 255, 255, 0.85)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  14px  →  16px
    font-weight:  600  →  400
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div > span  "PNG"
    x:  1146  →  0  (-1146px)
    y:  696.3  →  746.9  (+50.6px)
    w:  23.1  →  32.1  (+9px)
    h:  17  →  20  (+3px)
    display:  block  →  inline
    width:  23.0938px  →  auto
    height:  17px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgba(255, 255, 255, 0.85)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  14px  →  16px
    font-weight:  600  →  400
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > span  [canvas-size]  "1200 × 800"
    x:  1300.9  →  0  (-1300.9px)
    y:  900.8  →  770.9  (-129.9px)
    w:  49.5  →  84.4  (+34.9px)
    h:  10  →  20  (+10px)
    display:  block  →  inline
    position:  absolute  →  static
    top:  411px  →  auto
    right:  10px  →  auto
    bottom:  9px  →  auto
    left:  346.266px  →  auto
    width:  49.4844px  →  auto
    height:  10px  →  auto
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  9px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(3)  [result-meta]
    x:  507.9  →  0  (-507.9px)
    y:  940.8  →  792.9  (-147.9px)
    w:  873.5  →  1440  (+566.5px)
    h:  45  →  24  (-21px)
    display:  flex  →  block
    row-gap:  24px  →  normal
    column-gap:  24px  →  normal
    padding-top:  16px  →  0px
    padding-right:  20px  →  0px
    padding-bottom:  16px  →  0px
    padding-left:  20px  →  0px
    width:  873.484px  →  1440px
    height:  45px  →  24px
    border-top-width:  1px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(3) > span:nth-of-type(1)  "FORMAT"
    x:  527.9  →  0  (-527.9px)
    y:  957.8  →  794.9  (-162.9px)
    w:  77.5  →  124.8  (+47.3px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  77.5px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(3) > span:nth-of-type(1) > b  "PNG-24"
    x:  572.4  →  65.4  (-507px)
    y:  957.8  →  794.9  (-162.9px)
    w:  33  →  59.4  (+26.4px)
    h:  12  →  20  (+8px)
    margin-left:  6px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    font-weight:  600  →  700
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(3) > span:nth-of-type(2)  "ALPHA"
    x:  629.4  →  128.6  (-500.8px)
    y:  957.8  →  794.9  (-162.9px)
    w:  77.5  →  125.6  (+48.1px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  77.5px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(3) > span:nth-of-type(2) > b  "ENABLED"
    x:  668.4  →  181.9  (-486.5px)
    y:  957.8  →  794.9  (-162.9px)
    w:  38.5  →  72.3  (+33.8px)
    h:  12  →  20  (+8px)
    margin-left:  6px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    font-weight:  600  →  700
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(3) > span:nth-of-type(3)  "SIMILARITY"
    x:  730.9  →  258  (-472.9px)
    y:  957.8  →  794.9  (-162.9px)
    w:  88.5  →  131.3  (+42.8px)
    h:  12  →  20  (+8px)
    display:  block  →  inline
    width:  88.4844px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    color:  rgb(109, 120, 131)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    line-height:  normal  →  24px

body > main > div > div:nth-of-type(3) > section:nth-of-type(2) > div:nth-of-type(3) > span:nth-of-type(3) > b  "72 %"
    x:  797.4  →  350.7  (-446.7px)
    y:  957.8  →  794.9  (-162.9px)
    w:  22  →  38.6  (+16.6px)
    h:  12  →  20  (+8px)
    margin-left:  6px  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 33, 43)
    font-family:  "IBM Plex Mono", monospace  →  "IBM Plex Sans", sans-serif
    font-size:  10px  →  16px
    font-weight:  600  →  700
    line-height:  normal  →  24px

body > main > footer  [preview-footer]
    y:  1058.8  →  816.9  (-241.9px)
    row-gap:  normal  →  16px
    column-gap:  normal  →  16px
    height:  45px  →  46px
    letter-spacing:  normal  →  0.8px

body > main > footer > span:nth-of-type(1)  "easy-png-tools"
    y:  1075.8  →  833.9  (-241.9px)
    w:  117  →  142.8  (+25.8px)
    display:  flex  →  block
    align-items:  center  →  normal
    row-gap:  7px  →  normal
    column-gap:  7px  →  normal
    width:  116.984px  →  142.812px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  normal  →  0.8px

body > main > footer > span:nth-of-type(1) > b  [version]  "v2.4.0"
    x:  141.6  →  159.6  (+18px)
    y:  1075.8  →  833.9  (-241.9px)
    w:  33  →  40.8  (+7.8px)
    display:  block  →  inline
    width:  33px  →  auto
    height:  12px  →  auto
    min-width:  auto  →  0px
    min-height:  auto  →  0px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(23, 105, 210)
    font-weight:  400  →  700
    letter-spacing:  normal  →  0.8px

body > main > footer > span:nth-of-type(2)  "© 2024"
    x:  676.8  →  1341.6  (+664.8px)
    y:  1075.8  →  833.9  (-241.9px)
    w:  170.5  →  40.8  (-129.7px)
    display:  flex  →  block
    align-items:  center  →  normal
    row-gap:  7px  →  normal
    column-gap:  7px  →  normal
    width:  170.453px  →  40.8125px
    height:  12px  →  13px
    border-top-style:  solid  →  none
    border-top-color:  rgb(203, 211, 218)  →  rgb(109, 120, 131)
    letter-spacing:  normal  →  0.8px

body >main >footer >span:nth-of-type(3)  "© 2024"
    ✗ present in reference, absent in project

body >div
    ✗ present in reference, absent in project
