const imgProperty1 = "https://www.figma.com/api/mcp/asset/87856a0b-f34b-4765-b551-40cc84fcd209";
const imgUnion = "https://www.figma.com/api/mcp/asset/8c591b74-7bae-4158-b8b5-8db25caba320";
const img = "https://www.figma.com/api/mcp/asset/b739f303-d22d-4089-9e82-90a396198c7d";
const img1 = "https://www.figma.com/api/mcp/asset/e483e868-a149-45c2-ac0e-eac64e1ab210";
const imgGroup1597881806 = "https://www.figma.com/api/mcp/asset/81d458a5-f3a1-4300-b4b4-965729c0a641";
const img2 = "https://www.figma.com/api/mcp/asset/7d8835c6-a516-49d3-8f0f-1099df7593a0";
const img3 = "https://www.figma.com/api/mcp/asset/8676d1dd-ea43-4448-9f78-daa3a9d6e869";
const img4 = "https://www.figma.com/api/mcp/asset/5519a672-8a4e-4a0b-8a72-fe9e49a97d4a";
const img5 = "https://www.figma.com/api/mcp/asset/eb8c9635-a13f-430b-be82-83ea70e90106";
const imgGroup1597881805 = "https://www.figma.com/api/mcp/asset/172045fd-44df-4bbb-8d27-8d0b180229b3";
const img6 = "https://www.figma.com/api/mcp/asset/6b283b86-b80e-45c2-8a6f-dca28327345c";
const img7 = "https://www.figma.com/api/mcp/asset/267e9f23-e79e-41fe-8a1f-a957b8fad5d7";
const imgUnion1 = "https://www.figma.com/api/mcp/asset/aafbd6ca-f85d-42fe-b418-dc30052e84fb";
const imgUnion2 = "https://www.figma.com/api/mcp/asset/55eb6770-bb8a-472b-a6d5-19057c3dbb9e";
const imgUnion3 = "https://www.figma.com/api/mcp/asset/29728396-6e97-44d1-b2ee-2e4819ecde7a";
const imgUnion4 = "https://www.figma.com/api/mcp/asset/9dc78fcd-a46f-435c-84f7-58dec056557b";
const imgUnion5 = "https://www.figma.com/api/mcp/asset/dfb1eaf1-fb1a-4bcd-aa98-587690df6092";
const imgUnion6 = "https://www.figma.com/api/mcp/asset/ed55e539-1df7-436a-b1f0-235c4805eca2";
const imgUnion7 = "https://www.figma.com/api/mcp/asset/339154e6-1b1f-4fa4-b9a8-62dd67bcd096";
const imgUnion8 = "https://www.figma.com/api/mcp/asset/4dfd2f47-f9f2-4020-8d8e-5490a6926533";
const imgUnion9 = "https://www.figma.com/api/mcp/asset/4819cd4f-2bd2-4f85-9bd7-f2564133ac7a";
const imgUnion10 = "https://www.figma.com/api/mcp/asset/e3523f9a-e402-44a7-bf80-07cc1cf927fd";
const imgUnion11 = "https://www.figma.com/api/mcp/asset/25fb95b0-5273-4e9e-8ccf-147fd8a9032b";
const imgUnion12 = "https://www.figma.com/api/mcp/asset/80e920c5-0947-4b47-b626-93e5f3eff400";
const imgUnion13 = "https://www.figma.com/api/mcp/asset/080e349c-771e-4dc6-bcef-ea11cfb86473";
const imgUnion14 = "https://www.figma.com/api/mcp/asset/d857d54c-f3e5-4401-b17a-34c8722b9fa7";
const imgUnion15 = "https://www.figma.com/api/mcp/asset/6fdbda6a-a911-48a9-b62b-56051700537a";
const imgUnion16 = "https://www.figma.com/api/mcp/asset/a7bfd856-a00b-47f7-a21d-fe4fc4450318";
const imgUnion17 = "https://www.figma.com/api/mcp/asset/4b9c4859-31bf-4624-9f44-56d09821da82";
const img8 = "https://www.figma.com/api/mcp/asset/e1846ff4-73ec-45b0-b27c-f62bfbe11a16";
const imgGroup1158 = "https://www.figma.com/api/mcp/asset/dee2a79d-90a3-4294-a060-523f9893d457";
const img9 = "https://www.figma.com/api/mcp/asset/d76f8d35-ce1f-4f25-b48c-473ec91e7531";
const img10 = "https://www.figma.com/api/mcp/asset/a7a109e5-dc8f-4f44-9137-0aab121c1619";
type iconProps = {
  className?: string;
  property1?: "果蔬" | "油脂" | "种业" | "粮食";
};

function icon({ className, property1 = "粮食" }: iconProps) {
  return (
    <div className={className} data-name="Property 1=粮食" data-node-id="1201:31235">
      <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="1198:61730">
        <img alt="" className="block max-w-none size-full" src={imgUnion} />
      </div>
    </div>
  );
}
type ComponentProps = {
  className?: string;
  property1?: "上";
};

function Component({ className, property1 = "上" }: ComponentProps) {
  return (
    <div className={className} data-name="Property 1=上" data-node-id="1201:48133">
      <div className="absolute content-stretch flex flex-col gap-[40px] h-[944px] items-center justify-center left-0 right-[37.7%] top-1/2 translate-y-[-50%]" data-name="导航内容" data-node-id="1201:47870">
        <div className="bg-[rgba(255,255,255,0.05)] box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="111" data-node-id="1201:47862">
          <icon className="overflow-clip relative shrink-0 size-[50px]" />
          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:47859">
            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="I1201:47859;635:42944">
              <p className="mb-0">粮</p>
              <p className="mb-0">&nbsp;</p>
              <p>食</p>
            </div>
          </div>
        </div>
        <div className="box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="222" data-node-id="1201:47864">
          <div className="overflow-clip relative shrink-0 size-[50px]" data-name="产业icon" data-node-id="1201:47865">
            <div className="absolute inset-[13%_26.2%]" data-name="Vector" data-node-id="I1201:47865;1200:31218">
              <div className="absolute inset-0" style={{ "--fill-0": "rgba(255, 255, 255, 1)" } as React.CSSProperties}>
                <img alt="" className="block max-w-none size-full" src={img} />
              </div>
            </div>
          </div>
          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:47866">
            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-[rgba(255,255,255,0.5)] whitespace-nowrap" data-node-id="I1201:47866;635:42944">
              <p className="mb-0">油</p>
              <p className="mb-0">&nbsp;</p>
              <p>脂</p>
            </div>
          </div>
        </div>
      </div>
      <div className="absolute bottom-0 flex items-center justify-center left-[25.05%] right-0 top-0">
        <div className="flex-none h-[1078.893px] rotate-[180deg] scale-y-[-100%] w-[113.088px]">
          <div className="relative size-full" data-name="光标左侧" data-node-id="1201:48121">
            <div className="absolute bottom-[-0.04%] left-0 right-0 top-[-0.04%]">
              <img alt="" className="block max-w-none size-full" src={img1} />
            </div>
          </div>
        </div>
      </div>
    </div>
  );
}
type TextProps = {
  className?: string;
  propValue?: "24px" | "26px" | "34px";
  propValue1?: "特粗";
  propValue2?: "左对齐" | "右对齐" | "居中对齐";
};

function Text({ className, propValue = "34px", propValue1 = "特粗", propValue2 = "左对齐" }: TextProps) {
  if (propValue === "24px" && propValue1 === "特粗" && propValue2 === "左对齐") {
    return (
      <div className={className} data-name="字号=24px, 字重=特粗, 位置=左对齐" data-node-id="632:88182">
        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[24px] text-white whitespace-nowrap" data-node-id="632:88183">
          <p className="leading-[32px]">Text line-24px</p>
        </div>
      </div>
    );
  }
  if (propValue === "26px" && propValue1 === "特粗" && propValue2 === "左对齐") {
    return (
      <div className={className} data-name="字号=26px, 字重=特粗, 位置=左对齐" data-node-id="635:42943">
        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="635:42944">
          <p className="leading-[32px]">Text line-26px</p>
        </div>
      </div>
    );
  }
  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "居中对齐") {
    return (
      <div className={className} data-name="字号=34px, 字重=特粗, 位置=居中对齐" data-node-id="635:42955">
        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-center text-white whitespace-nowrap" data-node-id="635:42956">
          <p className="leading-[32px]">Text line-34px</p>
        </div>
      </div>
    );
  }
  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "右对齐") {
    return (
      <div className={className} data-name="字号=34px, 字重=特粗, 位置=右对齐" data-node-id="635:42959">
        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-right text-white whitespace-nowrap" data-node-id="635:42960">
          <p className="leading-[32px]">Text line-34px</p>
        </div>
      </div>
    );
  }
  return (
    <div className={className} data-name="字号=34px, 字重=特粗, 位置=左对齐" data-node-id="635:42949">
      <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-white whitespace-nowrap" data-node-id="635:42950">
        <p className="leading-[32px]">Text line-34px</p>
      </div>
    </div>
  );
}

function Component2({ className }: { className?: string }) {
  return (
    <div className={className} data-name="弹出框样式2" data-node-id="741:54163">
      <div className="flex h-[calc(1px*((var(--transform-inner-width)*1)+(var(--transform-inner-height)*0)))] items-center justify-center leading-[0] relative shrink-0 w-[calc(1px*((var(--transform-inner-height)*1)+(var(--transform-inner-width)*0)))]">
        <div className="flex-none rotate-[90deg] scale-y-[-100%]">
          <div className="grid-cols-[max-content] grid-rows-[max-content] inline-grid justify-items-start relative" data-node-id="1207:33739">
            <div className="col-[1] h-[80px] ml-[7.5px] mt-[17px] relative row-[1] w-[2px]" data-node-id="1207:33513">
              <div className="absolute bottom-[-1.25%] left-0 right-[-50%] top-[-1.25%]">
                <img alt="" className="block max-w-none size-full" src={imgGroup1597881806} />
              </div>
            </div>
            <div className="col-[1] ml-0 mt-0 relative row-[1] size-[17px]" data-name="圆圈圈" data-node-id="741:53539">
              <img alt="" className="block max-w-none size-full" src={img2} />
            </div>
          </div>
        </div>
      </div>
      <div className="h-[320px] relative shrink-0 w-[476px]" data-name="框" data-node-id="741:53541">
        <div className="absolute inset-[-0.06%_-0.09%_-0.06%_-0.04%]">
          <img alt="" className="block max-w-none size-full" src={img3} />
        </div>
      </div>
    </div>
  );
}

function Component1({ className }: { className?: string }) {
  return (
    <div className={className} data-name="定位点/产业链" data-node-id="1205:31870">
      <div className="absolute inset-[10%_13.79%]" data-name="底部" data-node-id="1201:48987">
        <img alt="" className="block max-w-none size-full" src={img4} />
      </div>
      <div className="absolute bottom-[40.42%] left-1/4 overflow-clip right-1/4 shadow-[0px_0px_6px_0px_#4593ff] top-[17.92%]" data-name="产业链" data-node-id="1205:31863">
        <div className="absolute inset-[5.36%_10.72%]" data-name="Union" data-node-id="I1205:31863;1205:31861">
          <img alt="" className="block max-w-none size-full" src={img5} />
        </div>
        <div className="absolute inset-0 pointer-events-none shadow-[inset_0px_0px_3px_0px_#ffffff]" />
      </div>
    </div>
  );
}

function Component3({ className }: { className?: string }) {
  return (
    <div className={className} data-name="定位点/基地" data-node-id="1205:31871">
      <div className="absolute inset-[12.5%_8.66%]" data-node-id="1205:32108">
        <img alt="" className="block max-w-none size-full" src={imgGroup1597881805} />
      </div>
      <div className="absolute inset-[27.5%_23%] overflow-clip" data-name="产业icon" data-node-id="1204:31851">
        <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="I1204:31851;1198:61730">
          <div className="absolute inset-[-20.02%_-26.17%]">
            <img alt="" className="block max-w-none size-full" src={img6} />
          </div>
        </div>
      </div>
    </div>
  );
}

function Component4({ className }: { className?: string }) {
  return (
    <div className={className} data-name="边" data-node-id="84:21868">
      <img alt="" className="block max-w-none size-full" src={img7} />
    </div>
  );
}

function Component5({ className }: { className?: string }) {
  return (
    <div className={className} data-name="线" data-node-id="84:21850">
      <div className="absolute inset-[45.14%_13.47%_22.05%_68.8%]" data-name="Union" data-node-id="84:21851">
        <div className="absolute inset-[-0.28%_-0.28%_-0.27%_-0.35%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion1} />
        </div>
      </div>
      <div className="absolute inset-[69.45%_7.91%_11.34%_79.45%]" data-name="Union" data-node-id="84:21852">
        <div className="absolute inset-[-0.36%_-0.44%_-0.33%_-0.45%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion2} />
        </div>
      </div>
      <div className="absolute bottom-[58.34%] left-[13.82%] right-[58.52%] top-0" data-name="Union" data-node-id="84:21853">
        <div className="absolute inset-[-0.16%_-0.17%_-0.16%_-0.25%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion3} />
        </div>
      </div>
      <div className="absolute inset-[40.22%_52.11%_21.49%_24.35%]" data-name="Union" data-node-id="84:21854">
        <div className="absolute inset-[-0.17%_-0.21%_-0.2%_-0.28%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion4} />
        </div>
      </div>
      <div className="absolute inset-[15.1%_38.74%_51.84%_30.9%]" data-name="Union" data-node-id="84:21855">
        <div className="absolute inset-[-0.2%_-0.17%_-0.22%_-0.17%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion5} />
        </div>
      </div>
      <div className="absolute inset-[62.63%_13.38%_23.24%_79.12%]" data-name="Union" data-node-id="84:21856">
        <div className="absolute inset-[-0.45%_-0.62%_-0.6%_-0.65%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion6} />
        </div>
      </div>
      <div className="absolute inset-[39.2%_33.9%_32.16%_45.04%]" data-name="Union" data-node-id="84:21857">
        <div className="absolute inset-[-0.26%_-0.43%_-0.35%_-0.33%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion7} />
        </div>
      </div>
      <div className="absolute inset-[33.43%_19.83%_31.88%_63.81%]" data-name="Union" data-node-id="84:21858">
        <div className="absolute inset-[-0.19%_-0.36%_-0.2%_-0.31%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion8} />
        </div>
      </div>
      <div className="absolute inset-[61.63%_26.15%_9.48%_37%]" data-name="Union" data-node-id="84:21859">
        <div className="absolute inset-[-0.27%_-0.13%_-0.27%_-0.21%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion9} />
        </div>
      </div>
      <div className="absolute bottom-[16.35%] left-[77.75%] right-0 top-[39.25%]" data-name="Union" data-node-id="84:21860">
        <div className="absolute inset-[-0.15%_-0.22%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion10} />
        </div>
      </div>
      <div className="absolute bottom-0 left-[66.67%] right-[14.92%] top-[70.14%]" data-name="Union" data-node-id="84:21861">
        <div className="absolute inset-[-0.22%_-0.27%_-0.22%_-0.26%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion11} />
        </div>
      </div>
      <div className="absolute inset-[19.86%_25.75%_54.08%_56.23%]" data-name="Union" data-node-id="84:21862">
        <div className="absolute inset-[-0.28%_-0.27%_-0.49%_-0.27%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion12} />
        </div>
      </div>
      <div className="absolute bottom-[2%] left-0 right-[70.7%] top-[44.26%]" data-name="Union" data-node-id="84:21863">
        <div className="absolute inset-[-0.12%_-0.16%_-0.14%_-0.18%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion13} />
        </div>
      </div>
      <div className="absolute inset-[64.64%_29.68%_24.46%_58.95%]" data-name="Union" data-node-id="84:21864">
        <div className="absolute inset-[-0.59%_-0.41%_-0.67%_-0.42%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion14} />
        </div>
      </div>
      <div className="absolute inset-[61.94%_39.82%_24.69%_53.29%]" data-name="Union" data-node-id="84:21865">
        <div className="absolute inset-[-0.64%_-0.74%_-0.48%_-0.82%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion15} />
        </div>
      </div>
      <div className="absolute inset-[55.88%_34.28%_31.77%_54.46%]" data-name="Union" data-node-id="84:21866">
        <div className="absolute inset-[-0.54%_-0.41%_-0.57%_-0.41%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion16} />
        </div>
      </div>
      <div className="absolute inset-[33.35%_66.33%_53.33%_20.28%]" data-name="Union" data-node-id="84:21867">
        <div className="absolute inset-[-0.55%_-0.49%_-0.53%_-0.4%]">
          <img alt="" className="block max-w-none size-full" src={imgUnion17} />
        </div>
      </div>
    </div>
  );
}

function Component6({ className }: { className?: string }) {
  return (
    <div className={className} data-name="导航底框" data-node-id="631:36462">
      <div className="absolute bottom-[18.95%] left-0 right-0 top-0" data-name="1" data-node-id="631:36440">
        <div className="absolute inset-[-181.3%_-19.68%_-413.77%_-19.68%]">
          <img alt="" className="block max-w-none size-full" src={img8} />
        </div>
      </div>
      <div className="absolute bottom-0 left-[27.44%] right-[27.44%] top-[62.9%]" data-node-id="631:36441">
        <div className="absolute inset-[-257.75%_-17.4%]">
          <img alt="" className="block max-w-none size-full" src={imgGroup1158} />
        </div>
      </div>
    </div>
  );
}

function Component7({ className }: { className?: string }) {
  return (
    <div className={className} data-name="底部网格" data-node-id="631:69869">
      <div className="absolute bottom-[-71.42%] content-stretch flex flex-col items-start left-0 mask-alpha mask-intersect mask-no-clip mask-no-repeat mask-position-[0px_175.624px] mask-size-[1920px_1080px] right-0 top-[-16.26%]" data-name="底部内容" data-node-id="631:69865" style={{ maskImage: `url('${img9}')` }}>
        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69866">
          <img alt="" className="block max-w-none size-full" src={img10} />
        </div>
        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69867">
          <img alt="" className="block max-w-none size-full" src={img10} />
        </div>
      </div>
    </div>
  );
}
type Component8Props = {
  className?: string;
  property1?: "供应链专用界面";
};

function Component8({ className, property1 = "供应链专用界面" }: Component8Props) {
  return (
    <div className={className} data-name="Property 1=供应链专用界面" data-node-id="1486:134453">
      <div aria-hidden="true" className="absolute inset-0 pointer-events-none">
        <img alt="" className="absolute max-w-none object-50%-50% object-cover size-full" src={imgProperty1} />
        <div className="absolute bg-[rgba(0,79,154,0.1)] inset-0" />
      </div>
      <div className="absolute contents left-0 top-0" data-node-id="1486:133993" />
    </div>
  );
}

export default function Component9() {
  return (
    <div className="bg-[rgba(33,33,33,0.6)] relative size-full" data-name="操控屏-2-种业•果蔬-种业首页-" data-node-id="1443:70580">
      <div className="absolute contents left-0 top-0" data-name="我是底部" data-node-id="I1443:70580;1412:183818">
        <Component8 className="absolute h-[1080px] left-0 overflow-clip top-0 w-[1920px]" />
        <Component7 className="absolute h-[1080px] left-0 top-0 w-[1920px]" />
        <Component6 className="absolute h-[71.119px] left-[526.95px] top-[40px] w-[866.265px]" />
        <Text className="absolute box-border content-stretch flex gap-[10px] items-center justify-center left-1/2 px-0 py-[4px] top-[40px] translate-x-[-50%]" propValue2="居中对齐" />
      </div>
      <div className="absolute contents left-[529.88px] top-[calc(50%+33.79px)] translate-y-[-50%]" data-name="地图" data-node-id="I1443:70580;1412:189260">
        <div className="absolute contents left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" data-name="地图" data-node-id="I1443:70580;1412:189261">
          <Component5 className="absolute inset-[19.27%_4.17%_13.01%_27.6%]" />
          <Component4 className="absolute h-[731.454px] left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" />
        </div>
        <Component3 className="absolute h-[48px] left-[1142.89px] top-[717.84px] w-[40px]" />
        <Component3 className="absolute h-[48px] left-[1664.25px] top-[530.82px] w-[40px]" />
        <Component3 className="absolute h-[48px] left-[1435px] top-[527.14px] w-[40px]" />
        <Component3 className="absolute h-[48px] left-[1203.07px] top-[514.31px] w-[40px]" />
        <Component1 className="absolute h-[72px] left-[1273.12px] top-[551.14px] w-[60px]" />
        <Component1 className="absolute h-[48px] left-[1403px] top-[597.5px] w-[40px]" />
        <Component1 className="absolute h-[48px] left-[1694.25px] top-[645.5px] w-[40px]" />
        <Component1 className="absolute h-[48px] left-[1237.87px] top-[761.84px] w-[40px]" />
      </div>
      <div className="absolute bottom-[80px] content-stretch flex items-center left-1/2 translate-x-[-50%]" data-name="说明" data-node-id="I1443:70580;1412:189272">
        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="111" data-node-id="I1443:70580;1412:189273">
          <Component3 className="h-[50px] relative shrink-0 w-[41.667px]" />
          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
        </div>
        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="112" data-node-id="I1443:70580;1412:189276">
          <Component1 className="h-[50px] relative shrink-0 w-[41.667px]" />
          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
        </div>
      </div>
      <div className="absolute content-stretch flex flex-col gap-[10px] items-end right-[80px] top-[150px]" data-name="1+！" data-node-id="I1443:70580;1412:183865">
        <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
        <Text className="box-border content-stretch flex gap-[10px] h-[77px] items-center justify-end px-0 py-[4px] relative shrink-0 w-full" propValue2="右对齐" />
        <Text className="box-border content-stretch flex gap-[10px] items-center justify-end px-0 py-[4px] relative shrink-0" propValue2="右对齐" />
      </div>
      <div className="absolute h-[351px] left-[697.87px] overflow-clip top-[272.14px] w-[580px]" data-name="基地弹出框" data-node-id="I1443:70580;1412:183925">
        <div className="absolute bottom-[31px] flex items-center justify-center left-0">
          <div className="flex-none rotate-[180deg]">
            <Component2 className="content-stretch flex items-start overflow-clip relative" />
          </div>
        </div>
        <div className="absolute content-stretch flex flex-col gap-[12px] items-center left-[30px] top-[50px] w-[420px]" data-name="粮食源头" data-node-id="I1443:70580;1700:134693">
          <div className="content-stretch flex flex-col gap-[12px] items-start relative shrink-0 w-full" data-node-id="I1443:70580;1700:134694">
            <Text className="box-border content-stretch flex gap-[10px] h-[62px] items-center px-0 py-[4px] relative shrink-0 w-full" propValue="24px" />
          </div>
          <div className="content-stretch flex flex-col gap-[12px] items-start relative shrink-0 w-full" data-node-id="I1443:70580;1700:134697">
            <div className="content-stretch flex gap-[10px] items-start relative shrink-0 w-full" data-node-id="I1443:70580;1700:134698">
              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-[301px]" propValue="24px" />
              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
            </div>
            <div className="content-stretch flex gap-[10px] items-start relative shrink-0" data-node-id="I1443:70580;1700:134702">
              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
            </div>
            <div className="content-stretch flex gap-[10px] items-start relative shrink-0" data-node-id="I1443:70580;1700:134952">
              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
            </div>
          </div>
        </div>
      </div>
      <Component className="absolute h-[1078.893px] left-[40px] top-0 w-[150.879px]" />
    </div>
  );
}
SUPER CRITICAL: The generated React+Tailwind code MUST be converted to match the target project's technology stack and styling system.
1. Analyze the target codebase to identify: technology stack, styling approach, component patterns, and design tokens
2. Convert React syntax to the target framework/library
3. Transform all Tailwind classes to the target styling system while preserving exact visual design
4. Follow the project's existing patterns and conventions
DO NOT install any Tailwind as a dependency unless the user instructs you to do so.

Node ids have been added to the code as data attributes, e.g. `data-node-id="1:2"`.
These styles are contained in the design: 文字颜色/2-100%白色: #FFFFFF, 渐变/2-蓝色: , 边框-蓝色: #133BA0, 主色/icon色: , 文字颜色/3-50%白色: #FFFFFF, 主色/主色-2亮绿: #00FFFF, 主色/产业-种业: #5DEF8B.
Images and SVGs will be stored as constants, e.g. const image = 'https://www.figma.com/api/mcp/asset/550e8400-e29b-41d4-a716-446655440000'. These constants will be used in the code as the source for the image, ex: <img src={image} />. Image assets are stored on a remote server for 7 days and can be fetched using the provided URLs until they expire.
IMPORTANT: After you call this tool, you MUST call get_screenshot to get a screenshot of the node for context.