*{box-sizing:border-box}
:root{--app-height:100dvh;--app-top:0px}
html{height:100%;background:#111318}
body{margin:0;position:fixed;left:0;right:0;top:var(--app-top);height:var(--app-height);overflow:hidden;display:flex;flex-direction:column;background:#111318;color:#f5f5f5;font-family:Arial,sans-serif}
header{flex:none;padding:calc(14px + env(safe-area-inset-top)) 16px 14px;border-bottom:1px solid #2d323b;font-size:19px;font-weight:700}
header span{float:right;color:#58d68d;font-size:13px;font-weight:400}
main{flex:1;min-height:0;width:100%;max-width:760px;margin:auto;padding:16px 14px;overflow-y:auto;overscroll-behavior:contain}
.bot,.user{width:fit-content;max-width:88%;padding:12px 14px;margin-bottom:14px;border-radius:18px;line-height:1.5;overflow-wrap:anywhere}
.bot{background:#232832}
.user{margin-left:auto;background:#3a4250}
footer{flex:none;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));border-top:1px solid #2d323b;background:#111318}
input{min-width:0;width:100%;padding:14px;border:1px solid #343b47;border-radius:16px;background:#20242c;color:white;font-size:16px;outline:none}
button{min-height:48px;padding:0 16px;border:0;border-radius:16px;background:white;color:#111318;font-weight:700}