:root {
    --primary: #2563eb;
    --background: #f3f4f6;
    --card: #ffffff;
    --text: #111827;
    --muted: #6b7280;
    --error: #b91c1c;
  }
  
  body {
    margin:0;
    font-family: 'Inter', sans-serif;
    background: var(--background);
    color: var(--text);
  }
  
  .center-card { display:flex; justify-content:center; align-items:center; height:80vh; }
  .card { background:var(--card); padding:16px; border-radius:12px; box-shadow:0 6px 18px rgba(15,23,42,0.08); width:100%; max-width:400px; }
  .header { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }
  .row { display:flex; gap:8px; }
  .stack { display:flex; flex-direction:column; gap:8px; }
  input { padding:8px; border:1px solid #e5e7eb; border-radius:8px; width:100%; }
  button { background:var(--primary); color:white; border:none; padding:8px 12px; border-radius:8px; cursor:pointer; }
  button[disabled] { opacity:0.5; }
  .chatbox { background:var(--card); padding:12px; border-radius:8px; height:60vh; overflow-y:auto; }
  .msg { padding:8px; border-bottom:1px solid #f3f3f3; }
  .bold { font-weight:600; }
  .muted { color:var(--muted); font-size:13px; }
  .err { color:var(--error); }
  .composer { display:flex; gap:8px; margin-top:8px; }
  .container { max-width:900px; margin:24px auto; padding:16px; }