/* KSA Documentação - the one stylesheet.
   Tokens on :root, redefined for dark mode; components use only the tokens.
   The palette is the Ficha's (navy, blue, one colour per state), as in the
   mockups the Administração approved. */

@font-face { font-family: "IBM Plex Sans"; src: url("/static/plex-sans.woff2") format("woff2"); font-weight: 100 700; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("/static/plex-mono.woff2") format("woff2"); font-weight: 500; font-display: swap; }

:root {
  color-scheme: light;
  --navy: #1F3864; --azul: #1565c0; --azul-forte: #0d4a94; --azul-fraco: #e8f1fb;
  --tinta: #16202b; --tinta-fraca: #5b6672; --linha: #e2e6eb; --fundo: #f4f6f9; --carta: #ffffff; --carta-2: #f9fafc;
  --ok: #1b6e3c; --ok-fraco: #e8f5ec; --ambar: #8a5a00; --ambar-fraco: #fff4e0; --perigo: #b3261e; --perigo-fraco: #fdecea;
  --neutro: #4a5561; --neutro-fraco: #eef1f5; --no-pri: #ffffff; --foco: #7fb3ff;
  --r: 10px; --r-g: 14px;
  --e1: .25rem; --e2: .5rem; --e3: .75rem; --e4: 1rem; --e5: 1.5rem; --e6: 2rem;
  --sombra: 0 1px 2px rgba(16,32,48,.06), 0 8px 24px rgba(16,32,48,.06);
  --sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --navy: #16223a; --azul: #6aa8f0; --azul-forte: #9cc5f7; --azul-fraco: #172a44;
    --tinta: #e6ebf1; --tinta-fraca: #9aa6b3; --linha: #2a3441; --fundo: #0f141b; --carta: #161d26; --carta-2: #1b2430;
    --ok: #6cc58f; --ok-fraco: #15301f; --ambar: #e0b25a; --ambar-fraco: #352a12; --perigo: #f08a82; --perigo-fraco: #3a1a18;
    --neutro: #aeb8c3; --neutro-fraco: #232c37; --no-pri: #0f141b;
    --sombra: 0 1px 2px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.25);
  }
}

* { box-sizing: border-box; }
/* hidden always wins: a component's display: flex must never show what is hidden. */
[hidden] { display: none !important; }
html, body { margin: 0; }
body { font-family: var(--sans); font-size: 15px; line-height: 1.55; color: var(--tinta); background: var(--fundo); min-height: 100vh; display: flex; flex-direction: column; }
a { color: var(--azul); }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--foco); outline-offset: 2px; border-radius: 6px; }
h1, h2, h3 { text-wrap: balance; line-height: 1.25; margin: 0; }
h1 { font-size: 1.5rem; font-weight: 700; letter-spacing: -.01em; }
h2 { font-size: 1.05rem; font-weight: 600; }
p { margin: 0; }
code, .mono { font-family: var(--mono); font-size: .85rem; }
.fraco { color: var(--tinta-fraca); }
.pequeno { font-size: .82rem; }
.num { font-variant-numeric: tabular-nums; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.eyebrow { font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--tinta-fraca); font-weight: 600; margin-bottom: .2rem; }
.eyebrow a { color: inherit; }

/* top bar */
.topo { position: sticky; top: 0; z-index: 20; background: var(--navy); color: #fff; }
.topo-in { display: flex; align-items: center; gap: var(--e4); padding: .55rem 16px; min-height: 56px; }
.marca { display: flex; align-items: center; gap: .55rem; font-weight: 700; white-space: nowrap; color: #fff; text-decoration: none; }
.marca-ico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: rgba(255,255,255,.14); font-family: var(--mono); font-size: .72rem; }
.eu { margin-left: auto; display: flex; align-items: center; gap: .6rem; white-space: nowrap; font-size: .88rem; }
.eu form { margin: 0; }
.avatar { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: rgba(255,255,255,.2); font-weight: 600; font-size: .75rem; }
.btn-topo { background: none; border: 1px solid rgba(255,255,255,.3); color: #fff; border-radius: 8px; padding: .3rem .7rem; cursor: pointer; font-size: .85rem; }
.btn-topo:hover { background: rgba(255,255,255,.1); }

/* shell */
.concha { display: grid; grid-template-columns: 232px minmax(0, 1fr); flex: 1; }
.lado { border-right: 1px solid var(--linha); background: var(--carta); padding: var(--e4) var(--e3); display: flex; flex-direction: column; gap: var(--e1); }
.lado .rot { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: var(--tinta-fraca); font-weight: 600; padding: var(--e3) var(--e3) var(--e1); }
.lado a { display: flex; align-items: center; gap: .6rem; padding: .45rem .7rem; border-radius: 8px; color: var(--tinta); text-decoration: none; font-size: .92rem; }
.lado a:hover { background: var(--neutro-fraco); }
.lado a.on { background: var(--azul-fraco); color: var(--azul-forte); font-weight: 600; }
main { padding-block: var(--e6); padding-inline: 16px; min-width: 0; flex: 1; }
.pagina { max-width: 1040px; margin: 0 auto; display: flex; flex-direction: column; gap: var(--e5); }
.pagina.estreita { max-width: 440px; }
main.sozinho { display: flex; align-items: flex-start; justify-content: center; padding-top: 8vh; }
main.sozinho .pagina { width: 100%; }
.cabeca { display: flex; align-items: flex-end; gap: var(--e4); flex-wrap: wrap; }
.cabeca .t { flex: 1; min-width: 220px; display: flex; flex-direction: column; gap: .2rem; }
.rodape { text-align: center; font-size: .75rem; color: var(--tinta-fraca); padding: var(--e4) 16px; }

/* surfaces */
.cartao { background: var(--carta); border: 1px solid var(--linha); border-radius: var(--r-g); padding: var(--e5); }
.cartao.entrada { box-shadow: var(--sombra); display: flex; flex-direction: column; gap: var(--e3); }
.cartao.entrada h1 { margin-bottom: var(--e1); }
.pilha { display: flex; flex-direction: column; gap: var(--e3); }
.pilha > label { font-weight: 600; font-size: .9rem; margin-bottom: -.4rem; }
.grupo { background: var(--carta); border: 1px solid var(--linha); border-radius: var(--r-g); overflow: hidden; }
.grupo > header { display: flex; align-items: center; gap: .6rem; padding: .8rem var(--e4); border-bottom: 1px solid var(--linha); }
.grupo > header .n { font-variant-numeric: tabular-nums; font-size: .8rem; font-weight: 700; background: var(--neutro-fraco); color: var(--neutro); border-radius: 10px; padding: 0 .5rem; }
.linhas { list-style: none; margin: 0; padding: 0; }
.linhas li { display: flex; align-items: center; gap: var(--e4); padding: .75rem var(--e4); border-top: 1px solid var(--linha); flex-wrap: wrap; }
.linhas li:first-child { border-top: 0; }
.linhas li > div { flex: 1; min-width: 160px; }
.linhas .mono { color: var(--tinta-fraca); width: 2.5rem; }
.linhas .titulo { font-weight: 500; overflow-wrap: anywhere; }
.linhas .sub { font-size: .8rem; color: var(--tinta-fraca); }
.vazio { padding: var(--e4); color: var(--tinta-fraca); }

/* forms */
input[type=text], input[type=email], input[type=password], input[type=search], input:not([type]), select, textarea {
  border: 1px solid var(--linha); border-radius: 8px; padding: .55rem .7rem; background: var(--carta-2); width: 100%; min-width: 0;
}
input:focus, select:focus, textarea:focus { border-color: var(--azul); outline: 3px solid var(--azul-fraco); outline-offset: 0; }
input.codigo { font-family: var(--mono); font-size: 1.3rem; letter-spacing: .25em; max-width: 12rem; }
.linha-form { display: flex; gap: var(--e3); align-items: center; flex-wrap: wrap; }
.linha-form select, .linha-form input { width: auto; flex: 1 1 10rem; }
.linha-form form { margin: 0; }
.grelha-form { display: grid; grid-template-columns: 10rem minmax(0, 1fr); gap: var(--e3) var(--e4); align-items: center; }
.grelha-form > label, .grelha-form > span { font-weight: 600; font-size: .9rem; }
.grelha-form label.caixa { font-weight: 400; display: flex; gap: .5rem; align-items: center; }
.ferr { display: flex; gap: var(--e3); flex-wrap: wrap; align-items: center; }
.ferr input { flex: 1 1 14rem; width: auto; }
.ferr select { width: auto; }

/* buttons */
.btn { display: inline-flex; align-items: center; gap: .4rem; border: 1px solid var(--linha); background: var(--carta); border-radius: 8px; padding: .5rem .9rem; font-weight: 600; font-size: .9rem; cursor: pointer; text-decoration: none; color: var(--tinta); white-space: nowrap; }
.btn:hover { border-color: var(--azul); }
.btn.pri { background: var(--azul); border-color: var(--azul); color: var(--no-pri); justify-content: center; }
.btn.pri:hover { background: var(--azul-forte); border-color: var(--azul-forte); }
.btn.peq { padding: .3rem .65rem; font-size: .82rem; }
.btn.link { border: 0; background: none; color: var(--azul); padding: .3rem 0; font-weight: 500; }
form { margin: 0; }

/* states */
.chip { display: inline-flex; align-items: center; gap: .35rem; font-size: .75rem; font-weight: 600; border-radius: 999px; padding: .12rem .6rem; white-space: nowrap; }
.chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.c-vigor { background: var(--ok-fraco); color: var(--ok); }
.c-sub { background: var(--azul-fraco); color: var(--azul-forte); }
.c-ras { background: var(--neutro-fraco); color: var(--neutro); }
.papel { display: inline-flex; gap: .3rem; align-items: center; font-size: .75rem; border: 1px solid var(--linha); border-radius: 6px; padding: .05rem .4rem; margin: .1rem .2rem .1rem 0; white-space: nowrap; }
.papel b { font-family: var(--mono); font-weight: 500; font-size: .7rem; }
.papel.resp { border-color: var(--azul); color: var(--azul-forte); }
.estado-ok { color: var(--ok); font-size: .85rem; }
.estado-mau { color: var(--ambar); font-size: .85rem; }
[class^="aviso-"] { border-radius: 10px; padding: .7rem 1rem; font-size: .92rem; border: 1px solid transparent; }
.aviso-ok { background: var(--ok-fraco); color: var(--ok); border-color: var(--ok-fraco); }
.aviso-warn { background: var(--ambar-fraco); color: var(--ambar); }
.aviso-error { background: var(--perigo-fraco); color: var(--perigo); }
.faixa-ensaio { background: var(--ambar); color: var(--ambar-fraco); text-align: center; padding: .35rem 1rem; font-size: .85rem; font-weight: 600; }
.lista-mudancas { margin: .2rem 0; padding-left: 1.2rem; }

/* tables */
.tabela-caixa { overflow-x: auto; background: var(--carta); border: 1px solid var(--linha); border-radius: var(--r-g); }
table { width: 100%; border-collapse: collapse; font-size: .9rem; }
th { text-align: left; font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--tinta-fraca); font-weight: 600; padding: .7rem var(--e4); border-bottom: 1px solid var(--linha); white-space: nowrap; }
td { padding: .7rem var(--e4); border-bottom: 1px solid var(--linha); vertical-align: middle; }
tr:last-child td { border-bottom: 0; }
td.dir { text-align: right; }
tr.inactivo td { color: var(--tinta-fraca); }
.matriz td, .matriz th { text-align: center; }
.matriz td:first-child, .matriz th:first-child { text-align: left; }
.sim { color: var(--ok); font-weight: 700; }
.nao { color: var(--tinta-fraca); }
.legenda { font-size: .82rem; color: var(--tinta-fraca); max-width: 75ch; }

/* 2FA */
.passos { margin: 0; padding-left: 1.3rem; display: flex; flex-direction: column; gap: var(--e3); }
.chave { display: flex; gap: var(--e3); align-items: center; flex-wrap: wrap; margin-top: .4rem; }
.chave code { background: var(--carta-2); border: 1px solid var(--linha); border-radius: 8px; padding: .45rem .7rem; font-size: .95rem; letter-spacing: .06em; overflow-wrap: anywhere; }
.codigos { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: var(--e2); }
.codigos code { display: block; background: var(--carta-2); border: 1px solid var(--linha); border-radius: 8px; padding: .4rem .6rem; text-align: center; font-size: .95rem; }
.erro h1 { margin: .3rem 0 var(--e4); }

@media (max-width: 860px) {
  .concha { grid-template-columns: 1fr; }
  .lado { flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--linha); padding: .5rem 16px; }
  .lado .rot { display: none; }
  .lado a { white-space: nowrap; }
  .lado { scrollbar-width: none; }
  .lado::-webkit-scrollbar { display: none; }
  .lado .sep-lado { display: none; }
}
@media (max-width: 640px) {
  .eu .nome { display: none; }
  .grelha-form { grid-template-columns: 1fr; }
  .cartao { padding: var(--e4); }
}
@media (prefers-reduced-motion: no-preference) {
  .btn, .lado a { transition: background .12s, border-color .12s; }
}

/* ---- top bar search ---- */
.pesquisa { flex: 1; max-width: 480px; margin: 0; }
.pesquisa input { width: 100%; border: 0; border-radius: 8px; padding: .5rem .8rem; background: rgba(255,255,255,.12); color: #fff; }
.pesquisa input::placeholder { color: rgba(255,255,255,.72); }
.pesquisa input:focus { outline: 3px solid var(--foco); outline-offset: 0; background: rgba(255,255,255,.18); }
.sep-lado { border: 0; border-top: 1px solid var(--linha); margin: var(--e2) var(--e3); }

/* ---- a page ---- */
.doc-cabeca { align-items: flex-start; }
.migalhas { display: flex; flex-wrap: wrap; gap: .35rem; font-size: .82rem; color: var(--tinta-fraca); margin-bottom: .3rem; }
.migalhas a { color: var(--tinta-fraca); text-decoration: none; }
.migalhas a:hover { color: var(--azul); text-decoration: underline; }
.idiomas-pagina { display: flex; gap: .4rem; font-size: .82rem; font-weight: 600; padding-top: .3rem; }
.idiomas-pagina a, .idiomas-pagina strong, .idiomas-pagina span { padding: .15rem .45rem; border-radius: 6px; border: 1px solid var(--linha); text-decoration: none; }
.idiomas-pagina strong { background: var(--azul-fraco); color: var(--azul-forte); border-color: var(--azul-fraco); }
.idiomas-pagina span { opacity: .55; }
.doc-grelha { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: var(--e6); align-items: start; }
.doc-grelha.sem-indice { grid-template-columns: minmax(0, 1fr); }
.indice { position: sticky; top: 76px; font-size: .85rem; border-left: 2px solid var(--linha); padding-left: var(--e4); }
.indice ul { list-style: none; margin: .4rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .35rem; }
.indice li.n3 { padding-left: .8rem; }
.indice a { color: var(--tinta-fraca); text-decoration: none; }
.indice a:hover { color: var(--azul); }
.rodape-doc { border-top: 1px solid var(--linha); padding-top: var(--e3); }

.corpo-doc { max-width: 76ch; font-size: 1rem; line-height: 1.65; display: flex; flex-direction: column; gap: .9rem; min-width: 0; }
.corpo-doc > * { margin: 0; }
.corpo-doc h1 { font-size: 1.45rem; margin-top: .6rem; }
.corpo-doc h2 { font-size: 1.2rem; margin-top: 1.1rem; padding-bottom: .3rem; border-bottom: 1px solid var(--linha); scroll-margin-top: 72px; }
.corpo-doc h3 { font-size: 1.02rem; margin-top: .6rem; scroll-margin-top: 72px; }
.corpo-doc h4, .corpo-doc h5, .corpo-doc h6 { font-size: .95rem; }
.corpo-doc ul, .corpo-doc ol { padding-left: 1.4rem; margin: 0; display: flex; flex-direction: column; gap: .3rem; }
.corpo-doc li > ul, .corpo-doc li > ol { margin-top: .3rem; }
.corpo-doc li > p { margin: .3rem 0 0; }
.corpo-doc code { background: var(--neutro-fraco); border-radius: 4px; padding: .05rem .3rem; font-size: .88em; overflow-wrap: anywhere; }
.corpo-doc pre { background: var(--carta-2); border: 1px solid var(--linha); border-radius: 10px; padding: .8rem 1rem; overflow-x: auto; }
.corpo-doc pre code { background: none; padding: 0; font-size: .85rem; }
.corpo-doc blockquote { border-left: 3px solid var(--linha); padding: .1rem 0 .1rem 1rem; color: var(--tinta-fraca); display: flex; flex-direction: column; gap: .5rem; }
.corpo-doc hr { border: 0; border-top: 1px solid var(--linha); margin: .5rem 0; }
.corpo-doc a.em-falta { color: var(--perigo); text-decoration-style: dashed; }
.corpo-doc a.outra-lingua::after { content: " (PT)"; font-size: .75em; color: var(--tinta-fraca); }
.corpo-doc img { border-radius: 8px; border: 1px solid var(--linha); }
.conteudo-tabela { border-radius: 10px; }
.conteudo-tabela table { font-size: .9rem; }
.conteudo-tabela th { text-transform: none; letter-spacing: 0; font-size: .82rem; color: var(--tinta); background: var(--carta-2); }
.conteudo-tabela td { vertical-align: top; }
.al-center { text-align: center; } .al-right { text-align: right; }
.nota { border-radius: 10px; padding: .75rem 1rem; border-left: 4px solid; display: flex; flex-direction: column; gap: .5rem; }
.nota > * { margin: 0; }
.nota-info { background: var(--azul-fraco); border-color: var(--azul); }
.nota-warning { background: var(--ambar-fraco); border-color: var(--ambar); }
.nota-success { background: var(--ok-fraco); border-color: var(--ok); }
.nota-danger { background: var(--perigo-fraco); border-color: var(--perigo); }
.cartoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--e3); }
.cartao-link { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: .7rem; row-gap: .15rem; padding: var(--e4); border: 1px solid var(--linha); border-radius: var(--r-g); background: var(--carta); text-decoration: none; color: var(--tinta); }
.cartao-link:hover { border-color: var(--azul); box-shadow: var(--sombra); }
.cartao-link .ico { grid-row: span 2; font-size: 1.5rem; line-height: 1; }
.cartao-link .ttl { font-weight: 600; }
.cartao-link .desc { font-size: .85rem; color: var(--tinta-fraca); }

/* ---- search and listings ---- */
.resultados { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--e4); }
.resultados li { display: flex; flex-direction: column; gap: .2rem; background: var(--carta); border: 1px solid var(--linha); border-radius: var(--r-g); padding: var(--e4); }
.resultados .titulo { font-weight: 600; font-size: 1.02rem; text-decoration: none; }
.resultados .titulo:hover { text-decoration: underline; }
.resultados p { margin: .2rem 0 0; font-size: .9rem; }
mark { background: var(--ambar-fraco); color: inherit; border-radius: 3px; padding: 0 .1rem; }
.etiqueta { font-family: var(--mono); font-size: .9em; }

@media (max-width: 960px) {
  .doc-grelha { grid-template-columns: minmax(0, 1fr); }
  .indice { display: none; }
}
@media (max-width: 640px) {
  .pesquisa { display: none; }
}
.linhas .idade { font-size: .8rem; color: var(--tinta-fraca); white-space: nowrap; }
.linhas a.titulo { text-decoration: none; color: var(--tinta); }
.linhas a.titulo:hover { color: var(--azul); text-decoration: underline; }
.grupo > header .btn.link { margin-left: auto; }

/* ---- page actions ---- */
.doc-accoes { display: flex; flex-direction: column; align-items: flex-end; gap: .5rem; }
.c-dev { background: var(--ambar-fraco); color: var(--ambar); }
.c-rec { background: var(--perigo-fraco); color: var(--perigo); }

/* ---- comments ---- */
.marca-com { align-self: flex-end; margin-bottom: -1.6rem; position: relative; z-index: 1; font-size: .75rem; text-decoration: none; background: var(--ambar-fraco); color: var(--ambar); border-radius: 999px; padding: .05rem .5rem; }
.corpo-doc .realce { outline: 3px solid var(--ambar); outline-offset: 4px; border-radius: 6px; }
.comentar-bloco { position: absolute; z-index: 15; padding: .15rem .45rem; }
.comentarios { max-width: 76ch; display: flex; flex-direction: column; gap: var(--e4); border-top: 1px solid var(--linha); padding-top: var(--e5); }
.comentarios h2 .n { font-size: .8rem; background: var(--neutro-fraco); color: var(--neutro); border-radius: 10px; padding: 0 .5rem; vertical-align: middle; }
.fio { background: var(--carta); border: 1px solid var(--linha); border-radius: var(--r-g); padding: var(--e4); display: flex; flex-direction: column; gap: .6rem; }
.fio.resolvido { opacity: .7; }
.fio .ancora { font-size: .82rem; color: var(--tinta-fraca); border-left: 3px solid var(--ambar); padding-left: .6rem; text-decoration: none; }
.msg .quem { font-weight: 600; font-size: .85rem; }
.msg p { margin: .2rem 0 0; font-size: .95rem; overflow-wrap: anywhere; }
.msg-accoes { display: flex; gap: .6rem; }
.msg.removida { font-size: .85rem; }
.resposta { margin-left: var(--e4); padding-left: var(--e3); border-left: 2px solid var(--linha); }
.responder summary { cursor: pointer; font-size: .85rem; color: var(--azul); }
.responder form { margin-top: .5rem; }
.novo-comentario { background: var(--carta); border: 1px solid var(--linha); border-radius: var(--r-g); padding: var(--e4); }
.ancora-escolhida q { font-size: .85rem; }
textarea { border: 1px solid var(--linha); border-radius: 8px; padding: .55rem .7rem; background: var(--carta-2); width: 100%; resize: vertical; }

/* ---- history and comparison ---- */
.corpo-doc.antiga { border-left: 3px solid var(--ambar); padding-left: var(--e4); }
.resumo-dif { display: flex; gap: .5rem; flex-wrap: wrap; }
.dif-lista { display: flex; flex-direction: column; gap: var(--e3); max-width: 80ch; }
.dif { border-radius: 10px; padding: .6rem .9rem; border-left: 4px solid; display: flex; flex-direction: column; gap: .4rem; }
.dif > * { margin: 0; }
.dif-rot { font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 600; color: var(--tinta-fraca); }
.dif-ins { background: var(--ok-fraco); border-color: var(--ok); }
.dif-del { background: var(--perigo-fraco); border-color: var(--perigo); }
.dif-del > :not(.dif-rot) { text-decoration: line-through; opacity: .75; }
.dif-mud { background: var(--ambar-fraco); border-color: var(--ambar); }
.dif-igual { font-size: .8rem; color: var(--tinta-fraca); text-align: center; border-top: 1px dashed var(--linha); padding-top: .3rem; }
del { background: var(--perigo-fraco); color: var(--perigo); text-decoration: line-through; }
ins { background: var(--ok-fraco); color: var(--ok); text-decoration: none; }

/* ---- the editor ---- */
.ed-form { display: flex; flex-direction: column; gap: var(--e4); }
.ed-titulo { font-size: 1.4rem; font-weight: 700; }
.ed-barra { position: sticky; top: 56px; z-index: 10; display: flex; flex-wrap: wrap; gap: 2px; align-items: center; background: var(--carta); border: 1px solid var(--linha); border-radius: 10px; padding: .3rem; box-shadow: var(--sombra); }
.ed-barra button { border: 0; background: none; border-radius: 6px; padding: .3rem .6rem; cursor: pointer; font-weight: 600; font-size: .85rem; color: var(--tinta); }
.ed-barra button:hover { background: var(--neutro-fraco); }
.ed-barra .sep { width: 1px; align-self: stretch; background: var(--linha); margin: .2rem .3rem; }
.ed-ligacao { display: flex; gap: .4rem; align-items: center; margin-left: auto; }
.ed-ligacao input { width: 18rem; }
.editor { display: flex; flex-direction: column; gap: var(--e3); }
.ed-blocos { display: flex; flex-direction: column; gap: .5rem; }
.ed-bloco { background: var(--carta); border: 1px solid var(--linha); border-radius: 10px; padding: .5rem .7rem .7rem; display: flex; flex-direction: column; gap: .35rem; }
.ed-bloco:focus-within { border-color: var(--azul); box-shadow: 0 0 0 3px var(--azul-fraco); }
.ed-controlos { display: flex; gap: .2rem; align-items: center; opacity: .55; }
.ed-bloco:hover > .ed-controlos, .ed-bloco:focus-within > .ed-controlos { opacity: 1; }
.ed-tipo { font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; color: var(--tinta-fraca); font-weight: 600; margin-right: auto; }
.ed-mini { border: 1px solid transparent; background: none; border-radius: 6px; padding: .1rem .45rem; cursor: pointer; color: var(--tinta-fraca); font-size: .8rem; }
.ed-mini:hover { border-color: var(--linha); color: var(--tinta); }
.ed-x:hover { color: var(--perigo); }
.ed-mais { align-self: flex-start; color: var(--azul); }
.ed-txt { outline: none; min-height: 1.6em; line-height: 1.6; overflow-wrap: anywhere; }
.ed-txt:empty::before { content: attr(data-placeholder); color: var(--tinta-fraca); }
.ed-txt code { background: var(--neutro-fraco); border-radius: 4px; padding: 0 .25rem; }
.ed-h { font-weight: 700; }
.ed-h1 { font-size: 1.4rem; }
.ed-h2 { font-size: 1.2rem; }
.ed-h3 { font-size: 1.05rem; }
.ed-h4 { font-size: .95rem; }
.ed-linha { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.ed-linha .ed-txt { flex: 1; }
.ed-nivel, .ed-tom { width: auto; padding: .2rem .4rem; font-size: .8rem; }
.ed-nota { border-left: 4px solid; border-radius: 8px; padding: .5rem; display: flex; flex-direction: column; gap: .4rem; }
.ed-nota .ed-tom { align-self: flex-start; }
.ed-citacao { border-left: 3px solid var(--linha); padding-left: .6rem; }
.ed-itens { display: flex; flex-direction: column; gap: .35rem; counter-reset: item; }
.ed-item { display: grid; grid-template-columns: 1.4rem minmax(0, 1fr) auto; gap: .3rem; align-items: start; }
.ed-item .ed-marca::before { content: "\2022"; color: var(--tinta-fraca); }
.ed-lista.numerada > .ed-itens > .ed-item { counter-increment: item; }
.ed-lista.numerada > .ed-itens > .ed-item > .ed-marca::before { content: counter(item) "."; }
.ed-item .ed-bloco { border-style: dashed; padding: .3rem .5rem; }
.ed-opcao { font-size: .82rem; color: var(--tinta-fraca); display: inline-flex; gap: .3rem; align-items: center; }
.ed-tabela-caixa { overflow-x: auto; }
.ed-tabela { display: grid; gap: 1px; background: var(--linha); border: 1px solid var(--linha); border-radius: 8px; overflow: hidden; }
.ed-celula { background: var(--carta); padding: .35rem .5rem; font-size: .9rem; }
.ed-celula.cab { background: var(--carta-2); font-weight: 600; }
.ed-ferramentas { font-size: .8rem; }
.ed-codigo { font-family: var(--mono); font-size: .85rem; }
.ed-lang { width: 10rem; margin-bottom: .3rem; font-size: .8rem; }
.ed-campos, .ed-cartao { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: .4rem; align-items: center; }
.ed-cartao input.curto { max-width: 4rem; }
.ed-cartoes { display: flex; flex-direction: column; gap: .4rem; }
.ed-hr { border: 0; border-top: 2px dashed var(--linha); margin: .6rem 0; }
.ed-acrescentar { position: relative; }
.ed-acrescentar > summary { list-style: none; cursor: pointer; border-radius: 6px; padding: .1rem .5rem; color: var(--tinta-fraca); font-size: .85rem; }
.ed-acrescentar > summary::-webkit-details-marker { display: none; }
.ed-acrescentar.largo > summary { border: 1px dashed var(--linha); text-align: center; padding: .45rem; color: var(--azul); font-weight: 600; }
.ed-acrescentar[open] > .ed-menu { position: absolute; z-index: 12; right: 0; top: calc(100% + 4px); background: var(--carta); border: 1px solid var(--linha); border-radius: 10px; box-shadow: var(--sombra); padding: .3rem; display: grid; grid-template-columns: repeat(2, minmax(8rem, 1fr)); gap: 2px; }
.ed-acrescentar.largo[open] > .ed-menu { left: 0; right: auto; }
.ed-menu button { text-align: left; border: 0; background: none; border-radius: 6px; padding: .4rem .6rem; cursor: pointer; font-size: .85rem; color: var(--tinta); }
.ed-menu button:hover { background: var(--azul-fraco); }
.ed-rodape { position: sticky; bottom: 0; z-index: 10; display: flex; gap: .6rem; align-items: center; background: var(--fundo); padding: .7rem 0; border-top: 1px solid var(--linha); }
.ed-rodape input { flex: 1; }
.ed-recuperar { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
@media (max-width: 640px) {
  .ed-ligacao input { width: 100%; }
  .ed-rodape { flex-wrap: wrap; }
}
/* Inside a list item the blocks stay quiet: controls only on the block being
   edited (the innermost one with focus), and no big + button per item. */
.ed-item .ed-bloco { border: 0; padding: 0; background: none; box-shadow: none; }
.ed-item .ed-bloco:focus-within { box-shadow: none; }
.ed-item .ed-bloco > .ed-controlos { display: none; }
.ed-item .ed-bloco:focus-within:not(:has(.ed-bloco:focus-within)) > .ed-controlos { display: flex; }
.ed-item .ed-acrescentar.largo { display: none; }
.ed-item .ed-blocos { gap: .2rem; }

/* ---- the library ---- */
.separadores a { padding: .6rem .9rem; font-weight: 600; color: var(--tinta-fraca); border-bottom: 2px solid transparent; text-decoration: none; white-space: nowrap; }
.separadores a.on { color: var(--azul-forte); border-bottom-color: var(--azul); }
.separadores a:hover { color: var(--tinta); }
.ext { display: inline-block; font-family: var(--mono); font-size: .66rem; font-weight: 500; background: var(--azul-fraco); color: var(--azul-forte); border-radius: 4px; padding: .05rem .35rem; margin-right: .5rem; vertical-align: middle; letter-spacing: .02em; }
.ficheiro-nome { text-decoration: none; font-weight: 500; }
.ficheiro-nome:hover { text-decoration: underline; }
.pastas { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.pastas a { display: inline-block; border: 1px solid var(--linha); background: var(--carta); border-radius: 8px; padding: .45rem .8rem; text-decoration: none; color: var(--tinta); }
.pastas a:hover { border-color: var(--azul); }
.envio .zona { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-top: .6rem; }
.envio .zona input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.envio .zona input:not([type=file]) { flex: 1 1 14rem; width: auto; }
.envio.arrastar, .envio.arrastar .zona { outline: 3px dashed var(--azul); outline-offset: 4px; }
.envios { list-style: none; margin: .6rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .3rem; font-size: .88rem; }
.envios li { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px dashed var(--linha); padding: .2rem 0; }
.envios li.ok .estado { color: var(--ok); }
.envios li.erro .estado { color: var(--perigo); }
.previa { margin: 0; }
.previa img { max-height: 420px; border: 1px solid var(--linha); border-radius: 10px; background: var(--carta); }
.meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--e3) var(--e5); margin: 0; }
.meta dt { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--tinta-fraca); font-weight: 600; }
.meta dd { margin: 0; overflow-wrap: anywhere; }
.corpo-doc .anexo a { text-decoration: none; font-weight: 500; border: 1px solid var(--linha); border-radius: 8px; padding: .4rem .7rem; background: var(--carta); display: inline-block; }
.corpo-doc .anexo a:hover { border-color: var(--azul); }
.corpo-doc .anexo.indisponivel { color: var(--tinta-fraca); font-style: italic; }
.ed-escolher { display: flex; flex-direction: column; gap: .3rem; margin-top: .4rem; }
.ed-resultados { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; max-height: 14rem; overflow: auto; }
.ed-resultados button { text-align: left; width: 100%; border: 1px solid var(--linha); background: var(--carta-2); border-radius: 6px; padding: .35rem .6rem; cursor: pointer; font-size: .85rem; color: var(--tinta); }
.ed-resultados button:hover { border-color: var(--azul); }
.ed-escolhido { font-weight: 500; }
.ed-ficheiro { display: flex; flex-direction: column; gap: .4rem; }

/* ------------------------------------------------------------------ documents (phase 5) */
.linhas .mono.codigo { width: auto; min-width: 9.5rem; font-size: .78rem; }
.grupo.urg { border-color: var(--azul); }
.grupo.urg > header h2 { color: var(--azul-forte); }
details.grupo > summary { display: flex; align-items: center; gap: .6rem; padding: .8rem var(--e4); cursor: pointer; list-style: none; }
details.grupo > summary::-webkit-details-marker { display: none; }
details.grupo > summary::before { content: "▸"; color: var(--tinta-fraca); }
details.grupo[open] > summary::before { content: "▾"; }
details.grupo > summary .n { font-variant-numeric: tabular-nums; font-size: .8rem; font-weight: 700; background: var(--neutro-fraco); color: var(--neutro); border-radius: 10px; padding: 0 .5rem; }
details.grupo[open] > summary { border-bottom: 1px solid var(--linha); }
.cartao.estreito, form.estreito { max-width: 36rem; }

.doc-circuito { display: grid; grid-template-columns: minmax(0, 1fr) 18rem; gap: var(--e5); align-items: start; }
.doc-circuito .principal { gap: var(--e5); min-width: 0; }
.lateral { position: sticky; top: 72px; }
.lateral .cartao { padding: var(--e4); }
.lateral h3 { font-size: .9rem; margin-bottom: .5rem; }
.botoes-doc .btn { justify-content: center; }
@media (max-width: 960px) {
  .doc-circuito { grid-template-columns: minmax(0, 1fr); }
  .lateral { position: static; order: -1; }
}

.doc-form-campos { display: flex; flex-direction: column; gap: var(--e5); }
.campo { display: flex; flex-direction: column; gap: .35rem; min-width: 0; }
.campo > label, .campo .rotulo { font-weight: 600; font-size: .95rem; display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
h2.rotulo { font-size: 1.05rem; }
.campo .nn { display: inline-grid; place-items: center; min-width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--azul-fraco); color: var(--azul-forte); font-size: .8rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.obrig { font-size: .72rem; font-weight: 600; color: var(--ambar); text-transform: uppercase; letter-spacing: .05em; }
.ajuda { font-size: .85rem; color: var(--tinta-fraca); font-weight: 400; }
.campo input, .campo select, .campo textarea { width: 100%; border: 1px solid var(--linha); border-radius: 8px; padding: .5rem .65rem; background: var(--carta); }
.campo.leitura { background: var(--carta); border: 1px solid var(--linha); border-radius: var(--r-g); padding: var(--e4) var(--e5); gap: var(--e3); }
.campo-blocos { background: var(--carta); border: 1px solid var(--linha); border-radius: var(--r); padding: var(--e3); }
.grelha-form.tres { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
.grelha-form:has(> .campo) { grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); align-items: start; }

.grelha-campo { width: 100%; border-collapse: collapse; }
.grelha-campo th { text-align: left; font-size: .8rem; font-weight: 600; color: var(--tinta-fraca); padding: .3rem .4rem; vertical-align: bottom; }
.grelha-campo td { padding: .25rem .3rem; vertical-align: top; border-top: 1px solid var(--linha); }
.grelha-campo td.num { color: var(--tinta-fraca); padding-top: .65rem; width: 2.5rem; }
.grelha-campo textarea { width: 100%; min-width: 9rem; border: 1px solid var(--linha); border-radius: 6px; padding: .4rem .5rem; background: var(--carta); resize: vertical; }
td.pre, .pre { white-space: pre-wrap; overflow-wrap: anywhere; }

.anexos-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .3rem; }
.anexos-lista li { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.anexos-lista a { text-decoration: none; }
.anexar { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.anexar input[type="search"] { flex: 1 1 12rem; width: auto; }
.resultados-anexo { list-style: none; margin: 0; padding: 0; flex-basis: 100%; }

.pessoa { display: flex; align-items: center; gap: .5rem; padding: .3rem 0; font-size: .9rem; flex-wrap: wrap; }
.pessoa .av { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--azul-fraco); color: var(--azul-forte); font-size: .7rem; font-weight: 700; }
.pessoa .feito { margin-left: auto; color: var(--ok); font-size: .8rem; font-weight: 600; }
.mudar > summary { list-style: none; cursor: pointer; }
.mudar > summary::-webkit-details-marker { display: none; }
.aprovadores { display: flex; flex-direction: column; gap: .5rem; margin: .5rem 0; max-height: 22rem; overflow: auto; }
.grupo-apr { display: flex; flex-direction: column; gap: .15rem; }
.grupo-apr > summary { cursor: pointer; }
label.apr { display: flex; gap: .45rem; align-items: center; font-size: .9rem; font-weight: 400; }
label.check { display: inline-flex; gap: .45rem; align-items: center; font-weight: 400; }
input.curto { width: 5rem; flex: 0 0 auto; }

.decisao { display: flex; flex-direction: column; gap: var(--e3); border-color: var(--azul); }
.decisao textarea { width: 100%; border: 1px solid var(--linha); border-radius: 8px; padding: .5rem .65rem; background: var(--carta); }
.decisao > label { font-weight: 600; font-size: .9rem; }
.pareceres .linhas li { align-items: flex-start; }
.historico > summary { cursor: pointer; }
.historico table { width: 100%; border-collapse: collapse; margin-top: var(--e3); font-size: .88rem; }
.historico th, .historico td { text-align: left; padding: .35rem .5rem; border-top: 1px solid var(--linha); }
.btn.perigo { color: var(--perigo); border-color: var(--perigo); }
.btn.perigo:hover { background: var(--perigo-fraco); }
.lateral .btn.perigo { margin-top: var(--e3); }

fieldset.cartao { margin: 0; }
fieldset.cartao > legend { font-weight: 600; padding: 0 .4rem; }
fieldset.retirada { opacity: .65; }
.lingua { font-family: var(--mono); font-size: .72rem; border-radius: 4px; padding: 0 .25rem; }
.lingua.sim { background: var(--ok-fraco); color: var(--ok); }
.lingua.pendente { background: var(--ambar-fraco); color: var(--ambar); }
.lingua.nao { color: var(--tinta-fraca); text-decoration: line-through; }
@media (max-width: 640px) {
  .grelha-form.tres { grid-template-columns: minmax(0, 1fr); }
  .grelha-campo thead { display: none; }
  .grelha-campo tr { display: block; border-top: 1px solid var(--linha); padding: .4rem 0; }
  .grelha-campo td { display: block; border: 0; }
  .grelha-campo td[data-r]::before { content: attr(data-r); display: block; font-size: .78rem; color: var(--tinta-fraca); }
}
/* The hidden file input is placed inside its label, not somewhere off to the right. */
.anexar label.btn { position: relative; overflow: hidden; }
.anexar label.btn input { left: 0; top: 0; }
.historico > summary { display: flex; align-items: center; gap: .5rem; list-style: none; }
.historico > summary::-webkit-details-marker { display: none; }
.historico > summary::before { content: "▸"; color: var(--tinta-fraca); }
.historico[open] > summary::before { content: "▾"; }
.doc-cabeca .chip { align-self: flex-start; margin-top: .2rem; }
.campo input[type="checkbox"], .campo input[type="radio"] { width: auto; }

/* ------------------------------------------------------------------ feedback (phase 6) */
.lado .conta { display: inline-grid; place-items: center; min-width: 1.3rem; height: 1.3rem; padding: 0 .35rem; margin-left: .35rem; border-radius: 999px; background: var(--azul); color: var(--no-pri); font-size: .72rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.leitura { margin-top: var(--e6); border-color: var(--azul); }
.leitura .linha-form .btn { flex: 0 0 auto; }
blockquote.proposta { margin: .5rem 0 0; padding: .5rem .75rem; border-left: 3px solid var(--azul); background: var(--azul-fraco); border-radius: 0 8px 8px 0; }
.linhas li.novo { background: var(--azul-fraco); }
pre.mensagem { white-space: pre-wrap; overflow-wrap: anywhere; font-family: var(--sans); font-size: .9rem; margin: 0; background: var(--carta-2); border: 1px solid var(--linha); border-radius: 8px; padding: var(--e3); }
.linhas .n.grande { font-size: 1.3rem; font-weight: 700; color: var(--azul-forte); min-width: 2.5rem; text-align: right; }
fieldset.tipo-comentario { border: 0; padding: 0; margin: 0; }
.ciclo p { margin: 0; }
.ciclo textarea { width: 100%; border: 1px solid var(--linha); border-radius: 8px; padding: .4rem .55rem; background: var(--carta); }
.ciclo form .btn { justify-content: center; }
.tipo-comentario input[type="radio"] { flex: 0 0 auto; width: auto; }