:root{
  --bg:#f4f7fb;
  --card:#ffffff;
  --accent:#0066cc;
  --muted:#6b7280;
  --success:#0b5a2a;
}
*{box-sizing:border-box}
body{font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:#0f172a;margin:0;padding:24px}
.app{max-width:900px;margin:0 auto}
header{margin-bottom:18px}
h1{margin:0;font-size:24px}
.lead{margin:6px 0 0;color:var(--muted)}
.card{background:var(--card);border-radius:12px;padding:18px;box-shadow:0 8px 28px rgba(12,22,40,0.06);margin-bottom:16px}
.row{display:flex;gap:12px}
label{flex:1;display:block;font-size:13px;color:#111}
input, textarea, select{width:100%;padding:10px;border:1px solid #e6eef6;border-radius:8px;margin-top:6px;font-size:14px;background:#fff}
textarea{min-height:90px;resize:vertical}
.actions{text-align:right;margin-top:12px}
button{background:var(--accent);color:white;padding:10px 14px;border-radius:8px;border:none;cursor:pointer;font-weight:600}
button[disabled]{opacity:0.6;cursor:default}
.hidden{display:none}
.messages{height:360px;overflow:auto;padding:12px;border-radius:8px;border:1px solid #eef2f7;background:#fbfdff}
.msg{max-width:76%;padding:10px;border-radius:10px;margin:8px 0;line-height:1.35}
.msg.bot{background:#eef6ff;color:#032e6b;align-self:flex-start}
.msg.user{background:#e8fff0;color:#03441a;align-self:flex-end;margin-left:auto;text-align:right}
.composer{display:flex;gap:8px;margin-top:12px}
#chatInput{flex:1;padding:10px;border-radius:8px;border:1px solid #e6eef6}
.status{margin-top:8px;color:var(--muted);font-size:13px}
footer{margin-top:10px;color:var(--muted);font-size:12px}