/* MazzaRO: CSS proprio, sem CDN nem fontes externas. Claro por padrao, escuro se o sistema pedir. */
:root {
  --fundo: #f6f3ec; --papel: #fffdf8; --texto: #2b2620; --suave: #6d6457; --borda: #ddd3c2;
  --marca: #8a3b12; --marca-2: #b8641f; --ok: #2f7d32; --ruim: #a8322d; --aviso-fundo: #fff2cc;
}
@media (prefers-color-scheme: dark) {
  :root {
    --fundo: #1b1916; --papel: #24211d; --texto: #ece6dc; --suave: #a99f90; --borda: #3a352e;
    --marca: #e39a5c; --marca-2: #f0b47c; --ok: #6cc070; --ruim: #e67a74; --aviso-fundo: #3d3420;
  }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--fundo); color: var(--texto);
       font: 16px/1.55 "Segoe UI", system-ui, -apple-system, Roboto, sans-serif; }
a { color: var(--marca); }
code { font-family: Consolas, "Cascadia Mono", monospace; font-size: .85em; color: var(--suave); }
.topo { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.5rem; padding: .8rem 1rem;
        background: var(--papel); border-bottom: 3px solid var(--marca); }
.marca { font-weight: 700; font-size: 1.35rem; text-decoration: none; letter-spacing: .02em; }
nav { display: flex; flex-wrap: wrap; gap: .25rem .9rem; }
nav a { text-decoration: none; color: var(--suave); padding: .15rem 0; }
nav a.ativo, nav a:hover { color: var(--marca); border-bottom: 2px solid var(--marca); }
main { max-width: 960px; margin: 0 auto; padding: 1.2rem 1rem 2rem; }
footer { text-align: center; color: var(--suave); font-size: .85rem; padding: 1.5rem 1rem; }
h1 { margin: .2rem 0 .4rem; line-height: 1.2; }
h2 { font-size: 1.1rem; margin: 0 0 .6rem; }
.destaque { background: var(--papel); border: 1px solid var(--borda); border-left: 6px solid var(--marca);
            padding: 1rem 1.2rem; margin-bottom: 1rem; }
.rotulo { margin: 0; color: var(--suave); text-transform: uppercase; font-size: .8rem; letter-spacing: .08em; }
.sub { margin: .2rem 0; color: var(--suave); }
.grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.cartao { background: var(--papel); border: 1px solid var(--borda); padding: 1rem 1.2rem; margin-bottom: 1rem; }
.cartao.ok { border-left: 6px solid var(--ok); }
.estado { font-weight: 700; font-size: 1.2rem; margin: 0 0 .4rem; }
.estado.on { color: var(--ok); } .estado.off { color: var(--ruim); }
.servidores { list-style: none; padding: 0; margin: 0 0 .5rem; columns: 2; }
.bola { display: inline-block; width: .65rem; height: .65rem; border-radius: 50%; margin-right: .4rem; }
.bola.on { background: var(--ok); } .bola.off { background: var(--ruim); }
.nota { color: var(--suave); font-size: .9rem; }
.aviso { background: var(--aviso-fundo); border: 1px solid var(--borda); padding: .6rem .9rem; }
table { border-collapse: collapse; width: 100%; }
th, td { text-align: left; padding: .3rem .4rem; border-bottom: 1px solid var(--borda); }
.mapas { font-family: Consolas, monospace; font-size: .85rem; overflow-wrap: anywhere; }
.linha { list-style: none; padding: 0; margin: 1rem 0; border-left: 3px solid var(--borda); }
.linha > li { display: grid; grid-template-columns: 6.5rem 1fr; gap: .8rem; padding: .6rem 0 .6rem 1rem; position: relative; }
.linha > li::before { content: ""; position: absolute; left: -.5rem; top: 1rem; width: .75rem; height: .75rem;
                    border-radius: 50%; background: var(--borda); }
.linha > li.aberto::before { background: var(--marca-2); }
.linha > li.atual::before { background: var(--marca); box-shadow: 0 0 0 4px var(--fundo), 0 0 0 6px var(--marca); }
.linha > li.futuro { opacity: .7; }
.linha h3 { margin: 0; font-size: 1.05rem; }
.linha .data { color: var(--suave); font-variant-numeric: tabular-nums; }
.linha ul { margin: .3rem 0 0; padding-left: 1.2rem; }
.tag { font-size: .75rem; padding: .05rem .45rem; border-radius: 3px; vertical-align: middle; color: #fff; }
.tag.atual { background: var(--marca); } .tag.aberto { background: var(--marca-2); }
.noticias { list-style: none; padding: 0; }
.noticias > li { background: var(--papel); border: 1px solid var(--borda); padding: .7rem 1rem; margin-bottom: .7rem; }
.noticias time { color: var(--suave); font-size: .85rem; }
.noticias p { margin: .2rem 0; }
.formulario { display: grid; gap: .8rem; max-width: 420px; background: var(--papel); border: 1px solid var(--borda);
              padding: 1rem 1.2rem; }
.formulario label { display: grid; gap: .2rem; font-weight: 600; }
.formulario label.inline { display: inline-flex; gap: .35rem; font-weight: 400; margin-right: 1rem; }
.formulario fieldset { border: 0; padding: 0; margin: 0; }
.formulario legend { font-weight: 600; margin-bottom: .2rem; }
input { font: inherit; padding: .4rem .5rem; border: 1px solid var(--borda); background: var(--fundo); color: var(--texto); }
button { font: inherit; padding: .5rem 1rem; border: 0; background: var(--marca); color: #fff; cursor: pointer; }
button:hover { background: var(--marca-2); }
.erros { background: var(--aviso-fundo); border-left: 4px solid var(--ruim); padding: .6rem .9rem .6rem 2rem; }
@media (max-width: 560px) {
  .linha > li { grid-template-columns: 1fr; gap: .1rem; }
  .servidores { columns: 1; }
}