.ai-layout{
display:flex;
height:640px;
border-radius:18px;
overflow:hidden;
box-shadow:0 20px 60px rgba(0,0,0,.08);
font-family:Arial;
background:#fff;
}

.ai-sidebar{
width:260px;
background:linear-gradient(#fff,#fff2f5);
padding:20px;
}

.ai-avatar{text-align:center}

.ai-avatar img{
width:80px;
border-radius:50%;
}

.ai-btn{
width:100%;
padding:12px;
margin:15px 0;
border:none;
border-radius:12px;
background:#ff4d6d;
color:#fff;
cursor:pointer;
}

.ai-chat{
flex:1;
display:flex;
flex-direction:column;
background:#fafafa;
}

.ai-header{
padding:15px;
background:#fff;
border-bottom:1px solid #eee;
}

.ai-messages{
flex:1;
padding:20px;
overflow:auto;
}

.msg{
background:#fff;
padding:12px;
border-radius:12px;
margin-bottom:10px;
max-width:70%;
}

.msg.user{
background:#ffe3ea;
margin-left:auto;
}

.ai-input{
display:flex;
padding:15px;
background:#fff;
border-top:1px solid #eee;
}

.ai-input input{
flex:1;
padding:12px;
border-radius:20px;
border:1px solid #eee;
}

.ai-input button{
width:40px;
border:none;
border-radius:50%;
background:#ff4d6d;
color:#fff;
margin-left:10px;
}