* { box-sizing: border-box; } body { font-family: system-ui, sans-serif; margin: 0; }
.card { max-width: 360px; margin: 10vh auto; padding: 1.5rem; }
.card label { display: block; margin: .75rem 0; } .card input { width: 100%; padding: .5rem; }
.error { color: #b00; }
header { display: flex; justify-content: space-between; padding: .75rem 1rem; background: #f3f3f3; }
.messages { padding: 1rem; max-width: 900px; margin: 0 auto; }
.msg { padding: .4rem .6rem; margin: .3rem 0; border-radius: .4rem; background: #f0f4ff; }
.msg .who { font-weight: 600; margin-right: .4rem; }
#composer { display: flex; gap: .5rem; padding: .75rem 1rem; position: sticky; bottom: 0; background: #fff; }
#composer input { flex: 1; padding: .6rem; } button { padding: .6rem 1rem; }