body { font-family: system-ui, Arial; background:#f6f7fb; margin:0; }
.wrap { max-width:720px; margin:0 auto; height:100vh; display:flex; flex-direction:column; }
.header { padding:14px 16px; font-weight:700; background:#fff; border-bottom:1px solid #e8e8ef; }
.chat { flex:1; overflow:auto; padding:16px; display:flex; flex-direction:column; gap:10px; }
.bar { display:flex; gap:10px; padding:12px; background:#fff; border-top:1px solid #e8e8ef; }
input { flex:1; padding:12px; border:1px solid #ddd; border-radius:10px; }
button { padding:12px 14px; border:0; border-radius:10px; cursor:pointer; }
.bubble { padding:10px 12px; border-radius:12px; max-width:80%; white-space:pre-wrap; }
.bubble.user { align-self:flex-end; background:#dfe9ff; }
.bubble.bot { align-self:flex-start; background:#fff; border:1px solid #eee; }