body {
  font-family: Arial, sans-serif;
  background: #f2f2f2;
  padding: 20px;
}

.center {
  text-align: center;
}

input, button {
  padding: 8px;
  margin: 5px;
}

button {
  cursor: pointer;
}

#chat {
  background: white;
  height: 150px;
  overflow-y: auto;
  padding: 5px;
  border: 1px solid #ccc;
  /* ============================= */
/* Avatar Animation */
/* ============================= */

#avatar {
  display: inline-block;
  animation: float 2s ease-in-out infinite;
}

@keyframes float {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-6px); }
  100% { transform: translateY(0); }
}

#avatar:hover {
  transform: scale(1.2) rotate(5deg);
}