:root { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial; }
body { margin: 0; background:#0b0d10; color:#e8eaf0; }
.wrap { max-width: 980px; margin: 0 auto; padding: 16px; }
.topbar { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; }
h1 { font-size: 18px; margin: 0; }
h2 { font-size: 16px; margin: 0 0 10px 0; }
.muted { color:#a9afbf; font-size: 13px; }
.nav a { color:#d7dcff; text-decoration:none; margin-left:10px; font-size: 14px; }
.card { background:#121621; border:1px solid #232a3a; border-radius:14px; padding:12px; }
.alert { background:#2a1c1c; border:1px solid #6f2a2a; padding:10px; border-radius:12px; margin:10px 0; }
.chat { display:flex; flex-direction:column; gap:12px; }
.messages { display:flex; flex-direction:column; gap:10px; white-space:pre-line; }
.msg { padding:10px 12px; border-radius:14px; max-width: 88%; white-space:pre-line; }
.me { background:#1c2440; align-self:flex-end; border:1px solid #2c3870; }
.bot { background:#121a13; align-self:flex-start; border:1px solid #27412b; }
.composer { display:flex; gap:10px; }
input, button { border-radius:12px; border:1px solid #2a3348; background:#0f1320; color:#e8eaf0; padding:10px 12px; }
input { flex:1; }
button { cursor:pointer; background:#1b2350; }
.grid { display:grid; gap:12px; grid-template-columns: 1fr; }
@media (min-width: 900px) { .grid { grid-template-columns: 1fr 1fr; } }
.tablewrap { overflow:auto; }
table { width:100%; border-collapse:collapse; font-size: 13px; }
th, td { padding:8px; border-bottom:1px solid #232a3a; text-align:left; }
.chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.chip { background:#0f1320; border:1px solid #2a3348; }