:root{--bg:#0b0e14;--surface:#141924;--surface-2:#1b2230;--line:#2a3345;--accent:#e9c46a;--accent-2:#c9a65a;--text:#f0e7d3;--muted:#9aa3b5;--danger:#e5484d;--ok:#4cc38a;--blue:#5865f2;--r:10px;--foco:0 0 0 2px var(--bg),0 0 0 4px var(--accent)}
[data-tema=claro]{--bg:#ecdcb4;--surface:#f6ecd0;--surface-2:#efe2bd;--line:#cdb98a;--accent:#8e5f1e;--accent-2:#7a4f15;--text:#2b2113;--muted:#6b5b3d}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:15px/1.45 'Alegreya Sans',system-ui,sans-serif}
h1,h2,h3{font-weight:700;margin:0}
.marca,.titulo-cinzel{font-family:Cinzel,serif;color:var(--accent);letter-spacing:.04em}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:none;box-shadow:var(--foco)}
.topo{display:flex;align-items:center;gap:12px;padding:10px 16px;background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5;flex-wrap:wrap}
.topo nav{display:flex;gap:4px;flex:1;flex-wrap:wrap}
.topo nav a{padding:6px 12px;border-radius:var(--r);color:var(--muted);text-decoration:none}
.topo nav a.ativo,.topo nav a:hover{background:var(--surface-2);color:var(--accent)}
.btn{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r);padding:8px 14px;min-height:40px}
.btn:hover{border-color:var(--accent-2)}
.btn.primario{background:var(--accent);color:#1a1405;border-color:var(--accent);font-weight:700}
.btn.perigo{border-color:var(--danger);color:var(--danger)}
.btn.azul{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:500}
.btn:disabled{opacity:.5;cursor:default}
main{padding:16px;max-width:1280px;margin:0 auto}
.login{display:grid;place-items:center;min-height:100vh;text-align:center;gap:14px;padding:24px}
.erro-login{color:var(--danger)}
.barra{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;align-items:center}
.barra input,.barra select,.campo input,.campo select,.campo textarea{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:8px 10px;min-height:40px}
.barra input[type=search]{flex:1;min-width:160px}
.lista{display:grid;gap:8px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;display:grid;gap:4px;text-decoration:none;color:inherit}
.card:hover{border-color:var(--accent-2)}
.card .linha{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.card .assunto{font-weight:700;flex:1;min-width:140px}
.meta{color:var(--muted);font-size:13px}
.badge{border:1px solid var(--line);border-radius:999px;padding:1px 10px;font-size:12px;background:var(--surface-2)}
.badge.aberto{color:var(--accent);border-color:var(--accent-2)}.badge.em_atendimento{color:#6db3e0}.badge.aguardando_jogador{color:var(--muted)}.badge.fechado{color:var(--ok)}
.badge.urgente,.badge.atrasado{color:var(--danger);border-color:var(--danger)}.badge.alta{color:#e0b878}
.vazio{color:var(--muted);text-align:center;padding:40px 0}
.chamado{display:grid;grid-template-columns:1fr 300px;gap:16px}
.chat{display:flex;flex-direction:column;gap:10px;min-width:0}
.msgs{display:flex;flex-direction:column;gap:8px;max-height:60vh;overflow:auto;padding:4px}
.msg{max-width:85%;padding:8px 12px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);white-space:pre-wrap;word-wrap:anywhere}
.msg.publica{align-self:flex-end;background:rgba(233,196,106,.12);border-color:var(--accent-2)}
.msg.nota{align-self:stretch;max-width:100%;border-style:dashed;background:var(--surface-2)}
.msg.sistema{align-self:center;color:var(--muted);font-size:13px;background:none;border:none}
.msg .quem{font-size:12px;color:var(--muted);margin-bottom:2px}
.msg .falhou{color:var(--danger)}
.abas{display:flex;gap:4px}
.abas button{border:1px solid var(--line);background:var(--surface);padding:6px 14px;border-radius:var(--r) var(--r) 0 0}
.abas button.ativo{background:var(--surface-2);border-color:var(--accent-2);color:var(--accent)}
.composer{display:grid;gap:8px}
.composer textarea{min-height:90px;resize:vertical;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px}
.composer.nota textarea{border-style:dashed;background:var(--surface-2)}
.aviso{background:var(--surface-2);border:1px solid var(--line);border-left:3px solid var(--accent);padding:6px 10px;border-radius:6px;font-size:13px}
.aviso.interna{border-left-color:var(--danger)}
.lateral{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px;display:grid;gap:10px;align-self:start}
.lateral dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 10px}.lateral dt{color:var(--muted)}.lateral dd{margin:0;word-wrap:anywhere}
.lateral .acoes{display:grid;gap:6px}
.campo{display:grid;gap:4px;margin-bottom:10px}.campo label{color:var(--muted);font-size:13px}
.campo .linha2{display:flex;gap:8px;flex-wrap:wrap}
fieldset{border:1px solid var(--line);border-radius:var(--r);margin:0 0 14px;padding:12px}legend{font-family:Cinzel,serif;color:var(--accent);padding:0 6px}
.config{display:grid;grid-template-columns:1fr 380px;gap:20px}
.preview{position:sticky;top:70px;align-self:start}
.dc{background:#313338;color:#dbdee1;border-radius:6px;padding:12px;font-family:system-ui,sans-serif;font-size:14px}
.dc .emb{border-left:4px solid var(--accent);background:#2b2d31;border-radius:4px;padding:10px 12px;display:grid;gap:6px;white-space:pre-wrap;word-wrap:anywhere}
.dc .emb b.t{color:#fff;font-size:15px}.dc img{max-width:100%;border-radius:4px}.dc .rod{font-size:12px;color:#b5bac1}
.dc .bot{display:inline-flex;gap:6px;background:#5865f2;color:#fff;border-radius:4px;padding:6px 14px;margin-top:8px}
table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:top}
.numeros{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:16px}
.numero{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px}.numero b{display:block;font-size:26px;color:var(--accent)}
.barra-h{height:10px;background:var(--accent-2);border-radius:5px}
.modal-fundo{position:fixed;inset:0;background:rgba(0,0,0,.6);display:grid;place-items:center;z-index:20;padding:16px}
.modal{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px;max-width:480px;width:100%;display:grid;gap:12px}
#toasts{position:fixed;bottom:16px;right:16px;display:grid;gap:6px;z-index:30}.toast{background:var(--surface-2);border:1px solid var(--accent-2);padding:8px 14px;border-radius:var(--r)}.toast.erro{border-color:var(--danger)}
.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{background:var(--surface-2);border:1px solid var(--line);border-radius:999px;padding:2px 10px;display:inline-flex;gap:6px}.chip button{background:none;border:none;padding:0;color:var(--muted)}
.so-desktop{color:var(--muted);font-size:13px;display:none}
@media(max-width:820px){.chamado,.config{grid-template-columns:1fr}.preview{position:static}.so-desktop{display:block}.msg{max-width:95%}main{padding:12px}.btn{min-height:44px}}
