:root { --bg:#f6f7f9; --fg:#14171c; --muted:#5d6672; --card:#fff; --line:#dfe3e8; --acc:#1f5eff; --err:#b42318; --ok:#0f7b45; }
@media (prefers-color-scheme: dark) { :root { --bg:#0f1216; --fg:#e8ebef; --muted:#9aa4b1; --card:#171b21; --line:#2a313a; --acc:#6f98ff; --err:#ff8a7a; --ok:#5fd59a; } }
* { box-sizing: border-box; }
body { margin:0; font:16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; background:var(--bg); color:var(--fg); }
.top { display:flex; gap:.6rem; align-items:center; flex-wrap:wrap; padding:.8rem 1rem; border-bottom:1px solid var(--line); background:var(--card); }
.top nav { margin-left:auto; display:flex; gap:.4rem; flex-wrap:wrap; }
main { max-width:760px; margin:0 auto; padding:1rem; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:1.1rem; margin-bottom:1rem; }
h1 { font-size:1.35rem; margin:0 0 .6rem; } h2 { font-size:1.05rem; margin:1rem 0 .5rem; }
label { display:block; margin:.6rem 0; font-size:.92rem; }
input { display:block; width:100%; margin-top:.25rem; padding:.6rem .7rem; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--fg); font-size:1rem; }
button { padding:.6rem 1rem; border:0; border-radius:8px; background:var(--acc); color:#fff; font-size:.95rem; cursor:pointer; margin-top:.4rem; }
button.link { background:none; color:var(--acc); padding:.3rem .5rem; margin:0; }
button.ghost { background:none; border:1px solid var(--line); color:var(--fg); }
.muted { color:var(--muted); } .small { font-size:.85rem; }
.qr svg { width:220px; height:220px; background:#fff; padding:6px; border-radius:8px; }
.codes { columns:2; font-family:ui-monospace, monospace; }
.actions { display:flex; flex-wrap:wrap; gap:.5rem; }
.result { white-space:pre-wrap; background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:.7rem; font-size:.85rem; overflow:auto; }
.chat { max-height:320px; overflow:auto; display:flex; flex-direction:column; gap:.4rem; margin-bottom:.5rem; }
.chat p { margin:0; padding:.5rem .7rem; border-radius:8px; background:var(--bg); white-space:pre-wrap; overflow-wrap:anywhere; }
.chat p.eu { align-self:flex-end; background:var(--acc); color:#fff; }
.row { display:flex; gap:.5rem; align-items:flex-end; } .row input { flex:1; }
.list { list-style:none; padding:0; margin:0; } .list li { padding:.55rem 0; border-bottom:1px solid var(--line); font-size:.9rem; display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; justify-content:space-between; }
#msg { padding:.6rem .8rem; border-radius:8px; border:1px solid var(--line); background:var(--card); }
#msg.erro { color:var(--err); border-color:var(--err); } #msg.ok { color:var(--ok); }
code { word-break:break-all; }
@media (max-width:520px) { .row { flex-direction:column; align-items:stretch; } .codes { columns:1; } }
.badge { display:inline-block; min-width:1.2rem; padding:0 .35rem; border-radius:999px; background:var(--err); color:#fff; font-size:.75rem; text-align:center; }
.inline { display:flex; gap:.4rem; align-items:center; } .inline input { width:auto; display:inline; margin:0; }
.list a { color:var(--acc); }
select { display:block; margin-top:.25rem; padding:.55rem .6rem; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--fg); font-size:1rem; }
.sev-high { color:var(--err); font-weight:600; } .sev-attention { color:var(--acc); }
#mic.ouvindo { border-color:var(--err); color:var(--err); }
@media (max-width:520px) { button { width:100%; } .top nav button { width:auto; } main { padding:.6rem; } }

/* selo do motor sob a resposta do chat */
.motor { display: block; opacity: .75; font-size: .75em; margin-top: .2em; }
.motor-ia_real { color: #2e9e5b; }
.motor-ia_simulada, .motor-falha { color: #d97706; }
.motor-sem_ia { color: #888; }

/* barra de conversas */
.conversas-barra { margin-bottom: .5rem; align-items: center; } .conversas-barra select { flex: 1; min-width: 0; }
.conversas-barra button:disabled { opacity: .4; cursor: not-allowed; }