{
  "version": "1.0",
  "children": [
    {
      "type": "frame",
      "id": "ff_root",
      "name": "Form Fields — Design System",
      "width": 1328,
      "height": 900,
      "fill": "#F1F3F5",
      "padding": 48,
      "layout": "vertical",
      "gap": 48,
      "children": [
        {
          "type": "text",
          "id": "ff_title",
          "content": "Form Field Pattern — MGC Design System",
          "fontFamily": "Roboto",
          "fontSize": 28,
          "fontWeight": 700,
          "fill": "#0f172a",
          "width": 560,
          "height": 48,
          "children": []
        },
        {
          "type": "text",
          "id": "ff_subtitle",
          "content": "P0 · Стандарт: Label + Input + Hint + Error",
          "fontFamily": "Roboto",
          "fontSize": 14,
          "fontWeight": 400,
          "fill": "#6b7280",
          "width": 400,
          "height": 24,
          "children": []
        },

        {
          "type": "frame",
          "id": "ff_states_section",
          "name": "FormFieldStates",
          "layout": "vertical",
          "gap": 16,
          "children": [
            {
              "type": "text",
              "id": "ff_states_label",
              "content": "FIELD STATES",
              "fontFamily": "Roboto",
              "fontSize": 11,
              "fontWeight": 600,
              "fill": "#7209B7",
              "letterSpacing": 1.5,
              "width": 120,
              "height": 20,
              "children": []
            },
            {
              "type": "frame",
              "id": "ff_states_row",
              "name": "FieldStatesRow",
              "layout": "horizontal",
              "gap": 32,
              "alignItems": "flex-start",
              "children": [
                {
                  "type": "frame",
                  "id": "ff_default_field",
                  "name": "Field_Default",
                  "layout": "vertical",
                  "gap": 6,
                  "children": [
                    {
                      "type": "frame",
                      "id": "ff_def_label_row",
                      "layout": "horizontal",
                      "gap": 4,
                      "alignItems": "center",
                      "children": [
                        {"type": "text", "id": "ff_def_lbl", "content": "Email", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": 500, "fill": "#374151", "width": 40, "height": 20, "children": []},
                        {"type": "text", "id": "ff_def_req", "content": "*", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": 500, "fill": "#b91c1c", "width": 10, "height": 20, "children": []}
                      ]
                    },
                    {
                      "type": "frame",
                      "id": "ff_def_input",
                      "width": 280,
                      "height": 40,
                      "fill": "#161b27",
                      "cornerRadius": 8,
                      "padding": [0, 16, 0, 16],
                      "layout": "horizontal",
                      "alignItems": "center",
                      "stroke": {"align": "inside", "thickness": 1, "fill": "#2a3040"},
                      "children": [
                        {"type": "text", "id": "ff_def_inp_txt", "content": "your@email.com", "fontFamily": "Roboto", "fontSize": 14, "fill": "#4b5563", "width": 160, "height": 24, "children": []}
                      ]
                    },
                    {"type": "text", "id": "ff_def_hint", "content": "Введите ваш рабочий email", "fontFamily": "Roboto", "fontSize": 12, "fill": "#6b7280", "width": 280, "height": 18, "children": []}
                  ]
                },

                {
                  "type": "frame",
                  "id": "ff_focus_field",
                  "name": "Field_Focus",
                  "layout": "vertical",
                  "gap": 6,
                  "children": [
                    {
                      "type": "frame",
                      "id": "ff_foc_label_row",
                      "layout": "horizontal",
                      "gap": 4,
                      "alignItems": "center",
                      "children": [
                        {"type": "text", "id": "ff_foc_lbl", "content": "Email", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": 500, "fill": "#7209B7", "width": 40, "height": 20, "children": []},
                        {"type": "text", "id": "ff_foc_req", "content": "*", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": 500, "fill": "#b91c1c", "width": 10, "height": 20, "children": []}
                      ]
                    },
                    {
                      "type": "frame",
                      "id": "ff_foc_input",
                      "width": 280,
                      "height": 40,
                      "fill": "#161b27",
                      "cornerRadius": 8,
                      "padding": [0, 16, 0, 16],
                      "layout": "horizontal",
                      "alignItems": "center",
                      "stroke": {"align": "inside", "thickness": 2, "fill": "#7209B7"},
                      "children": [
                        {"type": "text", "id": "ff_foc_inp_txt", "content": "user@exa|", "fontFamily": "Roboto", "fontSize": 14, "fill": "#f4f4f5", "width": 100, "height": 24, "children": []}
                      ]
                    },
                    {"type": "text", "id": "ff_foc_hint", "content": "Введите ваш рабочий email", "fontFamily": "Roboto", "fontSize": 12, "fill": "#6b7280", "width": 280, "height": 18, "children": []}
                  ]
                },

                {
                  "type": "frame",
                  "id": "ff_error_field",
                  "name": "Field_Error",
                  "layout": "vertical",
                  "gap": 6,
                  "children": [
                    {
                      "type": "frame",
                      "id": "ff_err_label_row",
                      "layout": "horizontal",
                      "gap": 4,
                      "alignItems": "center",
                      "children": [
                        {"type": "text", "id": "ff_err_lbl", "content": "Email", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": 500, "fill": "#374151", "width": 40, "height": 20, "children": []},
                        {"type": "text", "id": "ff_err_req", "content": "*", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": 500, "fill": "#b91c1c", "width": 10, "height": 20, "children": []}
                      ]
                    },
                    {
                      "type": "frame",
                      "id": "ff_err_input",
                      "width": 280,
                      "height": 40,
                      "fill": "#1f0a0a",
                      "cornerRadius": 8,
                      "padding": [0, 16, 0, 16],
                      "layout": "horizontal",
                      "alignItems": "center",
                      "stroke": {"align": "inside", "thickness": 2, "fill": "#ef4444"},
                      "children": [
                        {"type": "text", "id": "ff_err_inp_txt", "content": "notanemail", "fontFamily": "Roboto", "fontSize": 14, "fill": "#f4f4f5", "width": 100, "height": 24, "children": []}
                      ]
                    },
                    {
                      "type": "frame",
                      "id": "ff_err_msg_row",
                      "layout": "horizontal",
                      "gap": 4,
                      "alignItems": "center",
                      "children": [
                        {"type": "rectangle", "id": "ff_err_dot", "width": 12, "height": 12, "fill": "#ef4444", "cornerRadius": 6, "children": []},
                        {"type": "text", "id": "ff_err_msg", "content": "Введите корректный email адрес", "fontFamily": "Roboto", "fontSize": 12, "fill": "#b91c1c", "width": 240, "height": 18, "children": []}
                      ]
                    }
                  ]
                },

                {
                  "type": "frame",
                  "id": "ff_disabled_field",
                  "name": "Field_Disabled",
                  "layout": "vertical",
                  "gap": 6,
                  "children": [
                    {"type": "text", "id": "ff_dis_lbl", "content": "Email", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": 500, "fill": "#374151", "width": 40, "height": 20, "children": []},
                    {
                      "type": "frame",
                      "id": "ff_dis_input",
                      "width": 280,
                      "height": 40,
                      "fill": "#0f1018",
                      "cornerRadius": 8,
                      "padding": [0, 16, 0, 16],
                      "layout": "horizontal",
                      "alignItems": "center",
                      "stroke": {"align": "inside", "thickness": 1, "fill": "#1a1a2a"},
                      "children": [
                        {"type": "text", "id": "ff_dis_inp_txt", "content": "locked@example.com", "fontFamily": "Roboto", "fontSize": 14, "fill": "#2a2a3a", "width": 160, "height": 24, "children": []}
                      ]
                    },
                    {"type": "text", "id": "ff_dis_hint", "content": "Это поле недоступно для редактирования", "fontFamily": "Roboto", "fontSize": 12, "fill": "#374151", "width": 280, "height": 18, "children": []}
                  ]
                }
              ]
            }
          ]
        },

        {
          "type": "frame",
          "id": "ff_login_section",
          "name": "LoginFormExample",
          "layout": "vertical",
          "gap": 16,
          "children": [
            {
              "type": "text",
              "id": "ff_login_header",
              "content": "EXAMPLE · LOGIN FORM",
              "fontFamily": "Roboto",
              "fontSize": 11,
              "fontWeight": 600,
              "fill": "#7209B7",
              "letterSpacing": 1.5,
              "width": 200,
              "height": 20,
              "children": []
            },
            {
              "type": "frame",
              "id": "ff_login_card",
              "name": "LoginCard",
              "width": 400,
              "fill": "#161b27",
              "cornerRadius": 16,
              "padding": 32,
              "layout": "vertical",
              "gap": 20,
              "stroke": {"align": "inside", "thickness": 1, "fill": "#2a3040"},
              "children": [
                {"type": "text", "id": "ff_login_title", "content": "Войти в аккаунт", "fontFamily": "Roboto", "fontSize": 22, "fontWeight": 700, "fill": "#f4f4f5", "width": 336, "height": 32, "children": []},
                {
                  "type": "frame",
                  "id": "ff_login_email_field",
                  "layout": "vertical",
                  "gap": 6,
                  "children": [
                    {"type": "text", "id": "ff_login_email_lbl", "content": "Email", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": 500, "fill": "#d1d5db", "width": 40, "height": 20, "children": []},
                    {
                      "type": "frame",
                      "id": "ff_login_email_inp",
                      "width": 336,
                      "height": 40,
                      "fill": "#0e131e",
                      "cornerRadius": 8,
                      "padding": [0, 16, 0, 16],
                      "layout": "horizontal",
                      "alignItems": "center",
                      "stroke": {"align": "inside", "thickness": 1, "fill": "#2a3040"},
                      "children": [
                        {"type": "text", "id": "ff_login_email_ph", "content": "your@email.com", "fontFamily": "Roboto", "fontSize": 14, "fill": "#4b5563", "width": 140, "height": 24, "children": []}
                      ]
                    }
                  ]
                },
                {
                  "type": "frame",
                  "id": "ff_login_pass_field",
                  "layout": "vertical",
                  "gap": 6,
                  "children": [
                    {
                      "type": "frame",
                      "id": "ff_login_pass_lbl_row",
                      "layout": "horizontal",
                      "justifyContent": "space-between",
                      "width": 336,
                      "children": [
                        {"type": "text", "id": "ff_login_pass_lbl", "content": "Пароль", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": 500, "fill": "#d1d5db", "width": 60, "height": 20, "children": []},
                        {"type": "text", "id": "ff_login_forgot", "content": "Забыли пароль?", "fontFamily": "Roboto", "fontSize": 13, "fill": "#C77DFF", "width": 110, "height": 20, "children": []}
                      ]
                    },
                    {
                      "type": "frame",
                      "id": "ff_login_pass_inp",
                      "width": 336,
                      "height": 40,
                      "fill": "#0e131e",
                      "cornerRadius": 8,
                      "padding": [0, 16, 0, 16],
                      "layout": "horizontal",
                      "alignItems": "center",
                      "stroke": {"align": "inside", "thickness": 1, "fill": "#2a3040"},
                      "children": [
                        {"type": "text", "id": "ff_login_pass_ph", "content": "••••••••", "fontFamily": "Roboto", "fontSize": 18, "fill": "#4b5563", "width": 100, "height": 24, "children": []}
                      ]
                    }
                  ]
                },
                {
                  "type": "frame",
                  "id": "ff_login_submit_btn",
                  "width": 336,
                  "height": 44,
                  "fill": "#7209B7",
                  "cornerRadius": 8,
                  "layout": "horizontal",
                  "justifyContent": "center",
                  "alignItems": "center",
                  "effect": {"type": "drop-shadow", "color": "rgba(114,9,183,0.4)", "offset": {"x": 0, "y": 4}, "blur": 16},
                  "children": [
                    {"type": "text", "id": "ff_login_submit_txt", "content": "Войти", "fontFamily": "Roboto", "fontSize": 15, "fontWeight": 600, "fill": "#f4f4f5", "width": 46, "height": 24, "children": []}
                  ]
                }
              ]
            }
          ]
        }
      ]
    }
  ]
}