/* Barra superior no padrão do SST (identidade "Campo"): escura, menu por assunto com submenus explicados.
   No celular: cabeçalho compacto "Seção › Tela", gaveta lateral e barra inferior. */
:root{ --nav:#12151B; --nav-texto:#EEF1F6; --nav-suave:#A2AAB8; --nav-hover:rgba(255,255,255,.08); --nav-ativo:rgba(255,255,255,.14); --nav-borda:#262B34; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --nav:#0A0C10; --nav-hover:rgba(255,255,255,.07); --nav-ativo:rgba(255,255,255,.12); --nav-borda:#232833; } }
:root[data-theme="dark"]{ --nav:#0A0C10; --nav-hover:rgba(255,255,255,.07); --nav-ativo:rgba(255,255,255,.12); --nav-borda:#232833; }

#topTabs{display:none;}
.wrap{padding-top:6px;}
.barra svg, .barra-celular svg, .barra-inferior svg, .gaveta svg{width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; flex:none;}

/* computador */
.barra{position:sticky; top:0; z-index:30; height:62px; display:flex; align-items:center; gap:12px; padding:0 20px;
  background:var(--nav); color:var(--nav-texto); border-bottom:1px solid var(--nav-borda);
  box-shadow:0 1px 0 rgba(255,255,255,.04), 0 6px 16px -8px rgba(0,0,0,.5);}
.barra-marca{display:flex; align-items:center; gap:12px; color:inherit; text-decoration:none; white-space:nowrap;}
.barra-logo{width:36px; height:36px; padding:4px; border-radius:6px; background:#fff; display:grid; place-items:center; box-shadow:0 1px 2px rgba(0,0,0,.2);}
.barra-logo img{width:100%; height:100%; object-fit:contain;}
.barra-nome{display:flex; flex-direction:column; line-height:1.2;}
.barra-nome b{font-size:15px; font-weight:600; color:#fff; letter-spacing:-.01em;}
.barra-nome b span{font-weight:400; color:var(--nav-suave);}
.barra-nome small{font-size:12px; color:var(--nav-suave);}
.barra-divisor{width:1px; height:28px; background:var(--nav-borda); margin:0 6px;}
.barra-menu{display:flex; gap:4px; padding:4px; border-radius:12px; border:1px solid rgba(255,255,255,.06); background:rgba(255,255,255,.03);}
.secao{position:relative;}
.secao-botao{display:flex; align-items:center; gap:8px; height:36px; padding:0 12px; border:0; border-radius:8px; background:none;
  color:var(--nav-suave); font:inherit; font-size:14px; font-weight:600; cursor:pointer;}
.secao-botao svg:last-child{width:14px; height:14px; opacity:.7;}
.secao-botao:hover{background:var(--nav-hover); color:var(--nav-texto);}
.secao.ativa .secao-botao{background:var(--nav-ativo); color:#fff;}
.secao-botao:focus-visible, .barra-tema:focus-visible, .sub-item:focus-visible{outline:2px solid #8FB1F5; outline-offset:2px;}
.barra-espaco{flex:1;}
.barra-selo{font-size:11.5px; font-weight:600; color:var(--nav-suave); border:1px solid var(--nav-borda); border-radius:999px; padding:4px 10px; white-space:nowrap;}
.barra-selo:empty{display:none;}
.barra-tema{width:36px; height:36px; display:grid; place-items:center; flex:none; border-radius:8px; cursor:pointer;
  border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.05); color:var(--nav-texto);}
.barra-tema:hover{background:rgba(255,255,255,.1);}

/* submenu explicado */
.sub{position:absolute; top:calc(100% + 10px); left:0; width:330px; padding:6px; border-radius:14px; z-index:40;
  background:var(--surface); color:var(--text); border:1px solid var(--border);
  box-shadow:0 12px 32px -8px rgba(16,24,40,.18), 0 4px 8px -4px rgba(16,24,40,.06);}
.sub[hidden]{display:none;}
.sub-titulo{margin:0; padding:8px 12px 4px; font-size:12px; color:var(--text-2);}
.gaveta .sub-titulo{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em;}
.sub-item{display:flex; align-items:flex-start; gap:12px; padding:8px 12px; border-radius:10px; color:var(--text); text-decoration:none;}
.sub-item:hover{background:var(--surface-2);}
.sub-item.ativo{background:var(--brand-soft);}
.sub-icone{width:32px; height:32px; flex:none; display:grid; place-items:center; border-radius:8px; border:1px solid var(--border); background:var(--surface-2); color:var(--text-2); margin-top:1px;}
.sub-item.ativo .sub-icone{color:var(--brand); background:var(--surface); border-color:color-mix(in srgb, var(--brand) 30%, transparent);}
.sub-textos{display:flex; flex-direction:column; line-height:1.35; min-width:0;}
.sub-textos b{font-size:14px; font-weight:600;}
.sub-item.ativo .sub-textos b{color:var(--brand);}
.sub-textos small{font-size:12.5px; color:var(--text-2);}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .sub-item.ativo .sub-textos b, :root:not([data-theme="light"]) .sub-item.ativo .sub-icone{color:#8FB1F5;} }
:root[data-theme="dark"] .sub-item.ativo .sub-textos b, :root[data-theme="dark"] .sub-item.ativo .sub-icone{color:#8FB1F5;}

/* celular */
.barra-celular, .barra-inferior{display:none;}
.gaveta-fundo{position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:50;}
.gaveta{position:fixed; top:0; bottom:0; left:0; width:min(320px,86vw); z-index:51; overflow-y:auto; padding:12px 8px;
  background:var(--surface); border-right:1px solid var(--border); box-shadow:0 24px 64px -12px rgba(16,24,40,.3);}
.gaveta[hidden], .gaveta-fundo[hidden]{display:none;}
.gaveta-grupo + .gaveta-grupo{border-top:1px solid var(--border); margin-top:6px; padding-top:6px;}

@media (max-width:767px){
  .barra{display:none;}
  .barra-celular{position:sticky; top:0; z-index:30; display:flex; align-items:center; gap:10px; height:54px; padding:0 10px;
    background:var(--nav); color:var(--nav-texto); border-bottom:1px solid var(--nav-borda);}
  .barra-onde{flex:1; font-size:13.5px; color:var(--nav-suave); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .barra-onde b{color:#fff; font-weight:600;}
  .barra-onde span{opacity:.6; margin:0 2px;}
  .barra-inferior{position:fixed; left:0; right:0; bottom:0; z-index:30; display:grid; grid-template-columns:repeat(4,1fr);
    background:var(--surface); border-top:1px solid var(--border); padding:4px 4px calc(4px + env(safe-area-inset-bottom));}
  .barra-inferior a{display:flex; flex-direction:column; align-items:center; gap:2px; padding:6px 2px; border-radius:10px;
    font-size:11px; font-weight:600; color:var(--text-2); text-decoration:none;}
  .barra-inferior a.ativo{color:var(--brand); background:var(--brand-soft);}
  .barra-inferior svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;}
  body{padding-bottom:72px;}
}
@media (max-width:767px) and (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .barra-inferior a.ativo{color:#8FB1F5;} }
@media (max-width:767px){ :root[data-theme="dark"] .barra-inferior a.ativo{color:#8FB1F5;} }

/* aviso do endereço antigo (GitHub Pages) */
.mudou{min-height:100vh; display:grid; place-items:center; padding:16px; background:var(--bg);}
.mudou-cartao{max-width:420px; text-align:center; background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:32px 24px; box-shadow:var(--shadow);}
.mudou-cartao h1{font-size:20px; margin:16px 0 8px;}
.mudou-cartao p{color:var(--text-2); margin:0 0 20px;}
.mudou-botao{display:inline-block; background:#1D4FA3; color:#fff; font-weight:700; text-decoration:none; padding:12px 20px; border-radius:10px;}

@media print{ .barra, .barra-celular, .barra-inferior, .gaveta, .gaveta-fundo{display:none !important;} body{padding-bottom:0;} }
