main{
  padding-top: 2cqw;
}

#log{
  border: 0.15cqw solid #ddd;
  border-radius: 1.6cqw;
  height: 58cqw;
  overflow: auto;
  padding: 1.6cqw;
}

.row{ margin: 0.9cqw 0; }
.me{ text-align: right; }

.bubble{
  display: inline-block;
  padding: 1.1cqw 1.3cqw;
  border-radius: 1.6cqw;
  background: #f3f4f6;
  max-width: 80%;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 2cqw;
}
.me .bubble{ background:#dbeafe; }

.meta{
  color:#666;
  font-size: 2cqw;
  margin-top: 0.4cqw;
}

#status{
  margin: 1.2cqw 0;
  color: #444;
  font-size: 2cqw;
  text-align: center;
}

.controls{
  display:flex;
  gap: 1.1cqw;
  margin-top: 1.2cqw;
}

input[type=text]{
  flex: 1;
  padding: 1.2cqw;
  border-radius: 1.3cqw;
  border: 0.15cqw solid #ddd;
  font-size: 2cqw;
}

button{
  padding: 1.2cqw 1.4cqw;
  border-radius: 1.3cqw;
  border: 0.15cqw solid #ddd;
  background:#fff;
  cursor:pointer;
  font-size: 2cqw;
}