*{box-sizing:border-box}body{margin:0;font-family:system-ui;background:#f4f7fb;color:#172033}header{height:64px;padding:0 18px;background:#fff;border-bottom:1px solid #dde6f1;display:flex;align-items:center;gap:18px}header b{font-size:22px}header a{margin-left:auto}.layout{max-width:1100px;margin:18px auto;display:grid;grid-template-columns:290px 1fr;gap:14px;padding:0 12px}.layout>aside,.layout>section,.login{background:#fff;border:1px solid #dde6f1;border-radius:18px;padding:16px}.person{width:100%;padding:12px;margin:4px 0;border:1px solid #dde6f1;background:#fff;border-radius:12px;text-align:left}.layout>section{display:grid;grid-template-rows:auto minmax(320px,1fr) auto auto;gap:10px}#messages{overflow:auto;border:1px solid #edf1f6;border-radius:14px;padding:10px}.msg{max-width:82%;background:#f0f2f5;border-radius:14px;padding:10px;margin:7px 0}.msg small{display:block;color:#687386;margin-top:5px}#send{display:grid;grid-template-columns:1fr auto;gap:8px}textarea,input{width:100%;border:1px solid #ccd8e6;border-radius:12px;padding:12px;font:inherit}button{border:0;border-radius:12px;padding:10px 15px;background:#1268e8;color:#fff;font-weight:700}.login{max-width:440px;margin:10vh auto}.login form{display:grid;gap:12px}.error{color:#b42318;margin:10px 0}@media(max-width:720px){.layout{grid-template-columns:1fr}.layout aside{max-height:180px;overflow:auto}.layout>section{min-height:65vh}}