body{
    background-color: #F0FAFF;
    display: flex;
    align-items: center;
    justify-content: center;
    align-content: center;
    flex-direction: column;
    margin: 0;
}
textarea{
    resize: none;
}
.chat_log_section{
    width: 100svw;
    height: calc(100svh - 42px - min(2.75svw, 22px) - min(2.75svw, 22px) - 36px - min(2.5svw,20px) - min(16.5048svw,96px));
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    scrollbar-width: thin;
    align-content: center;
    align-items: center;
    background-color: #F0FAFF;
}
.chat_log{
    width: min(100%,800px);
    display: flex;
    flex-direction: column;
    scrollbar-width: thin;
}
.chat_log_cell{
    display: flex;
}
.me{
    flex-direction: column;
    align-items: flex-end;
}
.me>label{
    color: black;
    font-weight: bold;
    margin: min(1svw,8px);
    margin-right: min(2svw,16px);
}
.me>div{
    max-width: min(62.5svw,500px);
    padding: min(2.75svw,22px);
    border-radius: min(1.25svw,10px);
    background-color: #BBE1FF;
    border: 0px;
    margin-right: min(2svw,16px);
    margin-bottom: min(1svw,8px);
    border-bottom-right-radius: 0px;
}
.ai{
    flex-direction: column;
    align-items: flex-start;
}
.ai>label{
    color: black;
    font-weight: bold;
    margin: min(1svw,8px);
    margin-left: min(2svw,16px);
}
.ai>div{
    max-width: min(62.5svw,500px);
    padding: min(2.75svw,22px);
    border-radius: min(1.25svw,10px);
    background-color: white;
    border: 0px;
    margin-left: min(2svw,16px);
    margin-bottom: min(1svw,8px);
    border-bottom-left-radius: 0px;
}
.ai>div>span:has(img),
.ai>div>span>span:has(img),
.ai>div>span>span>span:has(img),
.ai>div>span>span>span>img{
    width: min(62.5svw,320px);
}