/* ===== BolsoDrive — o arquivo (drive.html), no molde da Foz =====
   Carrega depois de assets/base.css e usa os componentes dele (.dq .afl .afls .env .sec .porta .lm .numero
   .chip .legenda .kicker .pilulas). Aqui só o que é do arquivo.
   Cor: vermelho = preso ou condenado · âmbar = número, fato, ação · verde = fonte, link. Qualquer outra cor é bug.
   Tipo: corpo 16 · listas 15–16 · ressalvas 13 · mono só em rótulo, data, fonte e status. */
:root{
  --bg:var(--papel); --panel:var(--leve); --panel2:#122012;
  --line:var(--linha); --line2:rgba(116,255,150,.32);
  --text:var(--tinta); --muted:var(--cinza); --dim:var(--cinza2);
  --green-b:var(--azul); --red-b:var(--carimbo);
  --radius:4px;
}
html{scroll-padding-top:var(--hdr,57px)}
body{font-size:16px; line-height:1.5; min-height:100vh}
a{color:var(--azul); text-decoration:none}
a:hover{text-decoration:underline; text-underline-offset:3px}
button{font-family:inherit; cursor:pointer; color:inherit}
::selection{background:var(--amber); color:#000}
[hidden]{display:none!important}

/* ===== página ===== */
.wrap{max-width:1080px; margin:0 auto; padding:18px 16px 80px}
@media (min-width:900px){ .wrap{padding:26px 24px 90px} }
.view{display:none}
.view.active{display:block; animation:fade .18s ease}
@keyframes fade{from{opacity:0}to{opacity:1}}
.view-head{margin:4px 0 18px; max-width:760px}
.view-head h1.sec{margin:0 0 6px}
.view-head .sub{margin:0}
.col{max-width:760px}
/* no desktop, as views de leitura ficam numa coluna centrada (como a Foz); arquivo e teia usam a largura toda */
@media (min-width:900px){ #view-recente, #view-cronologia, #view-chat{max-width:760px; margin-left:auto; margin-right:auto} }
/* a chamada de seção, como as faixas da Foz: "// OS NÚMEROS" */
.kx{font-family:var(--mono); font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--amber); margin:30px 0 10px}
.kx::before{content:"//\00a0"; color:var(--cinza2)}
.kx span{color:var(--cinza); font-weight:400}
/* chip dentro de texto corrido: sem a margem de bloco do base.css */
.chip{margin:0; vertical-align:1px}
.tese{font-size:16px; line-height:1.5; color:var(--tinta); max-width:44em; margin:0 0 10px}

/* ===== busca ===== */
.busca-box{position:relative; margin:0 0 6px; max-width:760px}
.busca-box input{width:100%; min-height:48px; padding:0 14px 0 42px; background:var(--leve); border:1px solid var(--linha); border-radius:4px; color:var(--tinta); font:16px var(--sans); -webkit-appearance:none; appearance:none}
.busca-box input::placeholder{color:var(--cinza)}
.busca-box input:focus{outline:none; border-color:var(--amber)}
.busca-box::before{content:""; position:absolute; left:15px; top:16px; width:11px; height:11px; border:2px solid var(--cinza); border-radius:50%; pointer-events:none}
.busca-box::after{content:""; position:absolute; left:28px; top:30px; width:7px; height:2px; background:var(--cinza); transform:rotate(45deg); transform-origin:0 50%; pointer-events:none}

/* ===== o registro (um fato do arquivo): data · pasta · status / manchete / fonte · Na Foz · enviar ===== */
.regs{max-width:760px}
.reg{padding:12px 0 6px; border-top:1px solid var(--linha)}
.regs > .reg:first-child, .dia-l > .reg:first-child{border-top:0}
.reg-k{margin:0 0 3px; font-family:var(--mono); font-size:11px; line-height:1.5; letter-spacing:.05em; text-transform:uppercase; color:var(--cinza)}
.reg-k .chip{font-size:10.5px; padding:0 5px; letter-spacing:.04em}
.reg-t{margin:0; font-size:16px; line-height:1.35; font-weight:700}
.reg-b{display:block; width:100%; padding:0; margin:0; border:0; background:none; text-align:left; color:var(--tinta); font:inherit; line-height:inherit; cursor:pointer}
.reg-b:hover{color:#fff; text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px}
.reg-b:focus-visible{outline:2px solid var(--amber); outline-offset:2px}
.reg-a{display:flex; align-items:center; flex-wrap:wrap; gap:0 16px; margin-top:4px}
.reg-f{display:inline-flex; align-items:center; min-height:44px; font-family:var(--mono); font-size:12px; color:var(--azul)}
.reg-foz{display:inline-flex; align-items:center; min-height:44px; font-size:14px; font-weight:700; color:var(--amber)}
.reg-a .env{margin-left:auto; font-size:14px; padding:0 14px}
.vazio{color:var(--cinza); font-size:15px; margin:12px 0}
/* a conversa no BolsoZap: uma porta (âmbar), não uma fonte */
.zap-l{display:inline-flex; align-items:center; min-height:44px; font-size:15px; font-weight:700; color:var(--amber)}

/* botões de texto: voltar, ver mais */
.vt{display:inline-flex; align-items:center; min-height:44px; padding:0; margin:0 0 6px; border:0; background:none; font:600 15px var(--sans); color:var(--amber); cursor:pointer}
.vt:hover{text-decoration:underline; text-underline-offset:3px}
.lm:hover{text-decoration:underline; text-underline-offset:3px}

/* ===== RECENTEMENTE ===== */
.rec-quando{display:block; min-height:1.5em; color:var(--cinza)}
.rec-dq{max-width:760px}
.rec-dq .kicker{margin:0 0 6px}
.rec-dq .dq-h{margin:0 0 8px; font-size:22px; line-height:1.2; font-weight:800}
.rec-dq .dq-h .reg-b:hover{color:var(--tinta)}
/* o resumo do destaque em 4 linhas; o registro inteiro abre na folha */
.rec-dq .dq-t{display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; margin-bottom:0}
.rec-dq .dq-t + .lm{margin:0}
/* altura reservada: a lista chega pelo JS (sem isso o rodapé sobe e desce: CLS) */
.recente{min-height:calc(100vh - 160px); max-width:760px}
.recente:empty{background:repeating-linear-gradient(180deg,var(--leve) 0 150px,transparent 150px 166px); opacity:.5}
.dia{margin:26px 0 0}
.dia:first-child{margin-top:8px}
.dia > h3{display:flex; align-items:baseline; flex-wrap:wrap; gap:2px 10px; margin:0; padding:0 0 6px; border-bottom:1px solid var(--linha); font-size:17px; font-weight:800; color:var(--tinta)}
.dia > h3 span{font-family:var(--mono); font-size:11px; font-weight:400; letter-spacing:.04em; color:var(--cinza)}
.rec-mais{display:flex; flex-wrap:wrap; gap:0 22px; margin:18px 0 0}
/* manchetes de outros veículos: uma faixa dentro do Recentemente (era a aba Notícias) */
.manchetes{max-width:760px; margin:26px 0 0; padding:4px 14px 6px; background:var(--leve); border:1px solid var(--linha); border-radius:4px}
.manchetes .kx{margin:12px 0 2px}
.manchetes .man-sub{margin:0 0 4px; font-size:13px; color:var(--cinza)}
.man{padding:10px 0 2px; border-top:1px solid var(--linha)}
.man:first-of-type{border-top:0}
.man-l{display:block; color:var(--tinta); font-size:15px; font-weight:600; line-height:1.35}
.man-l:hover{color:#fff}
.man-a{display:flex; align-items:center; flex-wrap:wrap; gap:0 16px}
.man-f{font-family:var(--mono); font-size:11px; color:var(--cinza); letter-spacing:.04em}
.man-a .env{margin-left:auto; font-size:14px; padding:0 14px}

/* ===== ARQUIVO ===== */
/* os números (placar): no celular, uma fileira que desliza; do tablet para cima, grade */
.mostr-lista{display:grid; grid-auto-flow:column; grid-auto-columns:84%; gap:10px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; margin:0 -16px; padding:0 16px 8px; scroll-padding:0 16px; scrollbar-width:none}
.mostr-lista::-webkit-scrollbar{display:none}
.mostr{scroll-snap-align:start; display:flex; flex-direction:column; min-width:0; padding:12px 14px 6px; border:1px solid var(--linha); border-radius:4px; background:var(--leve)}
.mostr .numero.ficha{font-size:34px; margin:0 0 6px}
.mostr .numero.tinta{color:var(--tinta)}
.mostr .m-t{flex:1; margin:0; font-size:14px; line-height:1.42; color:var(--tinta)}
.mostr .m-a{display:flex; align-items:center; flex-wrap:wrap; gap:0 14px; margin-top:8px}
.mostr .m-p{display:inline-flex; align-items:center; min-height:44px; padding:0; border:0; background:none; font:700 14px var(--sans); color:var(--amber); cursor:pointer}
.mostr .m-p:hover{text-decoration:underline; text-underline-offset:3px}
.mostr-dica{margin:2px 0 0; font-family:var(--mono); font-size:11px; color:var(--cinza)}
@media (min-width:700px){
  .mostr-lista{grid-auto-flow:row; grid-template-columns:repeat(2,minmax(0,1fr)); overflow:visible; margin:0; padding:0}
  .mostr-dica{display:none}
}
@media (min-width:1000px){ .mostr-lista{grid-template-columns:repeat(3,minmax(0,1fr))} }
/* por caso: as 4 faixas da Foz */
.faixas{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
@media (min-width:900px){ .faixas{grid-template-columns:repeat(4,minmax(0,1fr))} }
.faixas .afl{margin:0}
.faixas .afl .an{margin:4px 0 2px}
.faixas .afl .an b{font-size:34px}
.faixas .afl .an .t{color:var(--cinza); font-size:13px}
.faixas .afl[aria-expanded="true"]{border-color:var(--amber)}
.fx-casos{margin:10px 0 0; padding:4px 14px 8px; border:1px solid var(--linha); border-radius:4px}
.fx-casos .kx{margin:10px 0 4px}
.caso-l{display:flex; align-items:center; gap:10px; width:100%; min-height:48px; padding:6px 0; border:0; border-top:1px solid var(--linha); background:none; text-align:left; font:inherit; color:var(--tinta); cursor:pointer; text-decoration:none}
.fx-casos .kx + .caso-l{border-top:0}
.caso-l .cl-n{flex:1; font-size:15px; font-weight:700; line-height:1.3}
.caso-l .cl-r{font-family:var(--mono); font-size:11px; color:var(--cinza); white-space:nowrap}
.caso-l .cl-r.foz{color:var(--amber); font-family:var(--sans); font-size:14px; font-weight:700}
.caso-l:hover .cl-n{text-decoration:underline; text-underline-offset:3px}
/* pastas: fichas de 76 px em 2 colunas */
.pastas.afls{grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
@media (min-width:900px){ .pastas.afls{grid-template-columns:repeat(3,minmax(0,1fr))} }
.pastas .afl{margin:0; min-height:76px; justify-content:center}
.pastas .afl .n{font-size:15px}
.pastas .pm{display:block; margin-top:4px; font-family:var(--mono); font-size:11px; color:var(--cinza)}
/* lista de uma pasta, de um caso ou da busca */
.lista-h{margin:6px 0 4px; font-size:22px; line-height:1.2; font-weight:800; color:var(--tinta); max-width:760px}
.lista-n{margin:0 0 8px; font-family:var(--mono); font-size:12px; color:var(--cinza)}
.caso-dq{max-width:760px; margin:6px 0 18px}
.ano-h{display:flex; align-items:baseline; gap:10px; margin:22px 0 0; padding:0 0 4px; border-bottom:1px solid var(--linha); font-size:20px; font-weight:800; color:var(--tinta); max-width:760px}
.ano-h span{font-family:var(--mono); font-size:11px; font-weight:400; color:var(--cinza)}
.dados-c{max-width:760px; margin:0 0 18px; padding:12px 14px; border:1px solid var(--linha); border-radius:4px; background:var(--leve)}
.dados-c .kicker{margin:0 0 10px}
.dados-c .fonte{margin:10px 0 0; font-family:var(--sans); font-size:13px; line-height:1.45}
.pbars{display:flex; gap:18px; align-items:flex-end; min-height:180px; padding:4px 2px 0}
.pbar-col{display:flex; flex-direction:column; align-items:center; gap:6px; flex:1; max-width:130px; min-width:0}
.pbar-val{font-size:13px; font-weight:800; color:var(--amber); white-space:nowrap; font-variant-numeric:tabular-nums}
.pbar{width:100%; max-width:56px; background:var(--amber); border-radius:2px 2px 0 0}
.pbar.ghost{background:repeating-linear-gradient(135deg,#16221a 0 5px,#0e160e 5px 10px); border:1px dashed var(--cinza2)}
.pbar-yr{font-family:var(--mono); font-size:11px; color:var(--tinta); text-align:center; line-height:1.35}
.pbar-yr span{display:block; color:var(--cinza)}
.sstats{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 16px}
@media (min-width:700px){ .sstats{grid-template-columns:repeat(3,minmax(0,1fr))} }
.sstat .numero.ficha{font-size:27px}
.sstat .sl{font-size:13px; line-height:1.35; color:var(--cinza)}
@media (max-width:480px){ .pbars{gap:8px} .pbar-val{font-size:11px; white-space:normal; text-align:center; line-height:1.2} }

/* ===== A TEIA ===== */
.rede-dq{max-width:960px}
/* o placar de situação em dois anéis (N07): um ponto por nome, na cor da situação; ele no centro, em tinta */
.plc .dq-t{max-width:34em}
.plc-g{display:grid; grid-template-columns:1fr; gap:6px 26px; align-items:start; margin:6px 0 4px}
@media (min-width:760px){ .plc-g{grid-template-columns:minmax(0,300px) minmax(0,1fr)} }
.plc-fig{margin:0}
.aneis{display:block; width:100%; max-width:270px; height:auto; margin:0 auto; overflow:visible}
@media (min-width:760px){ .aneis{max-width:300px} }
.aneis .guia{fill:none; stroke:var(--linha); stroke-width:1}
.aneis .pd{cursor:pointer; transition:opacity .18s}
.aneis .pd.grave{fill:var(--st-grave)} .aneis .pd.medio{fill:var(--st-medio)} .aneis .pd.outros{fill:var(--st-outros)}
.aneis.foco .pd{opacity:.14}
.aneis.foco .pd.on{opacity:1; stroke:var(--tinta); stroke-width:1.4}
.aneis .an-n{font:700 10px var(--mono); fill:var(--cinza); text-anchor:middle; dominant-baseline:middle; letter-spacing:.04em}
.aneis .ele{fill:#0e160e; stroke:var(--tinta); stroke-width:2}
.plc-fig figcaption{margin:8px 0 0}
.plc-fig .legenda{display:flex; flex-wrap:wrap; justify-content:center; gap:2px 12px; margin:0 0 6px}
.plc-an{display:block; font-size:13px; line-height:1.45; color:var(--cinza); text-align:center; max-width:32em; margin:0 auto}
@media (min-width:760px){ .plc-fig .legenda{justify-content:flex-start} .plc-an{text-align:left; margin:0} }
.plc-tab{width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums}
.plc-tab thead th{padding:0 0 6px; font:400 12px/1.3 var(--mono); color:var(--cinza); text-align:right; vertical-align:bottom; width:6.6em}
.plc-tab thead th b{display:block; font:800 22px/1.05 var(--sans); color:var(--tinta)}
.plc-tab tbody th{padding:0; font:600 15px/1.3 var(--sans); color:var(--tinta); text-align:left; border-top:1px solid var(--linha)}
.plc-tab tbody tr.sub th{padding-left:14px; font-weight:400; color:var(--cinza)}
.plc-tab td{padding:0; text-align:right; border-top:1px solid var(--linha)}
.plc-tab thead td{border:0}
.plc-n{min-width:52px; min-height:44px; padding:0 8px; border:1.5px solid transparent; border-radius:2px; background:none; font:800 22px/1 var(--sans); font-variant-numeric:tabular-nums; cursor:pointer}
.plc-n.grave{color:var(--st-grave)} .plc-n.medio{color:var(--amber)} .plc-n.neutro{color:var(--tinta)}
.plc-n:hover{border-color:var(--cinza2)}
.plc-n[aria-pressed="true"]{border-color:var(--tinta); background:rgba(216,239,221,.08)}
.plc-n[disabled]{color:var(--cinza2); cursor:default}
.plc-n:focus-visible{outline:2px solid var(--amber); outline-offset:2px}
.plc-nota{margin:8px 0 0; font-size:13px; line-height:1.45; color:var(--cinza)}
.plc-lista{margin:10px 0 6px; padding:2px 0 0; border-top:1px solid var(--linha)}
.plc-lista .kx{margin:12px 0 6px}
.plc-p{padding:9px 0; border-top:1px solid var(--linha)}
.plc-lista .kx + .plc-p{border-top:0}
.plc-nm{margin:0 0 3px}
.plc-pes{display:inline; padding:0; border:0; background:none; font:700 16px/1.35 var(--sans); color:var(--tinta); text-align:left; cursor:pointer; text-decoration:underline; text-decoration-color:var(--cinza2); text-underline-offset:3px}
.plc-pes:hover{text-decoration-color:var(--tinta)}
.plc-nm .chip{margin-left:4px}
.plc-s{margin:0; font-size:14px; line-height:1.45; color:var(--cinza)}
.plc-ac{margin:4px 0 0}
.toolbar{display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin:0 0 12px}
.toolbar .busca-box{flex:1 1 240px; margin:0}
.pil{display:inline-flex; align-items:center; min-height:44px; padding:0 14px; border:1.5px solid var(--cinza2); border-radius:999px; background:transparent; color:var(--tinta); font:600 13px var(--sans); cursor:pointer; text-decoration:none!important}
.pil:hover{border-color:var(--tinta)}
.pil[aria-pressed="true"]{background:var(--amber); border-color:var(--amber); color:#120c00}
.rede-wrap{display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:16px; align-items:start}
.canvas-box{position:relative; min-width:0}
#grafo{position:relative; z-index:1; display:block; width:100%; height:600px; border:1px solid var(--linha); border-radius:4px; background:#050805; cursor:grab; touch-action:manipulation; -webkit-tap-highlight-color:transparent; -webkit-touch-callout:none; -webkit-user-select:none; user-select:none}
.canvas-box.previa #grafo{cursor:default}
.canvas-box.arrastando #grafo{cursor:grabbing}
.teia-cap{display:none; position:absolute; z-index:2; left:12px; top:10px; margin:0; font-family:var(--mono); font-size:11px; letter-spacing:.04em; color:var(--cinza); pointer-events:none}
.canvas-box.previa .teia-cap{display:block}
.teia-ctl{position:absolute; z-index:3; top:10px; right:10px; display:flex; gap:6px}
.canvas-box.previa .teia-ctl{display:none}
.teia-ctl button,#grafo-fechar{font-family:var(--mono); color:var(--tinta); background:rgba(6,10,8,.9); border:1px solid var(--cinza2); border-radius:2px; cursor:pointer}
.teia-ctl button{min-width:40px; height:40px; padding:0 10px; font-size:18px; line-height:1}
.teia-ctl #grafo-fit{font-size:14px}
.teia-ctl #grafo-fit span{font-size:11px; text-transform:uppercase}
.teia-ctl button:hover,#grafo-fechar:hover{border-color:var(--tinta)}
#grafo-fechar{display:none}
.teia-dica{position:absolute; z-index:3; left:50%; top:300px; transform:translate(-50%,-50%); margin:0; padding:8px 12px; background:rgba(6,10,8,.94); border:1px solid var(--cinza2); border-radius:2px; font:12px var(--mono); color:var(--tinta); white-space:nowrap; opacity:0; pointer-events:none; transition:opacity .2s}
.teia-dica.on{opacity:1}
.teia-cartao{display:none}
/* o pé da teia: legenda dos 3 status, filtro por grupo e "abrir a teia inteira" */
.teia-leg{margin:8px 0 0}
.teia-leg .legenda{margin:0 0 4px}
.teia-grupos{display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:6px 0 0}
.teia-grupos{flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin-right:-16px; padding-right:16px}
.teia-grupos::-webkit-scrollbar{display:none}
.teia-grupos button{flex:0 0 auto}
@media (min-width:861px){ .teia-grupos{flex-wrap:wrap; overflow:visible; margin-right:0; padding-right:0} }
.teia-grupos .tg-k{flex:0 0 auto; font-family:var(--mono); font-size:11px; color:var(--cinza); margin-right:2px}
.teia-grupos button{min-height:34px; padding:0 10px; border:1px solid var(--cinza2); border-radius:999px; background:transparent; color:var(--tinta); font:600 12px var(--sans); cursor:pointer}
.teia-grupos button:hover,.teia-grupos button[aria-pressed="true"]{border-color:var(--tinta)}
.teia-grupos button[aria-pressed="true"]{background:rgba(216,239,221,.1)}
#grafo-cheia{margin:10px 0 0; width:100%}
@media (min-width:861px){ #grafo-cheia{width:auto} }
/* tela cheia: um dedo move, pinça dá zoom, toque abre a pessoa */
html.teia-cheia,html.teia-cheia body{overflow:hidden}
.canvas-box.tela-cheia{position:fixed; inset:0; z-index:55; margin:0; background:#050805; overscroll-behavior:none}
.canvas-box.tela-cheia #grafo{height:100%; border:0; border-radius:0; touch-action:none}
.canvas-box.tela-cheia #grafo-cheia,.canvas-box.tela-cheia .teia-grupos,.canvas-box.tela-cheia .teia-cap{display:none}
.canvas-box.tela-cheia #grafo-fechar{display:block; position:absolute; z-index:4; top:calc(8px + env(safe-area-inset-top)); right:8px; min-height:44px; padding:0 14px; font:700 14px var(--sans); color:var(--tinta); background:rgba(6,10,8,.94); border-color:var(--tinta)}
.canvas-box.tela-cheia .teia-leg{position:absolute; z-index:3; top:calc(8px + env(safe-area-inset-top)); left:8px; right:110px; margin:0; padding:6px 10px; background:rgba(6,10,8,.9); border:1px solid var(--linha); border-radius:2px}
.canvas-box.tela-cheia .teia-leg .legenda{margin:0; gap:2px 12px}
.canvas-box.tela-cheia .teia-ctl{top:calc(64px + env(safe-area-inset-top)); right:8px; flex-direction:column}
.canvas-box.tela-cheia .teia-ctl button{min-width:44px; height:44px; font-size:20px}
.canvas-box.tela-cheia #grafo-fit span{display:none}
.canvas-box.tela-cheia .teia-ctl #grafo-fit{font-size:20px}
.canvas-box.tela-cheia .teia-dica{top:50%}
.canvas-box.tela-cheia .teia-cartao:not([hidden]){display:block; position:absolute; z-index:4; left:8px; right:8px; bottom:calc(8px + env(safe-area-inset-bottom)); max-height:44%; overflow:auto; overscroll-behavior:contain; background:rgba(10,16,11,.97); border:1px solid var(--linha); border-left:3px solid var(--tinta); border-radius:4px; padding:10px 12px 12px; color:var(--tinta)}
@media (min-width:861px){ .canvas-box.tela-cheia .teia-cartao:not([hidden]){left:auto; width:420px} }
.teia-cartao .tc-top{display:flex; align-items:flex-start; gap:8px}
.teia-cartao .tc-nome{flex:1; font-size:17px; font-weight:800; line-height:1.25; color:var(--tinta); padding-top:6px}
.teia-cartao .tc-n{color:var(--cinza); font-weight:400}
.teia-cartao .tc-x{flex:0 0 auto; width:44px; height:44px; margin:-4px -8px 0 0; background:none; border:0; color:var(--cinza); font-size:22px; cursor:pointer}
.teia-cartao .tc-papel{margin:4px 0 0; font-size:14px; line-height:1.4; color:var(--cinza)}
/* a situação vai inteira (cortar a frase pode mudar o sentido); o cartão rola se precisar */
.teia-cartao .tc-sit{margin:6px 0 0; padding-left:9px; border-left:2px solid var(--tinta); font-size:14px; line-height:1.45; color:var(--tinta)}
.teia-cartao .tc-a{display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px; margin-top:10px}
.teia-cartao .tc-viz{font-size:12px; color:var(--cinza)}
.teia-cartao .tc-cam{margin:8px 0 0; font-size:13.5px; line-height:1.45; color:var(--tinta)}
.teia-cartao .tc-cam b{font-weight:800}
.teia-cartao .tc-foz,.teia-cartao .zap-l{display:inline-flex; align-items:center; min-height:44px; font-size:14px; font-weight:700; color:var(--amber)}
/* o painel ao lado (desktop) ou abaixo (celular) */
.rede-painel{min-width:0; padding:14px 16px; border:1px solid var(--linha); border-radius:4px; background:var(--leve); max-height:720px; overflow:auto; overflow-wrap:break-word}
.rede-painel .kx{margin:2px 0 8px}
.rede-painel .ph{margin:10px 0 0; font-size:13px; line-height:1.5; color:var(--cinza)}
.rede-painel h3{margin:2px 0 4px; font-size:20px; line-height:1.2; font-weight:800; color:var(--tinta)}
.rede-painel .papel{margin:0 0 8px; font-size:14px; line-height:1.45; color:var(--cinza)}
.rede-painel .p-sit{margin:0 0 10px; padding-left:9px; border-left:2px solid var(--tinta); font-size:14px; line-height:1.45; color:var(--tinta)}
.rede-painel .p-sit .chip{margin:0 4px 4px 0}
.rede-painel .pa{display:flex; flex-wrap:wrap; align-items:center; gap:4px 14px; margin:0 0 6px}
.rede-painel .zap-l{display:inline-flex; align-items:center; min-height:44px; font-size:14px; font-weight:700; color:var(--amber)}
.rede-painel .vlist{margin-top:12px; display:flex; flex-direction:column}
.rede-painel .vlbl{font-family:var(--mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--cinza); margin:0 0 4px}
.rede-painel .vrow{padding:8px 0; border-top:1px solid var(--linha); font-size:14px; line-height:1.45; color:var(--cinza); cursor:pointer}
.rede-painel .vrow b{color:var(--tinta)}
.rede-painel .vrow:hover b{text-decoration:underline; text-underline-offset:3px}
.rede-painel .vrow .src{font-family:var(--mono); font-size:11px}
.sit-lista{display:flex; flex-direction:column}
.sit.sit-preso b, .sit.sit-condenado b{color:#ff6b5c}
.sit.sit-denunciado b, .sit.sit-investigado b{color:var(--amber)}
.sit{display:flex; align-items:baseline; gap:10px; width:100%; min-height:48px; padding:10px 0; border:0; border-top:1px solid var(--linha); background:none; text-align:left; font:15px var(--sans); color:var(--tinta); cursor:pointer}
.sit:first-child{border-top:0}
.sit b{min-width:2.4em; font-size:20px; font-weight:800; font-variant-numeric:tabular-nums}
.sit span{margin-left:auto; color:var(--amber); font-weight:700}
.sit:hover{color:#fff}
.rede-painel .cm-t{margin:6px 0 10px; font-size:15px; line-height:1.45; color:var(--tinta)}
.rede-painel .cm-f{margin:0 0 4px; font-family:var(--mono); font-size:11px; color:var(--cinza)}
.rede-painel .cm-foz{display:inline-flex; align-items:center; min-height:44px; font-size:14px; font-weight:700; color:var(--amber)}
.rede-painel .cm-a{display:flex; flex-wrap:wrap; align-items:center; gap:4px 14px; margin:0 0 6px}
.caminho-nota{display:none}
@media (max-width:860px){
  .rede-wrap{grid-template-columns:1fr}
  #grafo{height:440px; height:min(460px,62svh)}
  .rede-painel{max-height:none; overflow:visible}
  .caminho-nota:not([hidden]){display:block; margin:0 0 12px; padding:9px 11px; border:1px solid var(--linha); border-left:3px solid var(--tinta); border-radius:4px; font-size:14px; line-height:1.45; color:var(--tinta)}
  .caminho-nota .cn-a{display:flex; flex-wrap:wrap; align-items:center; gap:4px 14px; margin-top:6px}
}
/* por quais rios da Foz um nome passa */
.foz-liga{margin:10px 0 0; padding:6px 12px; border:1px solid var(--linha); border-radius:4px}
.foz-liga .fl-k{margin:4px 0 0; font-family:var(--mono); font-size:11px; letter-spacing:.04em; color:var(--cinza)}
.foz-liga a{display:flex; align-items:center; min-height:44px; font-size:15px; font-weight:700; color:var(--amber); border-top:1px solid var(--linha)}
.foz-liga .fl-k + a{border-top:0}
/* pessoa → casos: o caso, o número da ficha e "elo por elo" */
.foz-liga a.fl-c{flex-wrap:wrap; align-items:baseline; gap:0 10px; padding:9px 0; text-decoration:none}
.foz-liga .fl-n{font-size:15px; font-weight:700; color:var(--tinta)}
.foz-liga .fl-v{font-size:17px; font-weight:800; color:var(--amber); font-variant-numeric:tabular-nums; white-space:nowrap}
.foz-liga .fl-x{margin-left:auto; font-size:14px; font-weight:700; color:var(--amber); white-space:nowrap}
.foz-liga a.fl-c:hover .fl-n{text-decoration:underline; text-underline-offset:3px}
/* graus de separação: o caminho de um nome até ele, de cima para baixo, como a cadeia da Foz */
.grau{margin:10px 0 12px; padding:10px 12px 6px; border:1px solid var(--linha); border-left:3px solid var(--tinta); border-radius:4px; background:rgba(216,239,221,.03)}
.grau .vlbl{margin:0 0 8px; font-family:var(--mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--cinza)}
.grau .vlbl b{font-family:var(--sans); font-size:15px; font-weight:800; letter-spacing:0; text-transform:none; color:var(--tinta); margin-left:4px}
.grau .vlbl span{text-transform:none; letter-spacing:0}
.elos{list-style:none; margin:0; padding:0 0 0 18px; position:relative}
.elos::before{content:""; position:absolute; left:5px; top:10px; bottom:12px; width:2px; background:rgba(216,239,221,.35)}
.elo-p{position:relative; margin:0; padding:2px 0; font-size:15px; line-height:1.4; color:var(--tinta)}
.elo-p::before{content:""; position:absolute; left:-18px; top:7px; width:12px; height:12px; border-radius:50%; background:var(--st-outros); box-shadow:0 0 0 3px var(--leve)}
.elo-p.grave::before{background:var(--st-grave)} .elo-p.medio::before{background:var(--st-medio)}
.elo-p.ele::before{background:var(--leve); border:2px solid var(--tinta); box-sizing:border-box}
.elo-p .chip{margin-left:2px}
.elo-n{padding:0; border:0; background:none; font:700 15px/1.4 var(--sans); color:var(--tinta); text-align:left; cursor:pointer; text-decoration:underline; text-decoration-color:var(--cinza2); text-underline-offset:3px}
.elo-n:hover{text-decoration-color:var(--tinta)}
.elo-l{margin:2px 0 6px; padding:0; font-size:13.5px; line-height:1.45; color:var(--cinza)}
.elo-l .src{display:block; font-family:var(--mono); font-size:11px}
.elo-l .chip{font-size:10px}
.grau-a{display:flex; flex-wrap:wrap; align-items:center; gap:4px 16px; margin:8px 0 4px}
.sheet .grau{margin:12px 0}
.gr-t{margin:0 0 4px; font-size:14px; line-height:1.45; color:var(--tinta)}
.sit i{display:block; flex-basis:100%; order:3; font-style:normal; font-size:12.5px; color:var(--cinza); margin-top:-2px}
.sit{flex-wrap:wrap}

/* ===== CRONOLOGIA ===== */
.cr-topo{max-width:760px; margin:0 0 6px; padding:12px 14px 10px; border:1px solid var(--linha); border-radius:4px; background:var(--leve)}
.cr-topo p{margin:0 0 10px; font-size:15px; color:var(--tinta)}
.cr-topo p b{font-weight:800}
.hist{display:flex; align-items:flex-end; gap:2px; height:92px}
.h-b{position:relative; flex:1 1 0; min-width:0; height:100%; padding:0; border:0; background:none; cursor:pointer; display:flex; align-items:flex-end}
.h-b i{display:block; width:100%; height:var(--h); min-height:2px; background:var(--amber); border-radius:1px 1px 0 0}
.h-b.vz{cursor:default}
.h-b.vz i{background:var(--cinza2); opacity:.35; min-height:1px}
.h-b:not(.vz):hover i{background:#ffc766}
.h-eixo{display:flex; justify-content:space-between; margin:4px 0 0; font-family:var(--mono); font-size:11px; color:var(--cinza)}
.cr-modo{margin:14px 0 0}
.cr-ano{max-width:760px; margin:18px 0 0}
.cr-h{position:sticky; top:var(--hdr,57px); z-index:2; display:flex; align-items:baseline; gap:10px; margin:0; padding:6px 0; background:var(--papel); border-bottom:1px solid var(--linha)}
.cr-y{font-size:27px; font-weight:800; letter-spacing:-.01em; color:var(--tinta); font-variant-numeric:tabular-nums}
.cr-n{font-family:var(--mono); font-size:11px; color:var(--cinza)}
.cr-it{display:grid; grid-template-columns:50px minmax(0,1fr); gap:0 10px; width:100%; padding:9px 0; border:0; border-top:1px solid rgba(116,255,150,.08); background:none; text-align:left; font:inherit; color:inherit}
.cr-l > .cr-it:first-child{border-top:0}
button.cr-it{cursor:pointer}
button.cr-it:hover .cr-t{text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px}
.cr-d{padding-top:2px; font-family:var(--mono); font-size:12px; color:var(--cinza); font-variant-numeric:tabular-nums}
.cr-t{font-size:15px; line-height:1.38; color:var(--tinta)}
.cr-it.marco .cr-t{font-weight:700}
.cr-k{grid-column:2; margin-top:2px; font-family:var(--mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--cinza)}
.cr-k a{display:inline-block; padding:10px 6px; margin:-10px -6px; text-transform:none; letter-spacing:0; color:var(--azul)}
.cr-k .chip{font-size:10.5px; padding:0 5px}
.cr-mes{margin:14px 0 0; font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--cinza)}
/* por pasta: uma faixa por pasta, um ponto por fato (âmbar; vermelho só condenação) */
.swimlanes{max-width:900px; margin:14px 0 0; padding:12px 14px; border:1px solid var(--linha); border-radius:4px; background:var(--leve); overflow-x:auto}
.sl-axis{display:flex; justify-content:space-between; margin:0 0 8px 150px; font-family:var(--mono); font-size:11px; color:var(--cinza)}
.sl-lane{display:flex; align-items:center; gap:10px; padding:6px 0; border-top:1px solid rgba(116,255,150,.08)}
.sl-name{flex:0 0 140px; width:140px; text-align:right; font-size:12px; line-height:1.2; color:var(--cinza)}
.sl-track{position:relative; flex:1; height:16px; min-width:260px}
.sl-dot{position:absolute; top:3px; width:10px; height:10px; border-radius:50%; transform:translateX(-50%); padding:0; border:0; background:var(--amber); cursor:pointer}
.sl-dot.grave{background:var(--carimbo)}
.sl-dot:hover{outline:2px solid var(--tinta); z-index:2}
@media (max-width:599px){
  .sl-name{flex-basis:84px; width:84px}
  .sl-track{min-width:0}
  .sl-axis{margin-left:94px}
}

/* ===== PERGUNTE AO ARQUIVO ===== */
.chat-shell{max-width:760px}
.chat-form{display:flex; gap:8px; margin:0 0 10px}
.chat-form .busca-box{flex:1; margin:0}
.chat-form button{min-height:48px; padding:0 16px; border:1.5px solid var(--amber); border-radius:2px; background:var(--amber); color:#120c00; font:700 15px var(--sans); cursor:pointer}
.chat-chips{margin:0 0 6px}
.chat-msgs{display:flex; flex-direction:column}
.resp{margin:18px 0 0; padding:14px 0 0; border-top:1px solid var(--linha)}
.resp-q{margin:0 0 6px; font-family:var(--mono); font-size:12px; color:var(--cinza)}
.resp-q b{font-family:var(--sans); font-size:17px; font-weight:800; color:var(--tinta)}
.resp-i{margin:0 0 4px; font-size:15px; color:var(--tinta)}
/* a busca única: os resultados em fichas (o .afl da Foz), por grupo: casos, nomes, BolsoZap, registros */
.bg .kx{margin:22px 0 8px}
.bfs{display:flex; flex-direction:column}
.bf{margin:0 0 10px; padding:10px 12px 6px; border:1px solid var(--linha); border-radius:4px; background:var(--leve); color:var(--tinta)}
.bf-k{margin:0 0 4px; font-family:var(--mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--cinza)}
.bf-n{margin:0 0 6px; font-size:17px; line-height:1.25; font-weight:800; color:var(--tinta)}
.bf .numero.ficha{margin:0 0 4px}
.bf-t{margin:0 0 6px; font-size:14.5px; line-height:1.45; color:var(--tinta)}
.bf-m{margin:0 0 6px; font-size:16px; line-height:1.45; color:var(--tinta)}
.bf-papel{margin:0 0 6px; font-size:14px; line-height:1.45; color:var(--cinza)}
.bf-chips{margin:0 0 6px}
.bf-chips .chip{margin:0 4px 4px 0}
.bf-s{margin:0 0 6px; padding-left:9px; border-left:2px solid var(--tinta); font-size:14px; line-height:1.45; color:var(--tinta)}
.bf-c{margin:0 0 6px; font-size:14px; line-height:1.45; color:var(--cinza)}
.bf-c a{color:var(--amber); font-weight:700}
.bf-q{margin:2px 0 6px; padding:0 0 0 10px; border-left:2px solid var(--tinta); font-size:16px; line-height:1.45; color:var(--tinta)}
.bf-q cite{display:block; margin-top:3px; font-style:normal; font-size:13px; color:var(--cinza)}
.bf-f{margin:0 0 4px; font-family:var(--mono); font-size:12px; color:var(--cinza)}
.bf-f a{display:inline-block; padding:8px 0; margin:-8px 0; color:var(--azul)}
.bf-a{display:flex; flex-wrap:wrap; align-items:center; gap:2px 16px}
.bf-p,.bf-a .zap-l{display:inline-flex; align-items:center; min-height:44px; padding:0; border:0; background:none; font:700 15px var(--sans); color:var(--amber); cursor:pointer; text-decoration:none}
.bf-p:hover,.bf-a .zap-l:hover{text-decoration:underline; text-underline-offset:3px}
.resp-i .bf-p{min-height:0}
.bf-tb{margin:0 0 6px; font-size:14px; color:var(--cinza); max-width:760px}
.bf-tb .lm{display:inline; min-height:0; margin:0; padding:6px 0; font-size:14px; text-align:left}

/* ===== a folha (ficha de um registro ou de um nome): sobe do pé, como na Foz ===== */
.overlay{position:fixed; inset:0; z-index:60; display:none; background:rgba(0,0,0,.62)}
.overlay.open{display:block}
.sheet{position:absolute; left:0; right:0; bottom:0; max-height:88vh; max-height:88dvh; overflow:auto; overscroll-behavior:contain; padding:14px 16px 30px; background:#0a100a; border-top:1px solid var(--linha); border-radius:14px 14px 0 0; overflow-wrap:break-word}
@media (min-width:760px){ .sheet{left:50%; right:auto; width:720px; transform:translateX(-50%); border:1px solid var(--linha); border-bottom:0; padding:18px 22px 32px} }
.sheet .fx{position:sticky; top:0; z-index:2; float:right; min-height:44px; padding:0 12px; margin:0 0 6px 10px; border:1px solid var(--linha); border-radius:3px; background:#0a100a; color:var(--tinta); font:13px var(--mono); cursor:pointer}
.sheet .fx:hover{border-color:var(--tinta)}
.f-k{margin:4px 0 6px; font-family:var(--mono); font-size:11px; line-height:1.5; letter-spacing:.06em; text-transform:uppercase; color:var(--cinza)}
.f-k .chip{font-size:10.5px; padding:0 5px}
.f-t{margin:0 0 10px; font-size:22px; line-height:1.22; font-weight:800; color:var(--tinta)}
.f-r{margin:0 0 12px; font-size:16px; line-height:1.5; color:var(--tinta)}
.sheet .ressalva{border-left:2px solid var(--cinza2); padding:2px 0 2px 10px; margin:0 0 12px}
.f-a{display:flex; flex-wrap:wrap; align-items:center; gap:4px 18px; margin:4px 0 8px}
.f-sub{clear:both; margin:18px 0 6px; font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--cinza)}
.f-fontes{list-style:none; margin:0; padding:0}
.f-fontes li{padding:6px 0; border-top:1px solid var(--linha)}
.f-fontes li:first-child{border-top:0}
.f-fontes a{display:inline-flex; align-items:center; min-height:36px; font-family:var(--mono); font-size:13px; color:var(--azul)}
.f-fontes q{display:block; margin:0 0 4px; font-size:14px; line-height:1.45; color:var(--cinza)}
.creditos li{font-size:13px; color:var(--cinza); line-height:1.45}
.creditos a{min-height:0; font-size:12px}
.f-fontes .tier{font-family:var(--mono); font-size:11px; color:var(--cinza); margin-left:8px}
.f-midia{margin:0 0 6px; font-size:15px}
.f-midia a{font-weight:700}
.f-pes{display:flex; flex-wrap:wrap; gap:6px}
.f-pes button{min-height:36px; padding:0 10px; border:1px solid var(--cinza2); border-radius:2px; background:transparent; color:var(--tinta); font:600 13px var(--sans); cursor:pointer}
.f-pes button:hover{border-color:var(--tinta)}
.nofonte{color:var(--cinza)}
/* ficha de um nome */
.p-top{display:flex; gap:12px; align-items:flex-start}
.p-foto{flex:0 0 auto; width:64px; height:64px; border-radius:50%; object-fit:cover; border:3px solid var(--st-outros); background:var(--leve)}
.p-foto.grave{border-color:var(--st-grave)} .p-foto.medio{border-color:var(--st-medio)} .p-foto.ele{border-color:var(--tinta)}
.p-papel{margin:0 0 8px; font-size:15px; line-height:1.4; color:var(--cinza)}
.p-st{margin:0 0 10px; padding-left:10px; border-left:2px solid var(--tinta); font-size:15px; line-height:1.5; color:var(--tinta)}
.p-st a{font-family:var(--mono); font-size:12px}
.p-chips{display:flex; flex-wrap:wrap; gap:6px; margin:0 0 8px}
.sheet .vrow{padding:9px 0; border-top:1px solid var(--linha); font-size:14px; line-height:1.45; color:var(--cinza); cursor:pointer}
.sheet .vrow b{color:var(--tinta)}
.v-st{font-size:13px; color:var(--cinza)}
.sheet .vrow:hover b{text-decoration:underline; text-underline-offset:3px}
.metodo-b p{margin:0 0 12px; font-size:15px; line-height:1.5}
.metodo-b h3{margin:16px 0 4px; font-size:15px; font-weight:800; color:var(--tinta)}

/* ===== rodapé ===== */
.site-footer{margin-top:40px; padding-top:16px; border-top:1px solid var(--linha); display:flex; gap:6px 18px; align-items:center; flex-wrap:wrap}
#link-metodo{display:inline-flex; align-items:center; min-height:44px; padding:0; border:0; background:none; font:14px var(--sans); color:var(--tinta); text-decoration:underline; text-underline-offset:3px; text-decoration-color:var(--cinza2); cursor:pointer}
#link-metodo:hover{text-decoration-color:var(--tinta)}
.foot-dim{font-size:13px; color:var(--cinza)}

/* iPhone: campo com fonte abaixo de 16 px faz o Safari dar zoom ao tocar */
input{font-size:16px}
/* no toque, os controles de zoom só na tela cheia */
@media (pointer:coarse){ .canvas-box:not(.tela-cheia) .teia-ctl{display:none} }
/* integrador Onda 1 (CLS a 1,6 Mbps): o destaque do Recentemente entra pelo app.js depois do dados.js inteiro; até lá o
   espaço fica reservado (medido com o registro em destaque em 27/09), senão a lista pinta no alto e desce ~470 px */
.rec-dq:empty{min-height:340px}
@media (max-width:767px){.rec-dq:empty{min-height:366px}}
@media (max-width:599px){.rec-dq:empty{min-height:388px}}
@media (max-width:470px){.rec-dq:empty{min-height:414px}}
@media (max-width:410px){.rec-dq:empty{min-height:467px}}
@media (max-width:370px){.rec-dq:empty{min-height:493px}}
@media (max-width:340px){.rec-dq:empty{min-height:559px}}
/* Pergunte ao arquivo (integrador, Onda 2): a resposta de ?busca= / do menu chega no DOMContentLoaded; a vista ocupa a
   tela desde a 1ª pintura para o rodapé e o "siga o rio" não pularem (CLS 0,17 → 0 a 1280) */
#view-chat.active{min-height:100vh}