Ребят, помогите пожалуйста. JS не видит переменную

let prolog3 = [{
    text: "Понятия не имею."
  },
  {
    text: "Что посеешь, то и пожнёшь.",
    by: "novel-message"
  }
]

let cont = [{
    text: "Сообщение после нажатия клавиатуры",
    img: "https://cdn.oneesports.gg/cdn-data/2021/08/GenshinImpact_AnniversaryArt.jpeg"
  },
  {
    text: "А вот сообщение без текста."
  }
]

let novel = [{
    text: "Сообщение 1",
    by: "novel-message",
    anim: "animate__zoomIn"
  },
  {
    text: "Сообщение 2",
    img: "https://static0.gamerantimages.com/wordpress/wp-content/uploads/2022/01/genshin-impact-albedo-painting-at-easel-feature.jpg"
  },
  {
    text: "Сообщение 3",
  },
  {
    text: "Сообщение 4",
    img: "https://www.pockettactics.com/wp-content/uploads/2022/03/genshin-impact-multiplayer-900x506.jpg"
  },
  {
    text: "Сообщение 5",
  },
  {
    img: "https://imgix.kotaku.com.au/content/uploads/sites/3/2021/09/21/151336fd240ee91a2f1863d322ec3d91.jpg?ar=16%3A9&auto=format&fit=crop&q=80&w=1280&nr=20",
  },
  {
    text: "Сообщение 7",
  },
  {
    text: "Сообщение 8",
  },
  {
    text: "Сообщение 9",
  },
  {
    text: "10",
    keyboard: [
      ["Не весело...", prolog3],
      ["Как так произошло?", cont]
    ]
  }
]

let mainCont = document.querySelector('#main')
let main = document.querySelector('.messages')

// Прототипизация
Object.prototype.delay = 0
Object.prototype.keyboard = undefined
Object.prototype.image = undefined
Object.prototype.by = "mind-message"
Object.prototype.anim = "animate__fadeInLeft"
Object.prototype.text = ""

function initKeyboard(keyboard) {
  if (keyboard != undefined) {
    let keyboard_ = document.querySelector('.keyboard')
    keyboard_.innerHTML = "" // очистка тега внутри
    for (kbItem of keyboard) {
      let key_button = document.createElement('div')
      key_button.innerText = kbItem[0]
      key_button.classList.add('key')
      key_button.onclick = () => {
        let message = document.createElement('div')
        message.innerText = key_button.innerText
        console.log(key_button)
        console.log(kbItem)
        novel.push(...kbItem[1])
        message.classList.add('self-message')
        main.appendChild(message)
        keyboard_.innerHTML = ""
      }
      keyboard_.appendChild(key_button)
      main.scrollBy(x = 0, y = 100)
    }
  }
}

function initPic(message) {
  if (novel[i].img != undefined) {
    let img = document.createElement('img')
    img.src = novel[i].img
    img.classList = "animate_animated animate__fadeIn"

    message.appendChild(img)
  }
}

let i = 0

function viewMessages(novel) {
  if (i == novel.length) {
    alert("Игра окончена")
    return true
  }
  let msg = document.createElement('div')
  msg.classList.add(novel[i].by)
  msg.classList.add('animate__animated')
  msg.classList.add(novel[i].anim)
  msg.innerText = novel[i].text

  // Инициализация картинки сообщения
  initPic(msg)
  initKeyboard(novel[i].keyboard)

  main.appendChild(msg)
  i++
}

body {
  display: flex;
  justify-content: center;
  font-family: 'Comic Sans MS';
  font-size: 15px;
}

.messages {
  display: flex;
  flex-direction: column;
}

#main {
  display: flex;
  flex-direction: column-reverse;
  padding: 5px;
  margin: -9px;
  width: 350px;
  height: 500px;
  background-color: #09090c;
  opacity: 1;
  background-image: radial-gradient(#4a4c64 1.55px, #09090c 1.55px);
  background-size: 31px 31px;
  overflow-x: hidden;
  overflow-y: scroll;
}

.not_msgs {
  display: flex;
  justify-content: center;
  color: snow;
  font-size: 20px;
  font-weight: bold;
  text-wrap: wrap;
  text-align: center;
  align-items: center;
  height: 100%;
}

.self-message {
  display: block;
  padding: 5px 10px;
  margin: 5px 0 0 0;
  background: #00B4D8;
  border-radius: 10px 10px 0 10px;
  margin-right: 0;
  margin-left: auto;
  color: snow;
  max-width: 70%;
  transition: .5s;
}

.bot-message {
  display: block;
  padding: 5px 10px;
  margin: 5px 0 0 0;
  background: #8A39E1;
  border-radius: 10px 10px 10px 0;
  margin-left: 0;
  margin-right: auto;
  color: #FFE61B;
  max-width: 70%;
  transition: .5s;
}

.mind-message {
  display: block;
  padding: 5px 10px;
  margin: 5px 0 0 0;
  background: rgba(20, 105, 218, 0.95);
  border-radius: 10px 10px 10px 0;
  margin-left: 0;
  margin-right: auto;
  color: snow;
  max-width: 70%;
  transition: .5s;
}

.novel-message {
  display: block;
  padding: 5px 10px;
  background: rgba(255, 230, 27, .95);
  width: auto;
  color: #8A39E1;
  transition: .5s;
  margin-bottom: 10px;
  border-radius: 10px 0 10px 0;
  font-size: 18px;
  font-style: italic;
  margin-top: 10px;
  font-family: 'Trebuchet MS';
}

.self-message,
.bot-message,
.novel-message,
.mind-message {
  font-weight: bold;
}

img {
  margin: 10px 5px 5px 0px;
  transition: .5s;
  width: 240px;
  border-radius: 5px;
  cursor: pointer;
}

 ::selection {
  color: none;
  background: none;
}


/* Клавиатура */

.keyboard {
  padding: 0 5px;
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.keyboard .key {
  background: transparent;
  color: #8A39E1;
  border: 1px solid #8A39E1;
  border-radius: 5px;
  padding: 5px 10px;
  font-weight: bold;
  cursor: pointer;
  transition: .5s;
  margin: 0 5px;
}

.keyboard .key:hover {
  color: #00B4D8;
  border: 1px solid #00B4D8;
}


/* Скроллбар и кнопки скролла */

 ::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}

 ::-webkit-scrollbar-button {
  width: 0px;
  height: 0px;
}

 ::-webkit-scrollbar-thumb {
  background: #8a39e1;
}

 ::-webkit-scrollbar-track {
  background: #09ecec;
}

 ::-webkit-scrollbar-corner {
  background: transparent;
}

<div id="main" onclick="viewMessages(novel)">
  <div class="keyboard"></div>
  <div class="messages"></div>
</div>