/* Tokens e base visual compartilhados pelas telas do servidor.
   Mesma família tipográfica do painel para não parecer outro produto. */
:root{
  --page:#f6f7f9; --card:#fff; --ink:#15181d; --ink2:#5b6472; --ink3:#8b94a3;
  --linha:#e3e7ec; --campo:#fff;
  --azul:#1b4ed8; --azul-ink:#fff; --azul-fraco:#eef2ff;
  --verde:#0f7b4f; --verde-fraco:#e7f6ee;
  --vermelho:#b42318; --vermelho-fraco:#fdecea;
  --ambar:#9a6700; --ambar-fraco:#fff8e1;
  --r:10px; --sombra:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.1);
}
@media (prefers-color-scheme:dark){
  :root:not([data-tema="claro"]){
    --page:#0f1216; --card:#161a20; --ink:#e8ecf1; --ink2:#9aa5b4; --ink3:#6b7483;
    --linha:#272d36; --campo:#1b2027;
    --azul:#5b87ff; --azul-ink:#0b0f14; --azul-fraco:#182236;
    --verde:#3ddc97; --verde-fraco:#13261f;
    --vermelho:#ff7a6b; --vermelho-fraco:#2a1816;
    --ambar:#f2c14e; --ambar-fraco:#2a2314;
    --sombra:0 1px 2px rgba(0,0,0,.4);
  }
}
:root[data-tema="escuro"]{
  --page:#0f1216; --card:#161a20; --ink:#e8ecf1; --ink2:#9aa5b4; --ink3:#6b7483;
  --linha:#272d36; --campo:#1b2027;
  --azul:#5b87ff; --azul-ink:#0b0f14; --azul-fraco:#182236;
  --verde:#3ddc97; --verde-fraco:#13261f;
  --vermelho:#ff7a6b; --vermelho-fraco:#2a1816;
  --ambar:#f2c14e; --ambar-fraco:#2a2314;
  --sombra:0 1px 2px rgba(0,0,0,.4);
}

*{box-sizing:border-box}
body{
  margin:0; background:var(--page); color:var(--ink);
  font-family:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:15px; line-height:1.55; -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:Archivo,system-ui,sans-serif;font-weight:600;letter-spacing:-.01em;margin:0}
h1{font-size:22px} h2{font-size:17px} h3{font-size:15px}
a{color:var(--azul)}
code,.mono{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:.92em}

.card{background:var(--card);border:1px solid var(--linha);border-radius:var(--r);box-shadow:var(--sombra)}
.pad{padding:18px 20px}
.nota{color:var(--ink2);font-size:13px}
.fraco{color:var(--ink3)}
.linha{height:1px;background:var(--linha);border:0;margin:16px 0}

label{display:block;font-size:13px;font-weight:500;color:var(--ink2);margin:0 0 5px}
input,select,textarea{
  width:100%;padding:9px 11px;border:1px solid var(--linha);border-radius:8px;
  background:var(--campo);color:var(--ink);font:inherit;font-size:14px;
}
input:focus,select:focus{outline:2px solid var(--azul);outline-offset:-1px;border-color:transparent}
.campo{margin-bottom:14px}

.btn{
  display:inline-flex;align-items:center;gap:7px;justify-content:center;
  padding:9px 16px;border-radius:8px;border:1px solid var(--linha);
  background:var(--card);color:var(--ink);font:inherit;font-size:14px;font-weight:500;cursor:pointer;
}
.btn:hover{border-color:var(--ink3)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.p{background:var(--azul);border-color:var(--azul);color:var(--azul-ink)}
.btn.p:hover{filter:brightness(1.08)}
.btn.g{width:100%}
.btn.mini{padding:5px 10px;font-size:13px}
.btn.perigo{color:var(--vermelho);border-color:var(--vermelho)}

table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.04em;
   color:var(--ink3);font-weight:600;padding:8px 10px;border-bottom:1px solid var(--linha)}
td{padding:9px 10px;border-bottom:1px solid var(--linha);vertical-align:middle}
tr:last-child td{border-bottom:0}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}

.tag{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:600}
.tag.ok{background:var(--verde-fraco);color:var(--verde)}
.tag.erro{background:var(--vermelho-fraco);color:var(--vermelho)}
.tag.aviso{background:var(--ambar-fraco);color:var(--ambar)}
.tag.neutro{background:var(--azul-fraco);color:var(--azul)}

.aviso-box{border-radius:var(--r);padding:13px 15px;margin:10px 0;border:1px solid}
.aviso-box.erro{background:var(--vermelho-fraco);border-color:var(--vermelho);color:var(--ink)}
.aviso-box.aviso{background:var(--ambar-fraco);border-color:var(--ambar);color:var(--ink)}
.aviso-box.ok{background:var(--verde-fraco);border-color:var(--verde);color:var(--ink)}
.aviso-box b{display:block;margin-bottom:3px;font-family:Archivo,sans-serif}
.aviso-box .acao{margin-top:7px;font-size:13px;color:var(--ink2)}

.oculto{display:none!important}
.spin{display:inline-block;width:14px;height:14px;border:2px solid currentColor;
  border-right-color:transparent;border-radius:50%;animation:gira .7s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}