{
  "id": "mod_color_echo",
  "type": "module",
  "version": "1.1",
  "context": {
    "layout": "phone",
    "title": "Ехо кольорів",
    "icon": "🎨"
  },
  "state": {
    "level": 0,
    "board": [
      2,
      0,
      0,
      0,
      1,
      1,
      0,
      1,
      0
    ],
    "initialBoard": [
      2,
      0,
      0,
      0,
      1,
      1,
      0,
      1,
      0
    ],
    "history": [],
    "moves": 0,
    "solved": false,
    "bestMoves": [
      0,
      0,
      0,
      0,
      0
    ],
    "showRestartAlert": false,
    "errorMessage": ""
  },
  "dependencies": [
    {
      "repository": {
        "local": {
          "id": "color_echo_progress_v1",
          "config": {}
        }
      }
    },
    {
      "service": {
        "audio": {
          "id": "color_echo_audio"
        }
      }
    }
  ],
  "children": [
    {
      "id": "echo_root",
      "type": "vstack",
      "context": {
        "_spacing": 16,
        "_alignment": "center"
      },
      "style": {
        "layout": {
          "maxWidth": "infinity",
          "maxHeight": "infinity",
          "padding": {
            "top": 14,
            "bottom": 18,
            "leading": 16,
            "trailing": 16
          }
        },
        "common": {
          "background": {
            "gradient": {
              "linear": {
                "colors": [
                  {
                    "light": "#E8F1EC",
                    "dark": "#101714"
                  },
                  {
                    "light": "#DDEAE3",
                    "dark": "#17221D"
                  }
                ],
                "startPoint": "top",
                "endPoint": "bottom"
              }
            }
          }
        },
        "modal": {
          "alert": {
            "isPresented": "${showRestartAlert}",
            "title": "Перезапустити рівень?",
            "message": "Поле та лічильник ходів повернуться до початкового стану.",
            "actions": [
              {
                "id": "echo_restart_confirm_button",
                "type": "button",
                "context": {
                  "_label": "Перезапустити"
                },
                "events": {
                  "onTap": [
                    {
                      "state": {
                        "id": "echo_restart_confirm_action",
                        "input": {
                          "board": "${initialBoard}",
                          "history": [],
                          "moves": 0,
                          "solved": false,
                          "showRestartAlert": false
                        }
                      }
                    },
                    {
                      "service": {
                        "id": "echo_restart_haptic",
                        "input": {
                          "serviceId": "color_echo_audio",
                          "params": {
                            "sound": "none",
                            "haptic": "medium"
                          }
                        }
                      }
                    }
                  ]
                }
              },
              {
                "id": "echo_restart_cancel_button",
                "type": "button",
                "context": {
                  "_label": "Залишити гру"
                },
                "events": {
                  "onTap": [
                    {
                      "state": {
                        "id": "echo_restart_cancel_action",
                        "input": {
                          "showRestartAlert": false
                        }
                      }
                    }
                  ]
                }
              }
            ]
          }
        }
      },
      "children": [
        {
          "id": "echo_game_or_result",
          "type": "conditional",
          "context": {
            "_condition": "${solved}",
            "_trueComponent": {
              "id": "echo_result_screen",
              "type": "vstack",
              "context": {
                "_spacing": 20,
                "_alignment": "center"
              },
              "style": {
                "layout": {
                  "maxWidth": "infinity",
                  "maxHeight": "infinity"
                }
              },
              "children": [
                {
                  "id": "echo_result_hero",
                  "type": "vstack",
                  "context": {
                    "_spacing": 12,
                    "_alignment": "center"
                  },
                  "style": {
                    "layout": {
                      "maxWidth": "infinity",
                      "padding": {
                        "top": 24,
                        "bottom": 24,
                        "leading": 20,
                        "trailing": 20
                      }
                    },
                    "common": {
                      "background": {
                        "gradient": {
                          "linear": {
                            "colors": [
                              "#315E4A",
                              "#568F70"
                            ],
                            "startPoint": "topLeading",
                            "endPoint": "bottomTrailing"
                          }
                        }
                      },
                      "foreground": "white",
                      "cornerRadius": 24
                    },
                    "shadow": {
                      "color": {
                        "color": "black",
                        "opacity": 0.24
                      },
                      "radius": 14,
                      "y": 8
                    },
                    "animation": {
                      "kind": "spring",
                      "value": "${solved}",
                      "duration": 0.5,
                      "bounce": 0.35
                    }
                  },
                  "children": [
                    {
                      "id": "echo_result_icon",
                      "type": "image",
                      "context": {
                        "_source": "sf://checkmark.seal.fill"
                      },
                      "style": {
                        "layout": {
                          "width": 58,
                          "height": 58
                        },
                        "common": {
                          "foreground": "white"
                        }
                      }
                    },
                    {
                      "id": "echo_result_status",
                      "type": "text",
                      "context": {
                        "_text": "Рівень розв’язано"
                      },
                      "style": {
                        "common": {
                          "font": {
                            "kind": "title2",
                            "weight": "bold"
                          },
                          "foreground": "white"
                        }
                      }
                    },
                    {
                      "id": "echo_result_level",
                      "type": "text",
                      "context": {
                        "_text": "{{ 'Головоломка ' + cast(${level} + 1, 'str') + ' із 5' }}"
                      },
                      "style": {
                        "common": {
                          "font": "subheadline",
                          "foreground": {
                            "color": "white",
                            "opacity": 0.8
                          }
                        }
                      }
                    }
                  ]
                },
                {
                  "id": "echo_result_stats",
                  "type": "hstack",
                  "context": {
                    "_spacing": 12,
                    "_alignment": "center"
                  },
                  "style": {
                    "layout": {
                      "maxWidth": "infinity"
                    }
                  },
                  "children": [
                    {
                      "id": "echo_result_moves_card",
                      "type": "vstack",
                      "context": {
                        "_spacing": 6,
                        "_alignment": "center"
                      },
                      "style": {
                        "layout": {
                          "maxWidth": "infinity",
                          "padding": 18
                        },
                        "common": {
                          "background": {
                            "color": "surface"
                          },
                          "foreground": {
                            "color": "onSurface"
                          },
                          "cornerRadius": 18
                        },
                        "shadow": {
                          "color": {
                            "color": "black",
                            "opacity": 0.12
                          },
                          "radius": 8,
                          "y": 4
                        }
                      },
                      "children": [
                        {
                          "id": "echo_result_moves_icon",
                          "type": "image",
                          "context": {
                            "_source": "sf://hand.tap.fill"
                          },
                          "style": {
                            "layout": {
                              "width": 22,
                              "height": 22
                            },
                            "common": {
                              "foreground": "#568F70"
                            }
                          }
                        },
                        {
                          "id": "echo_result_moves_value",
                          "type": "text",
                          "context": {
                            "_text": "${moves}"
                          },
                          "style": {
                            "common": {
                              "font": {
                                "kind": "largeTitle",
                                "weight": "bold"
                              },
                              "foreground": {
                                "color": "onSurface"
                              }
                            }
                          }
                        },
                        {
                          "id": "echo_result_moves_label",
                          "type": "text",
                          "context": {
                            "_text": "ходів"
                          },
                          "style": {
                            "common": {
                              "font": "caption",
                              "foreground": {
                                "color": "onSurfaceVariant"
                              }
                            }
                          }
                        }
                      ]
                    },
                    {
                      "id": "echo_result_best_card",
                      "type": "vstack",
                      "context": {
                        "_spacing": 6,
                        "_alignment": "center"
                      },
                      "style": {
                        "layout": {
                          "maxWidth": "infinity",
                          "padding": 18
                        },
                        "common": {
                          "background": {
                            "color": "surface"
                          },
                          "foreground": {
                            "color": "onSurface"
                          },
                          "cornerRadius": 18
                        },
                        "shadow": {
                          "color": {
                            "color": "black",
                            "opacity": 0.12
                          },
                          "radius": 8,
                          "y": 4
                        }
                      },
                      "children": [
                        {
                          "id": "echo_result_best_icon",
                          "type": "image",
                          "context": {
                            "_source": "sf://crown.fill"
                          },
                          "style": {
                            "layout": {
                              "width": 22,
                              "height": 22
                            },
                            "common": {
                              "foreground": "#D49B35"
                            }
                          }
                        },
                        {
                          "id": "echo_result_best_value",
                          "type": "text",
                          "context": {
                            "_text": "${bestMoves[${level}]}"
                          },
                          "style": {
                            "common": {
                              "font": {
                                "kind": "largeTitle",
                                "weight": "bold"
                              },
                              "foreground": {
                                "color": "onSurface"
                              }
                            }
                          }
                        },
                        {
                          "id": "echo_result_best_label",
                          "type": "text",
                          "context": {
                            "_text": "найкраще"
                          },
                          "style": {
                            "common": {
                              "font": "caption",
                              "foreground": {
                                "color": "onSurfaceVariant"
                              }
                            }
                          }
                        }
                      ]
                    }
                  ]
                },
                {
                  "id": "echo_result_note",
                  "type": "text",
                  "context": {
                    "_text": "{{ ${moves} == ${bestMoves[${level}]} ? 'Це ваш найкращий результат на цьому рівні.' : 'Спробуйте ще раз, щоб скоротити шлях.' }}"
                  },
                  "style": {
                    "common": {
                      "font": "subheadline",
                      "foreground": {
                        "color": "secondary"
                      }
                    },
                    "text": {
                      "multilineTextAlignment": "center"
                    }
                  }
                },
                {
                  "id": "echo_result_spacer",
                  "type": "spacer"
                },
                {
                  "id": "echo_next_button",
                  "type": "button",
                  "context": {
                    "_label": "{{ ${level} < 4 ? 'Наступна головоломка' : 'Почати цикл спочатку' }}",
                    "_image": "{{ ${level} < 4 ? 'sf://arrow.right.circle.fill' : 'sf://arrow.counterclockwise.circle.fill' }}"
                  },
                  "style": {
                    "button": {
                      "standard": {
                        "type": "borderedProminent",
                        "shape": "capsule"
                      }
                    },
                    "layout": {
                      "maxWidth": "infinity",
                      "minHeight": 50
                    }
                  },
                  "events": {
                    "onTap": [
                      {
                        "state": {
                          "id": "echo_next_level_action",
                          "input": {
                            "level": "{{ ${level} < 4 ? ${level} + 1 : 0 }}",
                            "board": "{{ switch(${level} == 0, [1,1,1,0,0,0,2,2,2], ${level} == 1, [1,1,2,2,1,0,1,1,2], ${level} == 2, [1,0,2,0,0,0,2,0,1], ${level} == 3, [1,1,0,1,0,2,0,2,2], [2,0,0,0,1,1,0,1,0]) }}",
                            "initialBoard": "{{ switch(${level} == 0, [1,1,1,0,0,0,2,2,2], ${level} == 1, [1,1,2,2,1,0,1,1,2], ${level} == 2, [1,0,2,0,0,0,2,0,1], ${level} == 3, [1,1,0,1,0,2,0,2,2], [2,0,0,0,1,1,0,1,0]) }}",
                            "history": [],
                            "moves": 0,
                            "solved": false
                          }
                        }
                      },
                      {
                        "service": {
                          "id": "echo_next_haptic",
                          "input": {
                            "serviceId": "color_echo_audio",
                            "params": {
                              "sound": "none",
                              "haptic": "light"
                            }
                          }
                        }
                      }
                    ]
                  }
                },
                {
                  "id": "echo_replay_button",
                  "type": "button",
                  "context": {
                    "_label": "Повторити цей рівень",
                    "_image": "sf://arrow.counterclockwise"
                  },
                  "style": {
                    "button": {
                      "standard": {
                        "type": "bordered",
                        "shape": "capsule"
                      }
                    },
                    "layout": {
                      "maxWidth": "infinity",
                      "minHeight": 46
                    }
                  },
                  "events": {
                    "onTap": [
                      {
                        "state": {
                          "id": "echo_replay_action",
                          "input": {
                            "board": "${initialBoard}",
                            "history": [],
                            "moves": 0,
                            "solved": false
                          }
                        }
                      }
                    ]
                  }
                }
              ]
            },
            "_falseComponent": {
              "id": "echo_game_screen",
              "type": "vstack",
              "context": {
                "_spacing": 16,
                "_alignment": "center"
              },
              "style": {
                "layout": {
                  "maxWidth": "infinity",
                  "maxHeight": "infinity"
                }
              },
              "children": [
                {
                  "id": "echo_error_message",
                  "type": "text",
                  "context": {
                    "_text": "${errorMessage}"
                  },
                  "style": {
                    "layout": {
                      "maxWidth": "infinity"
                    },
                    "common": {
                      "font": "caption",
                      "foreground": {
                        "color": "red"
                      }
                    },
                    "text": {
                      "multilineTextAlignment": "center"
                    }
                  }
                },
                {
                  "id": "echo_instruction_card",
                  "type": "hstack",
                  "context": {
                    "_spacing": 12,
                    "_alignment": "center"
                  },
                  "style": {
                    "layout": {
                      "maxWidth": "infinity",
                      "padding": 16
                    },
                    "common": {
                      "background": {
                        "material": "regular"
                      },
                      "foreground": {
                        "color": "primary"
                      },
                      "cornerRadius": 18
                    },
                    "shadow": {
                      "color": {
                        "color": "black",
                        "opacity": 0.12
                      },
                      "radius": 8,
                      "y": 4
                    }
                  },
                  "children": [
                    {
                      "id": "echo_instruction_icon",
                      "type": "image",
                      "context": {
                        "_source": "sf://wave.3.right.circle.fill"
                      },
                      "style": {
                        "layout": {
                          "width": 34,
                          "height": 34
                        },
                        "common": {
                          "foreground": "#568F70"
                        }
                      }
                    },
                    {
                      "id": "echo_instruction_texts",
                      "type": "vstack",
                      "context": {
                        "_spacing": 3,
                        "_alignment": "leading"
                      },
                      "style": {
                        "layout": {
                          "maxWidth": "infinity"
                        }
                      },
                      "children": [
                        {
                          "id": "echo_instruction_heading",
                          "type": "text",
                          "context": {
                            "_text": "Зрівняйте всі дев’ять клітинок"
                          },
                          "style": {
                            "common": {
                              "font": "headline",
                              "foreground": {
                                "color": "primary"
                              }
                            }
                          }
                        },
                        {
                          "id": "echo_instruction_detail",
                          "type": "text",
                          "context": {
                            "_text": "Дотик перемикає клітинку та її сусідів зверху, знизу, ліворуч і праворуч."
                          },
                          "style": {
                            "common": {
                              "font": "caption",
                              "foreground": {
                                "color": "secondary"
                              }
                            },
                            "text": {
                              "lineSpacing": 2
                            }
                          }
                        }
                      ]
                    }
                  ]
                },
                {
                  "id": "echo_status_row",
                  "type": "hstack",
                  "context": {
                    "_spacing": 10,
                    "_alignment": "center"
                  },
                  "style": {
                    "layout": {
                      "maxWidth": "infinity"
                    }
                  },
                  "children": [
                    {
                      "id": "echo_level_chip",
                      "type": "label",
                      "context": {
                        "_title": "{{ 'Рівень ' + cast(${level} + 1, 'str') + ' / 5' }}",
                        "_image": "sf://square.grid.3x3.fill"
                      },
                      "style": {
                        "layout": {
                          "padding": {
                            "top": 9,
                            "bottom": 9,
                            "leading": 12,
                            "trailing": 12
                          }
                        },
                        "common": {
                          "background": {
                            "material": "ultraThin"
                          },
                          "foreground": {
                            "color": "primary"
                          },
                          "cornerRadius": 16,
                          "font": "subheadline"
                        }
                      }
                    },
                    {
                      "id": "echo_status_spacer",
                      "type": "spacer"
                    },
                    {
                      "id": "echo_moves_chip",
                      "type": "label",
                      "context": {
                        "_title": "{{ 'Ходи: ' + cast(${moves}, 'str') }}",
                        "_image": "sf://hand.tap.fill"
                      },
                      "style": {
                        "layout": {
                          "padding": {
                            "top": 9,
                            "bottom": 9,
                            "leading": 12,
                            "trailing": 12
                          }
                        },
                        "common": {
                          "background": {
                            "material": "ultraThin"
                          },
                          "foreground": {
                            "color": "primary"
                          },
                          "cornerRadius": 16,
                          "font": "subheadline"
                        },
                        "animation": {
                          "kind": "spring",
                          "value": "${moves}",
                          "duration": 0.3,
                          "bounce": 0.25
                        }
                      }
                    }
                  ]
                },
                {
                  "id": "echo_target_card",
                  "type": "hstack",
                  "context": {
                    "_spacing": 10,
                    "_alignment": "center"
                  },
                  "style": {
                    "layout": {
                      "maxWidth": "infinity",
                      "padding": {
                        "top": 10,
                        "bottom": 10,
                        "leading": 14,
                        "trailing": 14
                      }
                    },
                    "common": {
                      "background": {
                        "color": "surfaceVariant"
                      },
                      "foreground": {
                        "color": "onSurfaceVariant"
                      },
                      "cornerRadius": 16
                    }
                  },
                  "children": [
                    {
                      "id": "echo_target_swatch",
                      "type": "roundedrectangle",
                      "style": {
                        "layout": {
                          "width": 28,
                          "height": 28
                        },
                        "shape": {
                          "fill": "#568F70"
                        }
                      }
                    },
                    {
                      "id": "echo_target_text",
                      "type": "text",
                      "context": {
                        "_text": "Ціль: зробіть усе поле зеленим"
                      },
                      "style": {
                        "common": {
                          "font": {
                            "kind": "subheadline",
                            "weight": "semibold"
                          },
                          "foreground": {
                            "color": "onSurfaceVariant"
                          }
                        }
                      }
                    },
                    {
                      "id": "echo_target_spacer",
                      "type": "spacer"
                    }
                  ]
                },
                {
                  "id": "echo_board_card",
                  "type": "vstack",
                  "context": {
                    "_spacing": 10,
                    "_alignment": "center"
                  },
                  "style": {
                    "layout": {
                      "maxWidth": "infinity",
                      "padding": 14
                    },
                    "common": {
                      "background": {
                        "material": "regular"
                      },
                      "foreground": {
                        "color": "primary"
                      },
                      "cornerRadius": 24
                    },
                    "shadow": {
                      "color": {
                        "color": "black",
                        "opacity": 0.2
                      },
                      "radius": 14,
                      "y": 8
                    }
                  },
                  "children": [
                    {
                      "id": "echo_board_grid",
                      "type": "grid",
                      "context": {
                        "_gridType": "lazyVGrid",
                        "_spacing": 8
                      },
                      "style": {
                        "layout": {
                          "maxWidth": "infinity"
                        },
                        "grid": {
                          "columns": [
                            {
                              "kind": "flexible",
                              "minimum": 72,
                              "maximum": 110,
                              "spacing": 8
                            },
                            {
                              "kind": "flexible",
                              "minimum": 72,
                              "maximum": 110,
                              "spacing": 8
                            },
                            {
                              "kind": "flexible",
                              "minimum": 72,
                              "maximum": 110,
                              "spacing": 8
                            }
                          ]
                        }
                      },
                      "children": [
                        {
                          "id": "echo_cells_dynamic",
                          "type": "dynamic",
                          "context": {
                            "_data": "${board}"
                          },
                          "prototype": {
                            "id": "echo_cell_button",
                            "type": "button",
                            "context": {
                              "_label": "",
                              "cellIndex": "@{index}",
                              "cellValue": "@{item}",
                              "cellRow": "{{ cast(@{index} / 3, 'int') }}",
                              "cellCol": "{{ @{index} % 3 }}",
                              "afterSelf": "{{ setAt(${board}, @{cellIndex}, (${board[@{cellIndex}]} + 1) % 3) }}",
                              "afterLeft": "{{ @{cellCol} > 0 ? setAt(@{afterSelf}, @{cellIndex} - 1, (${board[@{cellIndex} - 1]} + 1) % 3) : @{afterSelf} }}",
                              "afterRight": "{{ @{cellCol} < 2 ? setAt(@{afterLeft}, @{cellIndex} + 1, (${board[@{cellIndex} + 1]} + 1) % 3) : @{afterLeft} }}",
                              "afterUp": "{{ @{cellRow} > 0 ? setAt(@{afterRight}, @{cellIndex} - 3, (${board[@{cellIndex} - 3]} + 1) % 3) : @{afterRight} }}",
                              "nextBoard": "{{ @{cellRow} < 2 ? setAt(@{afterUp}, @{cellIndex} + 3, (${board[@{cellIndex} + 3]} + 1) % 3) : @{afterUp} }}"
                            },
                            "style": {
                              "layout": {
                                "maxWidth": "infinity",
                                "height": 76
                              },
                              "button": {
                                "custom": {
                                  "layout": {
                                    "maxWidth": "infinity",
                                    "height": 76
                                  },
                                  "common": {
                                    "background": "{{ switch(@{cellValue} == 0, '#568F70', @{cellValue} == 1, '#D08A55', '#65558F') }}",
                                    "foreground": "white",
                                    "cornerRadius": 18
                                  }
                                }
                              },
                              "common": {
                                "scale": "{{ ${moves} > 0 ? 1.0 : 0.98 }}"
                              },
                              "shadow": {
                                "color": {
                                  "color": "black",
                                  "opacity": 0.18
                                },
                                "radius": 5,
                                "y": 3
                              },
                              "animation": {
                                "kind": "spring",
                                "value": "@{cellValue}",
                                "duration": 0.3,
                                "bounce": 0.4
                              }
                            },
                            "children": [
                              {
                                "id": "echo_cell_symbol",
                                "type": "image",
                                "context": {
                                  "_source": "{{ switch(@{cellValue} == 0, 'sf://leaf.fill', @{cellValue} == 1, 'sf://sun.max.fill', 'sf://sparkles') }}"
                                },
                                "style": {
                                  "layout": {
                                    "width": 28,
                                    "height": 28
                                  },
                                  "common": {
                                    "foreground": "white"
                                  }
                                }
                              }
                            ],
                            "events": {
                              "onTap": [
                                {
                                  "state": {
                                    "id": "echo_apply_move",
                                    "input": {
                                      "history": "{{ ${history} + [${board}] }}",
                                      "board": "{{ switch(@{index} == 0, setAt(setAt(setAt(${board}, 0, (${board[0]} + 1) % 3), 1, (${board[1]} + 1) % 3), 3, (${board[3]} + 1) % 3), @{index} == 1, setAt(setAt(setAt(setAt(${board}, 1, (${board[1]} + 1) % 3), 0, (${board[0]} + 1) % 3), 2, (${board[2]} + 1) % 3), 4, (${board[4]} + 1) % 3), @{index} == 2, setAt(setAt(setAt(${board}, 2, (${board[2]} + 1) % 3), 1, (${board[1]} + 1) % 3), 5, (${board[5]} + 1) % 3), @{index} == 3, setAt(setAt(setAt(setAt(${board}, 3, (${board[3]} + 1) % 3), 0, (${board[0]} + 1) % 3), 4, (${board[4]} + 1) % 3), 6, (${board[6]} + 1) % 3), @{index} == 4, setAt(setAt(setAt(setAt(setAt(${board}, 4, (${board[4]} + 1) % 3), 1, (${board[1]} + 1) % 3), 3, (${board[3]} + 1) % 3), 5, (${board[5]} + 1) % 3), 7, (${board[7]} + 1) % 3), @{index} == 5, setAt(setAt(setAt(setAt(${board}, 5, (${board[5]} + 1) % 3), 2, (${board[2]} + 1) % 3), 4, (${board[4]} + 1) % 3), 8, (${board[8]} + 1) % 3), @{index} == 6, setAt(setAt(setAt(${board}, 6, (${board[6]} + 1) % 3), 3, (${board[3]} + 1) % 3), 7, (${board[7]} + 1) % 3), @{index} == 7, setAt(setAt(setAt(setAt(${board}, 7, (${board[7]} + 1) % 3), 4, (${board[4]} + 1) % 3), 6, (${board[6]} + 1) % 3), 8, (${board[8]} + 1) % 3), setAt(setAt(setAt(${board}, 8, (${board[8]} + 1) % 3), 5, (${board[5]} + 1) % 3), 7, (${board[7]} + 1) % 3)) }}",
                                      "moves": "{{ ${moves} + 1 }}"
                                    }
                                  }
                                },
                                {
                                  "service": {
                                    "id": "echo_cell_haptic",
                                    "input": {
                                      "serviceId": "color_echo_audio",
                                      "params": {
                                        "sound": "keyPress",
                                        "haptic": "light"
                                      }
                                    }
                                  }
                                }
                              ]
                            }
                          }
                        }
                      ]
                    },
                    {
                      "id": "echo_cycle_legend",
                      "type": "hstack",
                      "context": {
                        "_spacing": 8,
                        "_alignment": "center"
                      },
                      "children": [
                        {
                          "id": "echo_legend_green",
                          "type": "text",
                          "context": {
                            "_text": "зелений"
                          },
                          "style": {
                            "layout": {
                              "padding": {
                                "top": 5,
                                "bottom": 5,
                                "leading": 8,
                                "trailing": 8
                              }
                            },
                            "common": {
                              "background": "#568F70",
                              "foreground": "white",
                              "cornerRadius": 10,
                              "font": "caption"
                            }
                          }
                        },
                        {
                          "id": "echo_legend_arrow_one",
                          "type": "image",
                          "context": {
                            "_source": "sf://chevron.right"
                          },
                          "style": {
                            "layout": {
                              "width": 10,
                              "height": 10
                            },
                            "common": {
                              "foreground": {
                                "color": "secondary"
                              }
                            }
                          }
                        },
                        {
                          "id": "echo_legend_orange",
                          "type": "text",
                          "context": {
                            "_text": "бурштин"
                          },
                          "style": {
                            "layout": {
                              "padding": {
                                "top": 5,
                                "bottom": 5,
                                "leading": 8,
                                "trailing": 8
                              }
                            },
                            "common": {
                              "background": "#D08A55",
                              "foreground": "white",
                              "cornerRadius": 10,
                              "font": "caption"
                            }
                          }
                        },
                        {
                          "id": "echo_legend_arrow_two",
                          "type": "image",
                          "context": {
                            "_source": "sf://chevron.right"
                          },
                          "style": {
                            "layout": {
                              "width": 10,
                              "height": 10
                            },
                            "common": {
                              "foreground": {
                                "color": "secondary"
                              }
                            }
                          }
                        },
                        {
                          "id": "echo_legend_purple",
                          "type": "text",
                          "context": {
                            "_text": "фіолет"
                          },
                          "style": {
                            "layout": {
                              "padding": {
                                "top": 5,
                                "bottom": 5,
                                "leading": 8,
                                "trailing": 8
                              }
                            },
                            "common": {
                              "background": "#65558F",
                              "foreground": "white",
                              "cornerRadius": 10,
                              "font": "caption"
                            }
                          }
                        }
                      ]
                    }
                  ]
                },
                {
                  "id": "echo_game_spacer",
                  "type": "spacer"
                },
                {
                  "id": "echo_controls",
                  "type": "hstack",
                  "context": {
                    "_spacing": 12,
                    "_alignment": "center"
                  },
                  "style": {
                    "layout": {
                      "maxWidth": "infinity"
                    }
                  },
                  "children": [
                    {
                      "id": "echo_undo_button",
                      "type": "button",
                      "context": {
                        "_label": "{{ empty(${history}) ? 'Немає ходу' : 'Скасувати' }}",
                        "_image": "sf://arrow.uturn.backward"
                      },
                      "style": {
                        "layout": {
                          "maxWidth": "infinity",
                          "minHeight": 48
                        },
                        "button": {
                          "standard": {
                            "type": "bordered",
                            "shape": "capsule"
                          }
                        },
                        "common": {
                          "disabled": "{{ empty(${history}) }}",
                          "opacity": "{{ empty(${history}) ? 0.5 : 1.0 }}"
                        }
                      },
                      "events": {
                        "onTap": [
                          {
                            "condition": {
                              "id": "echo_undo_guard",
                              "input": "{{ notEmpty(${history}) }}",
                              "output": {
                                "success": [
                                  {
                                    "state": {
                                      "id": "echo_undo_action",
                                      "input": {
                                        "board": "{{ last(${history}) }}",
                                        "history": "{{ removeAt(${history}, -1) }}",
                                        "moves": "{{ ${moves} > 0 ? ${moves} - 1 : 0 }}",
                                        "solved": false
                                      }
                                    }
                                  },
                                  {
                                    "service": {
                                      "id": "echo_undo_haptic",
                                      "input": {
                                        "serviceId": "color_echo_audio",
                                        "params": {
                                          "sound": "none",
                                          "haptic": "light"
                                        }
                                      }
                                    }
                                  }
                                ]
                              }
                            }
                          }
                        ]
                      }
                    },
                    {
                      "id": "echo_restart_button",
                      "type": "button",
                      "context": {
                        "_label": "Перезапуск",
                        "_image": "sf://arrow.counterclockwise"
                      },
                      "style": {
                        "layout": {
                          "maxWidth": "infinity",
                          "minHeight": 48
                        },
                        "button": {
                          "standard": {
                            "type": "bordered",
                            "shape": "capsule"
                          }
                        }
                      },
                      "events": {
                        "onTap": [
                          {
                            "state": {
                              "id": "echo_open_restart_alert",
                              "input": {
                                "showRestartAlert": true
                              }
                            }
                          }
                        ]
                      }
                    }
                  ]
                }
              ]
            }
          }
        }
      ],
      "events": {
        "onChange": {
          "observed": "board",
          "actions": [
            {
              "condition": {
                "id": "echo_win_guard",
                "input": "{{ !${solved} && ${moves} > 0 && ${board[0]} == 0 && ${board[1]} == 0 && ${board[2]} == 0 && ${board[3]} == 0 && ${board[4]} == 0 && ${board[5]} == 0 && ${board[6]} == 0 && ${board[7]} == 0 && ${board[8]} == 0 }}",
                "output": {
                  "success": [
                    {
                      "state": {
                        "id": "echo_record_win",
                        "input": {
                          "solved": true,
                          "bestMoves": "{{ setAt(${bestMoves}, ${level}, ${bestMoves[${level}]} == 0 || ${moves} < ${bestMoves[${level}]} ? ${moves} : ${bestMoves[${level}]}) }}"
                        },
                        "output": {
                          "success": [
                            {
                              "repo": {
                                "id": "echo_save_bests",
                                "input": {
                                  "repositoryId": "color_echo_progress_v1",
                                  "operation": "create",
                                  "params": {
                                    "collection": "progress",
                                    "documentId": "best_moves",
                                    "rewrite": true,
                                    "body": {
                                      "bestMoves": "${bestMoves}"
                                    }
                                  }
                                },
                                "output": {
                                  "failure": [
                                    {
                                      "state": {
                                        "id": "echo_save_bests_failure",
                                        "input": {
                                          "solved": false,
                                          "errorMessage": "Не вдалося зберегти найкращий результат. Спробуйте ще раз."
                                        }
                                      }
                                    }
                                  ]
                                }
                              }
                            },
                            {
                              "service": {
                                "id": "echo_win_haptic",
                                "input": {
                                  "serviceId": "color_echo_audio",
                                  "params": {
                                    "sound": "unlock",
                                    "haptic": "success"
                                  }
                                },
                                "output": {
                                  "failure": [
                                    {
                                      "state": {
                                        "id": "echo_win_haptic_failure",
                                        "input": {
                                          "solved": false,
                                          "errorMessage": "Не вдалося відтворити сигнал перемоги. Спробуйте ще раз."
                                        }
                                      }
                                    }
                                  ]
                                }
                              }
                            }
                          ]
                        }
                      }
                    }
                  ]
                }
              }
            }
          ]
        }
      }
    }
  ],
  "events": {
    "onAppear": [
      {
        "repo": {
          "id": "echo_load_progress",
          "input": {
            "repositoryId": "color_echo_progress_v1",
            "operation": "read",
            "params": {
              "collection": "progress",
              "documentId": "best_moves"
            }
          },
          "output": {
            "success": [
              {
                "state": {
                  "id": "echo_restore_progress",
                  "input": {
                    "bestMoves": "@{echo_load_progress.bestMoves}"
                  }
                }
              }
            ],
            "failure": []
          }
        }
      }
    ]
  }
}