:root{
--primary:#dd2292;
--chip:#e8cbfa;
--bg:#f6f6f6;
}
*{box-sizing:border-box}
body{
font-family:"Montserrat",sans-serif;
background:#fff;
margin:0;
padding:0;
color:#333;
}
.chat-container{
width:100%;
max-width:none;
margin:0;
background:#fff;
border-radius:0;
padding:20px;
box-shadow:none;
}
.welcome-screen{
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
min-height:420px;
text-align:center;
}
.welcome-screen h1{font-size:2rem;line-height:1.3;margin:0}
.start-button,.send-button,.topic-button{
font-family:"Montserrat",sans-serif;
}
.start-button{
margin-top:32px;
background:var(--primary);
color:#fff;
border:none;
padding:16px 34px;
border-radius:14px;
font-size:20px;
font-weight:600;
cursor:pointer;
}
.chat-screen{display:none}
.messages{display:flex;flex-direction:column;gap:20px;margin-bottom:24px}
.bot-message{
background:#faf8fc;
padding:18px 20px;
border-radius:18px;
max-width:78%;
}
.user-message{
align-self:flex-end;
background:var(--chip);
padding:12px 18px;
border-radius:18px;
font-weight:600;
}
.topics{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.topic-button{
background:var(--chip);
border:none;
border-radius:14px;
padding:12px 16px;
font-size:15px;
cursor:pointer;
}
.topic-button:disabled{opacity:.45}
.question-label{margin-top:16px}
.chat-list{padding-left:20px;margin:8px 0}
.chat-list li{margin:4px 0}
.question-box{display:flex;gap:12px}
.question-box input{
flex:1;
padding:14px 16px;
font-family:"Montserrat",sans-serif;
border:1px solid #ddd;
border-radius:14px;
}
.send-button{
background:var(--primary);
color:#fff;
border:none;
border-radius:14px;
padding:0 24px;
font-weight:600;
}
.assistant-row{
    display:flex;
    align-items:flex-start;
    gap:14px;
}

.assistant-avatar{
    width:34px;
    height:34px;
    flex-shrink:0;
    margin-top:4px;
}

.bot-message{
    flex:1;
    background:#faf8fc;
    border-radius:18px;
    padding:18px 20px;
}
.assistant-avatar{
    margin-top:16px;
}
.bot-message p {
    margin: 0 0 14px;
}

.bot-message p:last-child {
    margin-bottom: 0;
}

.bot-message ul {
    margin: 12px 0;
    padding-left: 22px;
}

.bot-message li {
    margin: 6px 0;
}
.typing-bubble {
    display: flex;
    align-items: center;
    gap: 6px;
}

.typing-bubble span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #b3b3b3;
    animation: typing 1.2s infinite ease-in-out;
}

.typing-bubble span:nth-child(2) {
    animation-delay: .2s;
}

.typing-bubble span:nth-child(3) {
    animation-delay: .4s;
}

@keyframes typing {

    0%, 80%, 100% {
        transform: scale(.7);
        opacity: .35;
    }

    40% {
        transform: scale(1);
        opacity: 1;
    }

}
.messages{
    display:flex;
    flex-direction:column;
    gap:20px;
    margin-bottom:24px;

    max-height:420px;
    overflow-y:auto;
}