#app{max-width:600px;margin:0 auto;padding:20px;font-family:Arial,sans-serif}h1{text-align:center;color:#444}.chat-container{border:1px solid #ccc;border-radius:10px;padding:10px;height:500px;overflow-y:auto;margin-bottom:10px;background-color:#f9f9f9}.message{display:flex;margin-bottom:10px}.message.user{justify-content:flex-end}.message.bot{justify-content:flex-start}.message p{max-width:70%;padding:10px;border-radius:15px;margin:0;word-wrap:break-word}.message.user p{background-color:#0084ff;color:#fff;border-bottom-right-radius:0}.message.bot p{background-color:#e5e5ea;color:#000;border-bottom-left-radius:0}form{display:flex;align-items:center}input[type=text]{flex:1;padding:15px;font-size:16px;border:1px solid #ccc;border-radius:30px;margin-right:10px;outline:none}input[type=text]:focus{border-color:#0084ff}button{padding:12px 20px;font-size:16px;background-color:#0084ff;color:#fff;border:none;border-radius:30px;cursor:pointer}button:hover{background-color:#006bbf}button:focus{outline:none}@media (max-width:600px){#app{padding:10px}.chat-container{height:400px}button,input[type=text]{font-size:14px}button{padding:10px 15px}}