@font-face{font-family:Archivo;font-weight:100 900;font-display:swap;src:url(fontes/archivo.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:400;font-display:swap;src:url(fontes/plex-mono-400.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:500;font-display:swap;src:url(fontes/plex-mono-500.woff2) format("woff2")}

:root{
  --fundo:#0d0c10;--painel:rgba(22,21,27,.92);--painel2:#22202a;--linha:rgba(255,255,255,.1);--linha2:rgba(255,255,255,.2);
  --texto:#f3f1ee;--texto2:#b7b3ad;--texto3:#817d77;
  --c0:#5c2d91;--c1:#a23a8e;--c2:#de4968;--c3:#fe9f6d;--c4:#fcfdbf;
  --sans:Archivo,system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --m:12px;--raio:14px;--baixo:env(safe-area-inset-bottom,0px);--cima:env(safe-area-inset-top,0px);
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;overscroll-behavior:none;background:var(--fundo);color:var(--texto);font:400 14px/1.4 var(--sans);-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;touch-action:manipulation}
a{color:inherit}
:focus-visible{outline:2px solid var(--c4);outline-offset:2px}
[hidden]{display:none!important}

#mapa{position:fixed;inset:0}
body::before,body::after{content:"";position:fixed;left:0;right:0;z-index:2;pointer-events:none}
body::before{top:0;height:calc(236px + var(--cima));background:linear-gradient(rgba(13,12,16,.88),rgba(13,12,16,.55) 55%,transparent)}
body::after{bottom:0;height:calc(150px + var(--baixo));background:linear-gradient(transparent,rgba(13,12,16,.6) 50%,rgba(13,12,16,.9))}
.maplibregl-ctrl-bottom-right{bottom:calc(64px + var(--baixo) + 26px);z-index:3}
.maplibregl-ctrl-attrib{background:rgba(13,12,16,.7)!important;color:var(--texto3)}
.maplibregl-ctrl-attrib a{color:var(--texto2)}

.topo{position:fixed;left:var(--m);top:calc(var(--m) + var(--cima));z-index:3;display:flex;flex-direction:column;align-items:flex-start;gap:4px;pointer-events:none}
.topo>*{pointer-events:auto}
h1{margin:0;font:700 22px/1 var(--sans);letter-spacing:-.01em;font-stretch:88%;text-shadow:0 1px 12px rgba(0,0,0,.8)}
h1 span{display:block;margin-top:2px;font:500 14px/1.3 var(--sans);font-stretch:100%;letter-spacing:0;color:var(--texto2)}
.fonte{font:400 12px/1.3 var(--sans);color:var(--texto2);text-decoration:underline;text-decoration-color:var(--linha2);text-underline-offset:3px;text-shadow:0 1px 8px rgba(0,0,0,.9)}

.controles{position:fixed;left:0;right:0;top:calc(var(--m) + var(--cima) + 62px);z-index:3;display:flex;flex-direction:column;align-items:flex-start;gap:6px;pointer-events:none}
.controles>*{pointer-events:auto}
#f-periodo{margin-left:var(--m)}
.filtros{display:flex;gap:8px;max-width:100%;padding:0 var(--m);overflow-x:auto;scrollbar-width:none}
.filtros::-webkit-scrollbar{display:none}
.seg{display:flex;flex:none;padding:3px;border-radius:999px;background:var(--painel);border:1px solid var(--linha);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.seg button{padding:7px 12px;border-radius:999px;font-size:13px;color:var(--texto2);white-space:nowrap}
.seg button[aria-pressed=true]{background:var(--texto);color:var(--fundo);font-weight:600}

.nota-sit{position:fixed;left:var(--m);right:var(--m);top:calc(var(--m) + var(--cima) + 160px);z-index:3;margin:0;padding:8px 12px;border-radius:var(--raio);background:var(--painel);border:1px solid var(--c3);font-size:13px;line-height:1.35;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.legenda{position:fixed;left:var(--m);bottom:calc(64px + var(--baixo) + 28px);z-index:3;padding:8px 10px;border-radius:var(--raio);background:var(--painel);border:1px solid var(--linha);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font:400 11px/1.3 var(--mono);color:var(--texto2);max-width:calc(100vw - 2*var(--m))}
.legenda b{display:block;margin-bottom:6px;font:400 12px/1.3 var(--sans);color:var(--texto2)}
.legenda ol{display:flex;gap:2px;margin:0;padding:0;list-style:none}
.legenda li{display:flex;flex-direction:column;gap:3px;min-width:44px}
.legenda i{height:8px;border-radius:2px}

.acoes{position:fixed;left:0;right:0;bottom:calc(var(--baixo) + 26px);z-index:3;display:flex;gap:6px;padding:0 var(--m);overflow-x:auto;scrollbar-width:none}
.acoes::-webkit-scrollbar{display:none}
.acoes button{flex:none;padding:10px 14px;border-radius:999px;background:var(--painel);border:1px solid var(--linha);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-size:13px;white-space:nowrap}
.acoes .destaque{background:var(--c3);color:#1b0b12;border-color:transparent;font-weight:700}
.acoes button[aria-pressed=true]{background:var(--texto);color:var(--fundo)}

.rodape{position:fixed;left:var(--m);right:var(--m);bottom:calc(var(--baixo) + 5px);z-index:3;font:400 11px/1.4 var(--sans);color:var(--texto3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rodape button{text-decoration:underline;text-underline-offset:2px}
.rodape a{margin-left:6px}

.folha{position:fixed;left:0;right:0;bottom:0;z-index:5;max-height:60dvh;overflow-y:auto;padding:16px var(--m) calc(20px + var(--baixo));background:rgba(22,21,27,.97);border-top:1px solid var(--linha2);border-radius:var(--raio) var(--raio) 0 0}
.folha h2{margin:0 36px 2px 0;font:700 20px/1.15 var(--sans);font-stretch:88%}
.folha h3{margin:20px 0 6px;font:600 13px/1.3 var(--sans);color:var(--texto2)}
.folha p{margin:4px 0;color:var(--texto2)}
.fechar{position:absolute;right:8px;top:8px;width:36px;height:36px;border-radius:50%;font-size:20px;color:var(--texto2)}
.grande{font:500 44px/1 var(--mono);letter-spacing:-.02em}
.linha2{display:flex;flex-wrap:wrap;gap:2px 16px;margin:3px 0;font:400 14px/1.4 var(--sans);color:var(--texto2)}
.linha2 b{color:var(--texto);font:500 13px/1.4 var(--mono)}
.selo{display:inline-block;margin-top:8px;padding:3px 8px;border-radius:999px;font:500 11px/1.4 var(--mono);background:var(--painel2);border:1px solid var(--linha2)}
.selo.alerta{margin:8px 0 4px;padding:5px 10px;font:600 13px/1.4 var(--sans);color:#1b0b12;background:var(--c3);border-color:transparent}

.barras{display:flex;align-items:flex-end;gap:4px;height:92px}
.barra{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;min-width:0;font:400 10px/1.2 var(--mono);color:var(--texto3)}
.barra i{width:100%;min-height:2px;border-radius:3px 3px 0 0;background:var(--c2)}
.barra b{order:-1;margin-bottom:2px;font-weight:400;color:var(--texto2)}
.barra span{margin-top:3px;white-space:nowrap}
.barra.fora{opacity:.32}
.barra.parcial i{background:repeating-linear-gradient(135deg,var(--c2) 0 3px,transparent 3px 6px);outline:1px solid var(--c2);outline-offset:-1px}
.lista{margin:0;padding:0;list-style:none}
.lista li{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--linha)}
.lista li span:last-child,.lista button span:last-child{font-family:var(--mono);color:var(--texto2);white-space:nowrap}
.lista button{display:flex;justify-content:space-between;gap:12px;width:100%;text-align:left}
.nota{font-size:12px;color:var(--texto3)}
.copiar{margin-top:16px;padding:10px 14px;border-radius:999px;border:1px solid var(--linha2);font-size:13px}

.regua p{flex-basis:100%;margin:2px 4px 0;font-size:12px;color:var(--texto2)}
.regua{flex-wrap:wrap;position:fixed;left:var(--m);right:var(--m);bottom:calc(64px + var(--baixo) + 28px);z-index:4;display:flex;align-items:center;gap:6px;padding:8px;border-radius:var(--raio);background:var(--painel);border:1px solid var(--linha2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.regua .tocar{flex:none;width:40px;height:40px;border-radius:50%;background:var(--c3);color:#1b0b12;font-weight:700}
.regua ol{flex:1;display:flex;gap:4px;margin:0;padding:0;list-style:none}
.regua li{flex:1}
.regua li button{width:100%;padding:8px 0;border-radius:8px;font:400 11px/1.2 var(--mono);color:var(--texto2);background:var(--painel2)}
.regua li button[aria-current=true]{background:var(--texto);color:var(--fundo);font-weight:500}
.regua small{display:block;font-size:9px;opacity:.75}

dialog{width:min(560px,calc(100vw - 2*var(--m)));max-height:82dvh;padding:20px;border:1px solid var(--linha2);border-radius:var(--raio);background:#16151b;color:var(--texto)}
dialog::backdrop{background:rgba(0,0,0,.6)}
dialog.busca{margin:calc(var(--cima) + 10px) auto auto;padding:10px;max-height:calc(100dvh - 20px)}
.busca .campo{display:flex;align-items:center;gap:6px}
.busca input{flex:1;min-width:0;padding:11px 14px;border-radius:999px;border:1px solid var(--linha2);background:var(--painel2);color:var(--texto);font:400 16px/1.3 var(--sans)}
.busca input::placeholder{color:var(--texto3)}
.busca .fechar{position:static;flex:none}
.busca .lista{max-height:min(60dvh,440px);overflow-y:auto;margin-top:6px}
.busca .lista button{flex-direction:column;align-items:flex-start;gap:1px;padding:9px 6px;border-radius:8px}
.busca .lista li{padding:0}
.busca .lista button[aria-selected=true],.busca .lista button:hover{background:var(--painel2)}
.busca .lista small{font:400 12px/1.3 var(--sans);color:var(--texto3)}
.busca .nota{margin:8px 6px 4px}
dialog h2{margin:0 36px 10px 0;font:700 20px/1.15 var(--sans);font-stretch:88%}
dialog p,dialog li{color:var(--texto2);line-height:1.5}
dialog ul{padding-left:18px}
dialog a{color:var(--c3)}

.carregando{position:fixed;left:50%;top:50%;z-index:1;transform:translate(-50%,-50%);margin:0;padding:10px 16px;border-radius:999px;background:var(--painel);border:1px solid var(--linha);font-size:14px;color:var(--texto2)}
.aviso{position:fixed;left:50%;top:calc(var(--cima) + 120px);z-index:9;transform:translateX(-50%);max-width:calc(100vw - 2*var(--m));margin:0;padding:10px 14px;border-radius:var(--raio);background:#2a1620;border:1px solid var(--c2);font-size:13px;text-align:center}

@media (min-width:860px){
  .folha{left:auto;right:var(--m);top:calc(var(--m) + 110px);bottom:auto;width:380px;max-height:calc(100dvh - 220px);border:1px solid var(--linha2);border-radius:var(--raio)}
  .regua{left:50%;right:auto;width:520px;transform:translateX(-50%)}
  .nota-sit{right:auto;max-width:520px;top:calc(var(--m) + var(--cima) + 114px)}
  .controles{right:auto;flex-direction:row;gap:8px}
  .filtros{padding-left:0}
  body::before{height:calc(190px + var(--cima))}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}