/* Painel de operação: legível em celular, porque é de lá que se apaga incêndio. */
:root{--fundo:#0e1116;--caixa:#171b22;--linha:#252b35;--txt:#e6e9ef;--fraco:#8b94a3;
--verde:#2ea043;--vermelho:#e5534b;--amarelo:#d29922;--azul:#4493f8}
*{box-sizing:border-box}
body{margin:0;background:var(--fundo);color:var(--txt);
font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
a{color:var(--azul);text-decoration:none}
header{background:var(--caixa);border-bottom:1px solid var(--linha);padding:.7rem 1rem;
position:sticky;top:0;z-index:9;display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
header .marca{font-weight:700;margin-right:.5rem}
header nav a{color:var(--fraco);padding:.3rem .1rem;white-space:nowrap}
header nav a.on,header nav a:hover{color:var(--txt)}
header nav{display:flex;gap:1rem;flex-wrap:wrap;flex:1}
main{padding:1rem;max-width:900px;margin:0 auto}
h1{font-size:1.2rem;margin:.2rem 0 1rem}
h2{font-size:1rem;margin:1.5rem 0 .6rem;color:var(--fraco);font-weight:600}
.cartoes{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.7rem}
.cartao{background:var(--caixa);border:1px solid var(--linha);border-radius:10px;padding:.8rem}
.cartao .n{font-size:1.6rem;font-weight:700;line-height:1.1}
.cartao .r{color:var(--fraco);font-size:.8rem;margin-top:.2rem}
.lista{background:var(--caixa);border:1px solid var(--linha);border-radius:10px;overflow:hidden}
.item{display:block;padding:.75rem .9rem;border-bottom:1px solid var(--linha);color:var(--txt)}
.item:last-child{border-bottom:0}
.item:hover{background:#1c2129}
.topo{display:flex;justify-content:space-between;gap:.6rem;align-items:baseline}
.nome{font-weight:600}
.previa{color:var(--fraco);font-size:.86rem;margin-top:.15rem;
overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tempo{color:var(--fraco);font-size:.75rem;white-space:nowrap}
.tag{display:inline-block;font-size:.7rem;padding:.1rem .45rem;border-radius:999px;
border:1px solid var(--linha);color:var(--fraco);margin-left:.3rem}
.tag.humano{border-color:var(--amarelo);color:var(--amarelo)}
.tag.alerta{border-color:var(--vermelho);color:var(--vermelho)}
.tag.ok{border-color:var(--verde);color:var(--verde)}
.bolha{max-width:82%;padding:.55rem .8rem;border-radius:12px;margin:.35rem 0;
white-space:pre-wrap;word-break:break-word;font-size:.92rem}
.bolha.entrada{background:#1c2129;border:1px solid var(--linha)}
.bolha.saida{background:#173a2a;border:1px solid #1f5136;margin-left:auto}
.hora{font-size:.68rem;color:var(--fraco);margin-top:.15rem}
form.linha{display:flex;gap:.5rem;margin:.8rem 0}
input,textarea,select{background:#0b0e13;border:1px solid var(--linha);color:var(--txt);
border-radius:8px;padding:.6rem;font:inherit;width:100%}
textarea{min-height:90px;resize:vertical}
button{background:var(--azul);color:#fff;border:0;border-radius:8px;padding:.6rem 1rem;
font:inherit;font-weight:600;cursor:pointer;white-space:nowrap}
button.calmo{background:#2a313c}
button.perigo{background:var(--vermelho)}
.aviso{padding:.6rem .8rem;border-radius:8px;margin-bottom:.8rem;font-size:.9rem}
.aviso.ok{background:#123021;border:1px solid #1f5136}
.aviso.erro{background:#3a1a18;border:1px solid #6b2a26}
.caixa{background:var(--caixa);border:1px solid var(--linha);border-radius:10px;padding:.9rem}
table{width:100%;border-collapse:collapse;font-size:.88rem}
th{text-align:left;color:var(--fraco);font-weight:600;padding:.5rem .4rem;
border-bottom:1px solid var(--linha)}
td{padding:.5rem .4rem;border-bottom:1px solid var(--linha)}
code{background:#0b0e13;padding:.1rem .35rem;border-radius:5px;font-size:.85em}
.vazio{color:var(--fraco);padding:1.2rem;text-align:center}