:root{font-family:Inter,ui-sans-serif,system-ui;color:#15353d;background:#f2f7f8}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 10% 10%,#fff 0,#edf5f6 50%,#dcecef 100%)}main{width:min(820px,94vw);height:min(780px,92vh);background:#fff;border:1px solid #d7e5e7;border-radius:24px;box-shadow:0 24px 80px #32616b22;display:grid;grid-template-rows:auto 1fr auto;overflow:hidden}header{padding:22px 26px;display:flex;gap:14px;align-items:center;border-bottom:1px solid #e5eff0}.mark{width:46px;height:46px;border-radius:14px;background:#0f6f7e;color:white;display:grid;place-items:center;font-weight:800;font-size:24px}h1{font-size:20px;margin:0}p{margin:4px 0 0;color:#658088;font-size:14px}header span{margin-left:auto;background:#fff4cc;color:#6f5710;padding:7px 10px;border-radius:99px;font-size:12px}#log{padding:28px;overflow:auto;display:flex;flex-direction:column;gap:12px}.bot,.user{max-width:78%;padding:13px 16px;border-radius:18px;line-height:1.45}.bot{background:#eaf4f5;border-bottom-left-radius:5px}.user{align-self:flex-end;background:#0f6f7e;color:white;border-bottom-right-radius:5px}form{padding:20px 26px;border-top:1px solid #e5eff0}form div{display:flex;gap:10px}label{display:block;font-weight:700;margin-bottom:8px}input{flex:1;padding:14px 16px;border:1px solid #bfd3d7;border-radius:12px;font-size:16px}button{border:0;border-radius:12px;padding:0 22px;background:#0f6f7e;color:white;font-weight:700}small{display:block;margin-top:9px;color:#6b8288}