:root{
  /* Paleta da marca 1607: verde-floresta profundo, dourado e creme. */
  --brand-deep:#101d13;      /* verde do logo — topo e rodapé */
  --brand-deep-2:#16291b;
  --brand-gold:#c6a85c;      /* dourado do "1607" */
  --brand-gold-soft:#e0cd96;
  --bg:#eef1e9; --surface:#fffefb; --surface-2:#e6ebe1;
  --ink:#23291f; --ink-soft:#55604c; --ink-faint:#8a917f;
  --line:#d3dcd0; --accent:#2f5d3a; --accent-2:#3f7a4c; --gold:#9a7b32;
  --crit:#a8322d; --high:#c25b1d; --mod:#b78908; --low:#3f7a4c; --info:#35618e; --unver:#726a58;
  --sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --mono:ui-monospace,"Cascadia Code",Consolas,monospace;
  --radius:8px;
}
*{box-sizing:border-box}
/* Âncora tipográfica da interface. Quase todo tamanho da folha está em `rem`,
   que se mede pelo `html` (16px por padrão) e NÃO pelo `body` — então é aqui
   que se regula a legibilidade de toda a plataforma de uma vez. */
/* Escala mestre da interface. Tudo o mais é em rem, então este número sozinho
   aumenta ou diminui a plataforma inteira. 16px é o padrão do navegador; abaixo
   disso a tela ganha densidade sem perder legibilidade. */
html{font-size:15.5px}
body{margin:0;font-family:var(--sans);color:var(--ink);font-size:.94rem;line-height:1.55;
  background:
    radial-gradient(ellipse 130% 66% at 50% -6%, rgba(16,29,19,.30), transparent 60%),
    linear-gradient(180deg, #bed0b6 0%, #cddcc4 42%, #b7cbae 100%);
  background-attachment:fixed}

/* Marca d'água: a marca da 1607 recortada (PNG com alfa) ocupa o centro da
   tela. Sem retângulo de fundo — só o desenho, em verde da marca.
   `fixed` mantém a marca parada enquanto a página rola. */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:url(/static/marca.png) center 46%/min(74vmin,720px) no-repeat;
  opacity:.10}
.topbar,.container,.auth-wrap{position:relative;z-index:1}
.hidden{display:none !important}
a{color:var(--accent-2);text-decoration:none}
h1{font-family:var(--serif);font-size:1.42rem;margin:0;color:var(--accent);font-weight:600}
h2{font-family:var(--serif);color:var(--accent);font-weight:600}
h3{margin:0 0 10px;font-size:1rem}
.muted{color:var(--ink-faint);font-size:.85rem}
.error{color:var(--crit);font-size:.85rem}

/* Buttons */
.btn{font:inherit;border:1px solid var(--line);background:var(--surface);color:var(--ink);
  padding:8px 14px;border-radius:6px;cursor:pointer;font-size:.88rem}
.btn:hover{border-color:var(--accent-2)}
.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn.primary:hover{background:var(--accent-2)}
.btn.ghost{background:transparent;border-color:transparent;color:var(--ink-soft)}
.btn.ghost:hover{background:var(--surface-2)}

/* Auth */
.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:20px;
  background-color:#14170f;
  background-image:linear-gradient(rgba(16,29,19,.58), rgba(16,29,19,.78)), url(/static/logo-marca.jpg);
  background-size:contain;background-position:center;background-repeat:no-repeat}
.auth-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;
  padding:32px;width:100%;max-width:380px;display:flex;flex-direction:column;gap:12px;
  box-shadow:0 12px 40px rgba(35,41,31,.08)}
.auth-card .logo{width:130px;height:auto;display:block;margin:0 auto 4px;border-radius:10px}
.brand{font-family:var(--serif);font-size:1.6rem;font-weight:700;color:var(--accent)}
.brand span{color:var(--gold)}
.brand.small{font-size:1.15rem}
.auth-sub{margin:-6px 0 8px;color:var(--ink-faint);font-size:.85rem}
label{display:flex;flex-direction:column;gap:5px;font-size:.85rem;color:var(--ink-soft);font-weight:600}
input,select{font:inherit;padding:9px 11px;border:1px solid var(--line);border-radius:6px;
  background:var(--surface);color:var(--ink)}
input:focus,select:focus{outline:2px solid color-mix(in srgb,var(--accent) 40%,transparent);border-color:var(--accent-2)}

/* Topbar */
.topbar{display:flex;align-items:center;gap:24px;padding:12px 24px;
  background:linear-gradient(120deg,var(--brand-deep) 0%,var(--brand-deep-2) 55%,var(--brand-deep) 100%);
  border-bottom:2px solid var(--brand-gold);position:sticky;top:0;z-index:10;
  box-shadow:0 2px 18px rgba(16,29,19,.28)}
.topbar .brand{color:#f3f1e6}
.topbar .brand span{color:var(--brand-gold)}
.topbar nav{flex:1;display:flex;gap:2px}
.topbar nav a{padding:6px 11px;border-radius:6px;color:#c8d2c2;font-weight:600;font-size:.85rem;
  transition:background .15s,color .15s}
.topbar nav a:hover{background:rgba(198,168,92,.12);color:#f3f1e6}
.topbar nav a.active{background:rgba(198,168,92,.18);color:var(--brand-gold-soft);
  box-shadow:inset 0 -2px 0 var(--brand-gold)}
.topbar-right{display:flex;align-items:center;gap:12px}
.topbar-right .btn{background:rgba(255,255,255,.06);border-color:rgba(198,168,92,.45);color:#e8e4d5}
.topbar-right .btn:hover{background:rgba(198,168,92,.18);border-color:var(--brand-gold)}
.whoami{font-size:.8rem;color:#9fae9b}
/* logo da marca ao lado do nome, na barra */
.topbar-logo{height:34px;width:auto;border-radius:5px;
  box-shadow:0 0 0 1px rgba(198,168,92,.35)}

.container{max-width:1160px;margin:0 auto;padding:26px 24px 80px}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:18px;gap:16px}
.back{margin-bottom:12px}

/* Cards */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;cursor:pointer}
.card:hover{border-color:var(--accent-2);box-shadow:0 4px 16px rgba(35,41,31,.06)}
.card h3{color:var(--accent);font-family:var(--serif)}
.card .meta{font-size:.8rem;color:var(--ink-faint);margin-top:6px}

/* Tabs */
/* `wrap`: com a fonte maior a fila de abas não cabe em uma linha nas janelas
   estreitas. Quebrar em duas linhas mantém TODA aba visível — barra rolável
   esconderia aba, e aba escondida é aba que ninguém clica. */
.tabs{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--line);margin:8px 0 18px}
.tab{background:none;border:none;border-bottom:2px solid transparent;padding:8px 11px;
  cursor:pointer;font:inherit;font-size:.86rem;color:var(--ink-soft);font-weight:600;
  border-radius:6px 6px 0 0;
  transition:background .15s,color .15s}
.tab:hover{background:rgba(47,93,58,.07);color:var(--accent)}
.tab.active{color:var(--accent);border-bottom-color:var(--brand-gold);
  background:linear-gradient(180deg,rgba(198,168,92,.14),transparent)}

/* Superfícies OPACAS: o fundo verde é o ambiente, o conteúdo é branco.
   Nada de translucidez aqui — texto de laudo precisa de contraste máximo. */
.side,table,.map-toolbar,.map,.auth-card{background:#fffefb}

/* Cada propriedade é uma "janela": moldura dourada, elevação e faixa da marca
   no topo. O branco sólido destaca o cartão contra o verde do ambiente. */
.card{
  background:linear-gradient(160deg,#ffffff 0%,#fbfcf9 100%);
  border:1px solid var(--line);border-top:3px solid var(--brand-gold);
  border-radius:10px;padding:18px 20px 16px;position:relative;overflow:hidden;
  box-shadow:0 8px 26px rgba(16,29,19,.20), 0 2px 5px rgba(16,29,19,.12);
  transition:transform .16s, box-shadow .16s, border-color .16s}
.card::after{
  content:"";position:absolute;right:-26px;bottom:-26px;width:110px;height:110px;
  background:url(/static/marca.png) center/contain no-repeat;opacity:.05;
  pointer-events:none}
.card:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 32px rgba(16,29,19,.18), 0 2px 6px rgba(16,29,19,.10);
  border-color:var(--accent-2);border-top-color:var(--brand-gold)}
.card h3{color:var(--brand-deep);font-size:1.06rem;margin-bottom:8px;
  padding-bottom:8px;border-bottom:1px solid var(--surface-2)}
.card .meta{color:var(--ink-soft)}
.cards{gap:18px}

/* Cabeçalho de tabela na cor da marca — dá o mesmo peso do laudo */
thead th{background:linear-gradient(180deg,var(--brand-deep-2),var(--brand-deep));
  color:#f0eee2;font-weight:600;letter-spacing:.02em;border-bottom:2px solid var(--brand-gold)}
tbody tr:nth-child(even){background:rgba(230,235,225,.45)}
tbody tr:hover{background:rgba(198,168,92,.10)}

/* Map */
/* `minmax(0,1fr)`: com `1fr` puro a coluna do mapa não encolhe abaixo do
   min-content do que estiver dentro dela e empurra a lateral de 320px para
   fora da tela — a página inteira ganhava rolagem horizontal. O breakpoint
   subiu de 820px porque, com a fonte maior, a lateral já não convive com o
   mapa em janelas de ~900px. */
.map-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px}
@media(max-width:960px){.map-grid{grid-template-columns:minmax(0,1fr)}}
.map-box{position:relative}
.map{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  aspect-ratio:4/3;overflow:hidden;z-index:0}
.map svg{width:100%;height:100%}
.map-toolbar{display:flex;align-items:center;gap:10px;padding:8px 10px;margin-bottom:8px;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.mt-item{flex-direction:row;align-items:center;gap:6px;font-size:.82rem;color:var(--ink);
  font-weight:600;cursor:pointer}
.mt-item input{width:auto}
.mt-sep{color:var(--line)}
.leaflet-container{font-family:var(--sans)}
.legend{position:absolute;left:12px;bottom:12px;background:rgba(255,254,251,.92);
  border:1px solid var(--line);border-radius:6px;padding:8px 10px;font-size:.78rem;display:flex;
  flex-direction:column;gap:3px}
.legend .row{display:flex;align-items:center;gap:6px}
.legend .sw{width:12px;height:12px;border-radius:3px;border:1px solid rgba(0,0,0,.2)}
.side{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px}
.side form{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}
.layer-list{display:flex;flex-direction:column;gap:8px}
.layer-item{border:1px solid var(--line);border-radius:6px;padding:8px 10px;font-size:.8rem}
.layer-item .src{font-weight:700}

/* Tables */
table{width:100%;border-collapse:collapse;font-size:.85rem;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
th,td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{background:var(--surface-2);font-size:.79rem;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft)}
tr:last-child td{border-bottom:none}
.tabular{font-variant-numeric:tabular-nums;text-align:right}

/* Pills */
.pill{display:inline-block;font-size:.75rem;font-weight:700;padding:3px 9px;border-radius:100px;text-transform:uppercase}
.p-critico{background:#f4dcda;color:var(--crit)} .p-alto{background:#f6e3d3;color:var(--high)}
.p-moderado{background:#f6eccf;color:var(--mod)} .p-baixo{background:#dcebe0;color:var(--low)}
.p-informativo{background:#d9e5f0;color:var(--info)} .p-nao_verificado{background:#e6e3d9;color:var(--unver)}
.p-oficial{background:#dcebe0;color:var(--low)} .p-declaratorio{background:#f6eccf;color:var(--mod)}
.p-estimativa{background:#d9e5f0;color:var(--info)}

.banner{padding:12px 16px;border-radius:8px;margin-bottom:14px;font-weight:600;font-size:.9rem}
.banner.blocked{background:#f4dcda;color:var(--crit)}
.banner.ok{background:#dcebe0;color:var(--low)}

/* Modal */
.modal{position:fixed;inset:0;background:rgba(20,23,15,.45);display:grid;place-items:center;z-index:50;padding:20px}
.modal-card{background:var(--surface);border-radius:12px;padding:24px;width:100%;max-width:460px;
  display:flex;flex-direction:column;gap:12px}
.modal-card .row{display:grid;grid-template-columns:1fr 90px;gap:10px}
.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:6px}

.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--ink);
  color:#fff;padding:11px 18px;border-radius:8px;font-size:.85rem;z-index:60;box-shadow:0 8px 24px rgba(0,0,0,.2)}

/* Perfil terceiro: só envia documentos e vê a própria pasta — nada de
   análise, laudo, pessoas identificadas ou matriz de consultas. As duas
   últimas já eram bloqueadas no backend (403 se tentasse pela API); a aba
   continuava visível na tela, o que é confuso para quem só deveria ver
   Enviar arquivos / Documentos. */
.role-terceiro .prop-actions,
.role-terceiro #btn-new,
.role-terceiro .tab[data-tab="areas"],
.role-terceiro .tab[data-tab="achados"],
.role-terceiro .tab[data-tab="pesquisa"],
.role-terceiro .tab[data-tab="pessoas"],
.role-terceiro .tab[data-tab="consultas"],
.role-terceiro .doc-nota-box,
.role-terceiro #map-legend{display:none !important}

/* Área de arrastar e soltar */
.dropzone{border:2px dashed var(--line);border-radius:12px;background:var(--surface);
  padding:38px 24px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s}
.dropzone:hover{border-color:var(--accent-2)}
.dropzone.over{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 7%,var(--surface))}
.dz-icon{font-size:2.4rem;line-height:1}
.dz-title{font-family:var(--serif);font-size:1.25rem;color:var(--accent);margin:8px 0 4px;font-weight:600}
.dz-sub{color:var(--ink-faint);font-size:.85rem;max-width:60ch;margin:0 auto 14px}

/* Links de consulta nos achados — destacados e clicáveis */
a.lnk{color:#1c6fd6;text-decoration:underline;word-break:break-all;font-weight:600}
a.lnk:hover{color:#0d4ea6;background:color-mix(in srgb,#1c6fd6 10%,transparent);border-radius:3px}

.li-head{display:flex;align-items:center;gap:6px}
.li-del{margin-left:auto;padding:2px 8px;font-size:.9rem;line-height:1;color:var(--crit)}
.li-del:hover{background:color-mix(in srgb,var(--crit) 12%,transparent);border-color:transparent}
.table-wrap{overflow-x:auto}
.search-status{font-size:.82rem;padding:5px 8px}

.report-sections{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px;
  max-height:60vh;overflow-y:auto;overflow-x:hidden;margin:4px 0;padding-right:6px}
/* os blocos de aceite do bioma e do destinatário ocupam a largura toda */
.report-sections > .aceite-bioma,
.report-sections > .teste-contradicoes,
.report-sections > .dest-laudo{grid-column:1 / -1}
/* janela do laudo é mais larga: tem formulário de destinatário dentro */
#modal-report .modal-card{max-width:860px}
/* mandato: formulário em duas colunas, com rolagem própria */
#modal-mandato .modal-card{max-width:860px;max-height:92vh;overflow-y:auto}
.mnd-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}
.mnd-grid .mnd-full{grid-column:1 / -1}
@media(max-width:640px){.mnd-grid{grid-template-columns:1fr}}
#modal-report .dest-laudo input{width:100%}
.sec-row{flex-direction:row;align-items:center;gap:8px;font-weight:500;color:var(--ink);font-size:.85rem;cursor:pointer}
.sec-row input{width:auto}
.prop-actions{display:flex;gap:8px;align-items:center}
.btn.big{font-size:.95rem;font-weight:700;padding:11px 20px;letter-spacing:.03em;
  box-shadow:0 2px 10px color-mix(in srgb,var(--accent) 35%,transparent)}
.kpi-row{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0}
.kpi{flex:1 1 130px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);padding:14px 16px}
.kpi .v{font-family:var(--serif);font-size:1.6rem;color:var(--accent);font-weight:600;
  font-variant-numeric:tabular-nums}
.kpi .l{font-size:.79rem;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.05em}
.row{display:flex;gap:10px}
.row label{flex:1}

/* ---- comparativo de carteira ---- */
/* Empilhado e em largura total: o painel de emissão é formulário de digitação
   e não cabe na coluna estreita usada pelo mapa. */
.cmp-layout{display:flex;flex-direction:column;gap:22px}
.cmp-layout>div{min-width:0}
.cmp-layout .card{cursor:default;padding:18px 20px}
/* os campos do formulário ficam confortáveis, sem esticar demais a linha */
.cmp-layout .card>label,.cmp-layout .card .row{max-width:900px}
.cmp-layout input,.cmp-layout textarea,.cmp-layout select{width:100%}

/* teses e chancelas lado a lado quando há espaço */
.cmp-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:2px 22px;max-width:1000px}

/* caixas de seleção em lista (teses e chancelas do comparativo) */
label.check{display:flex;align-items:flex-start;gap:8px;font-size:.86rem;
  font-weight:400;padding:4px 0;cursor:pointer;line-height:1.35}
label.check input{flex:none;width:auto;margin:3px 0 0}