:root { --bg:#f6f7f9; --card:#fff; --tx:#1b2430; --mut:#5b6675; --pri:#0b5d3b; --bd:#d9dee5; --err:#b3261e; --ok:#0b5d3b; }
@media (prefers-color-scheme: dark) {
  :root { --bg:#12161b; --card:#1b2129; --tx:#e8ecf1; --mut:#9aa6b5; --pri:#4cc38a; --bd:#2c3540; --err:#ff8a80; --ok:#4cc38a; }
}
* { box-sizing: border-box; }
body { margin:0; font:15px/1.5 system-ui, sans-serif; background:var(--bg); color:var(--tx); }
header { background:var(--card); border-bottom:1px solid var(--bd); padding:.6rem 1rem; display:flex; flex-wrap:wrap; gap:1rem; align-items:center; }
header .marca { font-weight:700; color:var(--pri); }
header nav { display:flex; gap:.9rem; flex-wrap:wrap; flex:1; align-items:center; }
header a { color:var(--tx); text-decoration:none; } header a:hover { color:var(--pri); }
main { max-width:1100px; margin:1.2rem auto; padding:0 1rem; }
.card { background:var(--card); border:1px solid var(--bd); border-radius:8px; padding:1rem; margin-bottom:1rem; }
.centro { max-width:420px; margin:8vh auto; }
h1 { font-size:1.4rem; margin:.2rem 0 1rem; } h2 { font-size:1.1rem; margin:.2rem 0 .6rem; }
label { display:block; font-weight:600; margin:.7rem 0 .2rem; }
input, select { width:100%; padding:.5rem; border:1px solid var(--bd); border-radius:6px; background:var(--bg); color:var(--tx); font:inherit; }
input[type=checkbox] { width:auto; }
button, .btn { background:var(--pri); color:#fff; border:0; border-radius:6px; padding:.55rem 1rem; font:inherit; cursor:pointer; margin-top:.9rem; }
button.sec { background:transparent; color:var(--tx); border:1px solid var(--bd); margin:0; }
.erro { color:var(--err); font-weight:600; } .ok { color:var(--ok); font-weight:600; } .mut { color:var(--mut); }
table { width:100%; border-collapse:collapse; } th, td { text-align:left; padding:.45rem .5rem; border-bottom:1px solid var(--bd); }
td.n, th.n { text-align:right; font-variant-numeric: tabular-nums; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:.8rem; }
.kpi b { display:block; font-size:1.4rem; }
.tabela { overflow-x:auto; }
.linha { display:flex; gap:.8rem; flex-wrap:wrap; align-items:end; } .linha > div { flex:1; min-width:140px; }
code { background:var(--bg); padding:.1rem .3rem; border-radius:4px; }
.temp { font-size:1.1rem; padding:.6rem; border:2px dashed var(--pri); border-radius:6px; word-break:break-all; }
@media (max-width:600px) { main { margin:.6rem auto; } }
textarea { padding:.5rem; border:1px solid var(--bd); border-radius:6px; background:var(--bg); color:var(--tx); }
hr { border:0; border-top:1px solid var(--bd); margin:1rem 0; }
img.logo { display:block; height:auto; max-width:100%; background:#fff; border-radius:6px; }  /* o logo tem fundo branco: no tema escuro fica numa "placa" */
header .marca { display:flex; align-items:center; line-height:0; }
.logo-topo { text-align:center; margin:2.2rem auto 0; padding:0 1rem; }
.logo-topo img.logo { display:inline-block; width:260px; }
.logo-topo + main .centro { margin-top:1.2rem; }

/* menus e submenus (sem script inline: a CSP só aceita arquivos do próprio site) */
.menu a.atual, .menu .grupo.atual > .grupo-btn { color:var(--pri); font-weight:700; }
.menu .grupo { position:relative; }
.menu .grupo-btn { background:transparent; color:var(--tx); border:0; margin:0; padding:.2rem .1rem; font:inherit; cursor:pointer; }
.menu .grupo-btn:hover, .menu .grupo-btn:focus-visible { color:var(--pri); }
.menu .sub { display:none; position:absolute; top:100%; left:0; z-index:10; min-width:210px; padding:.3rem 0; background:var(--card);
  border:1px solid var(--bd); border-radius:8px; box-shadow:0 6px 18px rgba(0,0,0,.15); }
.menu .sub a { display:block; padding:.4rem .9rem; white-space:nowrap; }
.menu .sub a:hover, .menu .sub a:focus-visible { background:var(--bg); }
.menu .grupo:hover .sub, .menu .grupo:focus-within .sub, .menu .grupo.aberto .sub { display:block; }
@media (max-width:700px) {
  .menu { flex-direction:column; align-items:stretch; gap:.3rem; }
  .menu .sub { position:static; display:block; box-shadow:none; border:0; border-left:2px solid var(--bd); border-radius:0; margin-left:.4rem; }
  .menu .grupo-btn { font-weight:700; text-align:left; }
}

img.logo-prev { background:#fff; border:1px solid var(--bd); border-radius:6px; padding:4px; max-width:100%; height:auto; }

/* editor visual dos modelos de petição */
.barra-editor { display:flex; flex-wrap:wrap; gap:.35rem; align-items:center; margin:.4rem 0; padding:.4rem; background:var(--bg); border:1px solid var(--bd); border-radius:6px; }
.barra-editor button { margin:0; padding:.3rem .6rem; }
.barra-editor select { width:auto; max-width:18rem; }
.barra-editor .sep { width:1px; align-self:stretch; background:var(--bd); margin:0 .15rem; }
.editor { min-height:28rem; padding:1.2rem 1.6rem; background:#fff; color:#1b2430; border:1px solid var(--bd); border-radius:6px; font:15px/1.55 "Times New Roman", Times, serif; overflow-wrap:anywhere; }
.editor:focus { outline:2px solid var(--pri); outline-offset:1px; }
.editor p { margin:0 0 .8em; text-align:justify; text-indent:2em; }
.editor p.semrecuo { text-indent:0; }
.editor p.centro { text-align:center; text-indent:0; }
.editor p.direita { text-align:right; text-indent:0; }
.editor .var { display:inline-block; padding:0 .35em; border:1px solid #b5c8bd; border-radius:4px; background:#e8f3ec; color:#0b5d3b; font:12.5px/1.5 ui-monospace, Consolas, monospace; text-indent:0; user-select:all; }
textarea#conteudo { width:100%; font:13px/1.5 ui-monospace, Consolas, monospace; }