
:root{--ink:#16131a;--mute:#5c564f;--paper:#f4f0ff;--cobalt:#4f46e5;--line:#e4dff2}
*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:radial-gradient(circle at top,#ddd6fe,var(--paper));color:var(--ink);min-height:100vh}
.banner{margin:0;padding:.55rem 1rem;text-align:center;font-size:11px;letter-spacing:.06em;text-transform:uppercase;background:var(--ink);color:#f5efe6}
main{max-width:560px;margin:0 auto;padding:2rem 1.25rem 3rem}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cobalt);margin:0 0 .5rem}
h1{font-family:Georgia,serif;margin:0 0 .6rem;font-size:2.1rem}
.lede{color:var(--mute);line-height:1.6;margin:0 0 1.25rem}
.log{background:#fff;border:1px solid var(--line);border-radius:1.1rem;min-height:220px;padding:1rem;display:grid;gap:.75rem;align-content:start}
.msg{padding:.7rem .85rem;border-radius:.85rem;line-height:1.45;font-size:.95rem}
.msg.user{background:#eef2ff;justify-self:end;max-width:85%}
.msg.bot{background:#f8fafc;border:1px solid var(--line);max-width:90%}
.row{display:flex;gap:.5rem;margin-top:1rem}
input{flex:1;border:1px solid var(--line);border-radius:.75rem;padding:.7rem .85rem;font:inherit}
button{border:0;background:var(--cobalt);color:#fff;font:inherit;font-weight:700;padding:.7rem 1rem;border-radius:.75rem;cursor:pointer}
footer{text-align:center;padding:0 1rem 2rem;font-size:.8rem;color:var(--mute)}footer a{color:var(--cobalt)}
