/* Raviera Marketing — identidade compartilhada com a Intranet. */
@font-face {
  font-family: Inter; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url('../fonts/inter-latin-wght-normal.woff2') format('woff2');
}
:root {
  color-scheme: light;
  --marinho: #075eaa; --marinho-forte: #052a50; --marinho-claro: #087dc1;
  --azul: #087faa; --azul-suave: #35d0ff; --azul-nevoa: #e9f7fc;
  --verde: #208252; --verde-suave: #e6f5ed;
  --ambar: #98630b; --ambar-suave: #fff5df;
  --vermelho: #b53b45; --vermelho-suave: #fff0f0;
  --indigo: #6152ae; --indigo-suave: #f0edfb; --roxo: #8557b5;
  --fundo: #f4f7fb; --superficie: #fff; --superficie-2: #f7f9fc;
  --borda: #e3eaf2; --borda-forte: #cbd6e3;
  --texto: #162236; --texto-2: #586b82; --texto-3: #65768c;
  --raio: 7px; --raio-g: 10px;
  --sombra: 0 8px 28px rgba(31,55,86,.045);
  --sombra-alta: 0 18px 45px rgba(31,55,86,.11);
  --fonte: Inter, 'Segoe UI Variable', 'Segoe UI', system-ui, sans-serif;
  --menu-largura: 248px;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --fundo: #101215; --superficie: #171a1f; --superficie-2: #1e2228;
  --borda: #30353e; --borda-forte: #444d58;
  --texto: #e8ebf0; --texto-2: #b4bdc9; --texto-3: #98a3b1;
  --azul: #79bfe7; --azul-nevoa: #1c2c39;
  --verde: #6bd7a0; --verde-suave: #13362c;
  --ambar: #efc573; --ambar-suave: #362d1b;
  --vermelho: #ff929b; --vermelho-suave: #38212c;
  --indigo: #b1a5fb; --indigo-suave: #292644; --roxo: #c2a0f0;
  --sombra: none;
  --sombra-alta: 0 18px 45px rgba(0,0,0,.22);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: var(--fonte);
  font-size: 14px;
  line-height: 1.55;
  color: var(--texto);
  background: var(--fundo);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--azul); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { margin: 0; line-height: 1.25; font-weight: 650; letter-spacing: -.01em; }
h1 { font-size: clamp(1.55rem, 2.2vw, 2rem); font-weight: 700; letter-spacing: -.045em; }
h2 { font-size: 1.15rem; }
h3 { font-size: 1rem; }
p { margin: 0 0 .75rem; }
p:last-child { margin-bottom: 0; }

/* --- Estrutura ---------------------------------------------------------- */

.pagina { max-width: 1500px; min-width: 0; margin: 0 auto; padding: 30px 32px 32px; }
.pagina-estreita { max-width: 1120px; }

.cabecalho-pagina {
  display: flex; align-items: flex-end; gap: 1.25rem;
  flex-wrap: wrap; margin-bottom: 1.5rem;
}
.cabecalho-pagina .acoes { margin-left: auto; display: flex; gap: .6rem; flex-wrap: wrap; }
.subtitulo { color: var(--texto-2); font-size: .92rem; margin-top: .3rem; }

.cartao {
  background: var(--superficie);
  border: 1px solid var(--borda);
  border-radius: var(--raio-g);
  box-shadow: var(--sombra);
}
.cartao + .cartao { margin-top: 1.25rem; }
.cartao-cabeca {
  padding: 1.1rem 1.35rem;
  border-bottom: 1px solid var(--borda);
  display: flex; align-items: center; gap: .8rem; flex-wrap: wrap;
}
.cartao-cabeca h2, .cartao-cabeca h3 { margin: 0; }
.cartao-cabeca .direita { margin-left: auto; }
.cartao-corpo { padding: 1.35rem; }
.cartao-corpo.compacto { padding: .85rem 1.35rem; }

.grade { display: grid; gap: 1.25rem; }
.grade-detalhe { grid-template-columns: minmax(0, 1fr) 340px; align-items: start; }
@media (max-width: 1080px) { .grade-detalhe { grid-template-columns: 1fr; } }

.trilha { display: flex; gap: .4rem; align-items: center; font-size: .82rem; color: var(--texto-3); margin-bottom: .8rem; }
.trilha a { color: var(--texto-2); }

/* --- Mensagens --------------------------------------------------------- */

.avisos { display: grid; gap: .6rem; margin-bottom: 1.25rem; }
.aviso {
  padding: .8rem 1rem; border-radius: var(--raio);
  border: 1px solid; font-size: .92rem;
  display: flex; gap: .6rem; align-items: flex-start;
}
.aviso-sucesso { background: var(--verde-suave);    border-color: color-mix(in srgb, var(--verde) 30%, transparent); color: color-mix(in srgb, var(--verde) 75%, var(--texto)); }
.aviso-erro    { background: var(--vermelho-suave); border-color: color-mix(in srgb, var(--vermelho) 30%, transparent); color: color-mix(in srgb, var(--vermelho) 78%, var(--texto)); }
.aviso-aviso   { background: var(--ambar-suave);    border-color: color-mix(in srgb, var(--ambar) 30%, transparent); color: color-mix(in srgb, var(--ambar) 80%, var(--texto)); }
.aviso-info    { background: var(--azul-nevoa);     border-color: color-mix(in srgb, var(--azul) 26%, transparent); color: color-mix(in srgb, var(--azul) 80%, var(--texto)); }

/* --- Botões ------------------------------------------------------------- */

.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  padding: .55rem 1.05rem;
  border-radius: 10px;
  border: 1px solid var(--borda-forte);
  background: var(--superficie);
  color: var(--texto);
  font: inherit; font-size: .9rem; font-weight: 600;
  cursor: pointer;
  transition: transform .06s ease, box-shadow .15s ease, background .15s ease;
  text-decoration: none;
}
.botao:hover { text-decoration: none; box-shadow: var(--sombra); }
.botao:active { transform: translateY(1px); }
.botao:disabled { opacity: .55; cursor: not-allowed; }
.botao-primario   { background: var(--marinho); border-color: var(--marinho); color: #fff; }
.botao-primario:hover { background: var(--marinho-claro); }
.botao-positivo   { background: #208252; border-color: #208252; color: #fff; }
.botao-positivo:hover { filter: brightness(1.08); }
.botao-alerta     { background: var(--ambar-suave); border-color: color-mix(in srgb, var(--ambar) 40%, transparent); color: color-mix(in srgb, var(--ambar) 85%, var(--texto)); }
.botao-destrutivo { background: var(--superficie); border-color: color-mix(in srgb, var(--vermelho) 45%, transparent); color: var(--vermelho); }
.botao-destrutivo:hover { background: var(--vermelho-suave); }
.botao-fantasma   { background: transparent; border-color: transparent; color: var(--texto-2); }
.botao-fantasma:hover { background: var(--superficie-2); border-color: var(--borda); }
.botao-pequeno    { padding: .35rem .7rem; font-size: .82rem; border-radius: 8px; }
.botao-largo      { width: 100%; }

/* --- Selos de status ---------------------------------------------------- */

.selo {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .22rem .6rem;
  border-radius: 5px;
  font-size: .78rem; font-weight: 650;
  border: 1px solid transparent;
  white-space: nowrap;
}
.selo::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
.selo-cinza        { background: var(--superficie-2); border-color: var(--borda); color: var(--texto-2); }
.selo-cinza-escuro { background: var(--superficie-2); border-color: var(--borda-forte); color: var(--texto-3); }
.selo-ambar        { background: var(--ambar-suave);  border-color: color-mix(in srgb, var(--ambar) 28%, transparent);  color: var(--ambar); }
.selo-azul         { background: var(--azul-nevoa);   border-color: color-mix(in srgb, var(--azul) 28%, transparent);   color: var(--azul); }
.selo-indigo       { background: var(--indigo-suave); border-color: color-mix(in srgb, var(--indigo) 28%, transparent); color: var(--indigo); }
.selo-vermelho     { background: var(--vermelho-suave); border-color: color-mix(in srgb, var(--vermelho) 28%, transparent); color: var(--vermelho); }
.selo-verde        { background: var(--verde-suave);  border-color: color-mix(in srgb, var(--verde) 28%, transparent);  color: var(--verde); }
.selo-verde-claro  { background: var(--verde-suave);  border-color: color-mix(in srgb, var(--verde) 22%, transparent);  color: color-mix(in srgb, var(--verde) 82%, var(--texto)); }
.selo-atraso       { background: #b53b45; border-color: #b53b45; color: #fff; }
.selo-atraso::before { background: #fff; }

.etiqueta {
  display: inline-block; padding: .16rem .5rem;
  border-radius: 6px; font-size: .74rem; font-weight: 600;
  background: var(--superficie-2); border: 1px solid var(--borda); color: var(--texto-2);
}

/* --- Tabelas ------------------------------------------------------------ */

.tabela-envolta { overflow-x: auto; }
table.tabela { width: 100%; border-collapse: collapse; font-size: .9rem; }
table.tabela th {
  text-align: left; padding: .7rem 1rem;
  font-size: .73rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  color: var(--texto-3);
  border-bottom: 1px solid var(--borda);
  white-space: nowrap;
  background: var(--superficie-2);
}
table.tabela td { padding: .8rem 1rem; border-bottom: 1px solid var(--borda); vertical-align: middle; }
table.tabela tbody tr:last-child td { border-bottom: 0; }
table.tabela tbody tr:hover { background: var(--superficie-2); }
.celula-titulo { font-weight: 600; }
.celula-titulo small { display: block; font-weight: 400; color: var(--texto-3); font-size: .8rem; }
.codigo { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: .82rem; color: var(--texto-2); }
.numerico { text-align: right; font-variant-numeric: tabular-nums; }

.vazio { padding: 3rem 1.5rem; text-align: center; color: var(--texto-3); }
.vazio-icone { font-size: 2rem; opacity: .35; margin-bottom: .5rem; }
.vazio h3 { color: var(--texto-2); margin-bottom: .3rem; }

/* --- Formulários -------------------------------------------------------- */

.secao-form { border-top: 1px solid var(--borda); }
.secao-form:first-of-type { border-top: 0; }
.secao-cabeca {
  padding: 1.1rem 1.35rem .3rem;
  display: flex; align-items: baseline; gap: .7rem;
}
.secao-numero {
  width: 24px; height: 24px; border-radius: 7px; flex: none;
  background: var(--azul-nevoa); color: var(--azul);
  display: grid; place-items: center;
  font-size: .78rem; font-weight: 700;
}
.secao-dica { padding: 0 1.35rem; color: var(--texto-2); font-size: .86rem; margin: .2rem 0 0 2.2rem; }
.secao-corpo { padding: 1rem 1.35rem 1.4rem; }

.campos { display: grid; gap: 1rem; }
.campos-2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); }
.campos-3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); }

.campo { display: grid; gap: .35rem; }
.campo > label, .rotulo {
  font-size: .82rem; font-weight: 650; color: var(--texto-2);
}
.campo .ajuda { font-size: .78rem; color: var(--texto-3); }
.obrigatorio { color: var(--vermelho); font-weight: 700; }

input[type="text"], input[type="password"], input[type="date"], input[type="month"],
input[type="search"], input[type="file"], select, textarea {
  width: 100%;
  padding: .58rem .75rem;
  font: inherit; font-size: .93rem;
  color: var(--texto);
  background: var(--superficie);
  border: 1px solid var(--borda-forte);
  border-radius: 9px;
  transition: border-color .12s ease, box-shadow .12s ease;
}
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--azul);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--azul) 18%, transparent);
}
textarea { resize: vertical; min-height: 90px; line-height: 1.6; }
textarea.alta { min-height: 200px; }
textarea.juridico { min-height: 260px; font-size: .88rem; line-height: 1.7; }
select { appearance: auto; cursor: pointer; }
input[type="file"] { padding: .4rem; cursor: pointer; }
::placeholder { color: var(--texto-3); }

/* --- Filtros ----------------------------------------------------------- */

.filtros {
  display: flex; gap: .7rem; flex-wrap: wrap; align-items: flex-end;
  padding: 1rem 1.35rem;
}
.filtros .campo { min-width: 160px; }
.filtros .campo-busca { flex: 1 1 240px; }
.fichas-status { display: flex; gap: .4rem; flex-wrap: wrap; }
.ficha-status {
  padding: .3rem .7rem; border-radius: 5px;
  border: 1px solid var(--borda-forte); background: var(--superficie);
  font-size: .8rem; font-weight: 600; color: var(--texto-2);
}
.ficha-status:hover { text-decoration: none; border-color: var(--azul); color: var(--azul); }
.ficha-status[aria-pressed="true"] { background: var(--marinho); border-color: var(--marinho); color: #fff; }

/* --- Erro -------------------------------------------------------------- */

.tela-erro { min-height: 70vh; display: grid; place-items: center; text-align: center; padding: 2rem; }
.tela-erro .codigo-erro { font-size: 4rem; font-weight: 800; color: var(--borda-forte); line-height: 1; }
.tela-erro h1 { margin: .6rem 0; }
.tela-erro p { color: var(--texto-2); max-width: 46ch; margin: 0 auto 1.5rem; }

/* --- Utilidades --------------------------------------------------------- */

.oculto { display: none !important; }
.so-leitor, .somente-leitor {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}
.pilha { display: grid; gap: .5rem; }
.linha { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.empurra { margin-left: auto; }
.fraco { color: var(--texto-3); }
.pequeno { font-size: .84rem; }
.centro { text-align: center; }
.rodape { margin-top: 3rem; padding-top: 1.25rem; border-top: 1px solid var(--borda); color: var(--texto-3); font-size: .8rem; display: flex; gap: 1rem; flex-wrap: wrap; }

/* Identidade, navegação e acessibilidade */
[hidden] { display: none !important; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
:focus-visible { outline: 3px solid var(--azul); outline-offset: 4px; }
::selection { background: rgba(53,208,255,.25); }
.icone { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.botao-icone { width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; flex: none; border: 1px solid transparent; background: transparent; color: var(--texto-2); border-radius: 6px; cursor: pointer; }
.botao-icone:hover { background: var(--azul-nevoa); color: var(--azul); }
.icone-sol, [data-theme="dark"] .icone-lua { display: none; }
[data-theme="dark"] .icone-sol { display: block; }
.pular-conteudo { position: fixed; top: -100px; left: 20px; z-index: 100; padding: 12px; background: var(--superficie); border: 2px solid var(--azul); border-radius: 10px; }
.pular-conteudo:focus { top: 12px; }
.marca { display: flex; align-items: center; gap: 9px; color: var(--texto); text-decoration: none; flex: none; }
.marca:hover { text-decoration: none; }
.marca-logo { object-fit: contain; flex: none; }
.marca-nome { font-size: 22px; font-weight: 750; letter-spacing: .075em; line-height: 1.2; }
.marca-nome small { display: block; margin-top: 5px; color: var(--azul); font-size: 10px; font-weight: 650; letter-spacing: .31em; }
.menu-lateral { position: fixed; inset: 0 auto 0 0; z-index: 50; width: var(--menu-largura); padding: 30px 18px 18px; display: flex; flex-direction: column; gap: 12px; background: var(--superficie); border-right: 1px solid var(--borda); overflow-y: auto; transition: width .2s ease, transform .2s ease; }
.menu-lateral .marca { padding: 2px 8px 16px; }
.menu-divisor { height: 1px; background: var(--borda); margin: 0 10px 16px; flex: none; }
.menu-legenda { display: block; margin: 0 12px; color: var(--texto-3); font-size: 9px; letter-spacing: .13em; font-weight: 650; }
.nav { display: grid; gap: 6px; }
.nav a { display: flex; align-items: center; gap: 12px; min-height: 46px; padding: 11px 14px; color: var(--texto-2); border-radius: 7px; font-size: 13px; font-weight: 550; border: 1px solid transparent; transition: background .15s, color .15s; }
.nav a:hover { text-decoration: none; color: var(--azul); background: var(--superficie-2); }
.nav a[aria-current="page"] { background: var(--azul-nevoa); color: var(--azul); border-color: color-mix(in srgb, var(--azul) 12%, transparent); font-weight: 650; }
.menu-processo { margin: auto 8px 20px; padding-top: 60px; }
.menu-processo .menu-legenda { margin: 0; }
.menu-processo ol { list-style: none; padding: 0 0 0 7px; margin: 20px 0 16px; }
.menu-processo li { position: relative; padding: 0 0 22px 21px; border-left: 1px solid var(--borda-forte); color: var(--texto-2); font-size: 11px; }
.menu-processo li:last-child { padding-bottom: 0; border-color: transparent; }
.menu-processo li::before { content: ''; position: absolute; left: -4px; top: 4px; width: 7px; height: 7px; border: 2px solid var(--azul); border-radius: 50%; background: var(--superficie); }
.menu-processo p { color: var(--texto-3); font-size: 10px; }
.menu-conta { display: flex; align-items: center; gap: 9px; padding: 18px 0 0; border-top: 1px solid var(--borda); }
.avatar { width: 36px; height: 36px; display: grid; place-items: center; flex: none; border-radius: 7px; color: var(--azul); background: var(--azul-nevoa); font-size: 11px; font-weight: 700; }
.eu-texto { flex: 1; min-width: 0; }
.eu-texto strong, .eu-texto small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.eu-texto strong { font-size: 11px; font-weight: 650; }
.eu-texto small { color: var(--texto-3); font-size: 10px; margin-top: 2px; }
.menu-conta .botao-icone { width: 30px; }
.area-trabalho { margin-left: var(--menu-largura); min-height: 100dvh; transition: margin-left .2s ease; }
.barra-topo { position: sticky; top: 0; z-index: 30; height: 74px; padding: 0 30px; display: flex; align-items: center; gap: 20px; background: color-mix(in srgb, var(--superficie) 94%, transparent); backdrop-filter: blur(16px); border-bottom: 1px solid var(--borda); }
.barra-local { display: flex; align-items: center; gap: 14px; font-size: 12px; color: var(--texto-3); }
.barra-local strong { font-weight: 550; color: var(--texto); }
.barra-contexto { margin-left: auto; color: var(--texto-3); font-size: 11px; }
.sobretitulo { display: block; color: var(--azul); font-size: 10px; letter-spacing: .15em; font-weight: 650; margin-bottom: 12px; }
.cabecalho-pagina { align-items: center; margin-bottom: 28px; }
.cabecalho-pagina > div:first-child { min-width: 0; }
.cabecalho-pagina h1 { overflow-wrap: anywhere; }
.subtitulo { font-size: 12px; line-height: 1.8; margin-top: 7px; }
.botao { min-height: 40px; border-radius: 6px; font-size: 12px; padding: 10px 16px; transition: background .18s, box-shadow .18s, transform .18s; }
.botao:hover { transform: none; }
.botao:disabled:hover { transform: none; }
.botao-primario { background: #12679d; border-color: #267cae; box-shadow: none; }
.botao-primario:hover { background: #187cb7; border-color: #3496c6; box-shadow: none; }
.botao-pequeno { min-height: 32px; padding: 6px 11px; font-size: 11px; }
.cartao { min-width: 0; }
.cartao-cabeca { padding: 20px 24px; }
.cartao-cabeca h2 { font-size: 14px; }
.cartao-cabeca h3 { font-size: 13px; }
.cartao-corpo { padding: 24px; }
.cartao-atrasadas { border-color: color-mix(in srgb, var(--vermelho) 35%, transparent); }
.tabela-envolta { border-radius: 0 0 var(--raio-g) var(--raio-g); }
table.tabela { font-size: 12px; }
table.tabela th { font-size: 9px; padding: 13px 20px; color: var(--texto-2); letter-spacing: .075em; }
table.tabela td { padding: 17px 20px; }
.celula-titulo a { color: var(--texto); }
.celula-titulo a:hover { color: var(--azul); }
.celula-titulo small { margin-top: 4px; font-size: 10px; }
.selo { font-size: 10px; padding: 4px 9px; }
.selo::before { width: 5px; height: 5px; }
.codigo { font-size: 10px; }
.pequeno { font-size: 12px; }
.vazio { padding: 42px 24px; }
.vazio-icone { display: grid; place-items: center; width: 48px; height: 48px; margin: 0 auto 14px; border-radius: 16px; background: var(--azul-nevoa); color: var(--azul); font-size: 24px; opacity: 1; }
.vazio h3 { color: var(--texto); font-size: 14px; margin-bottom: 8px; }
.vazio .botao { margin-top: 18px; }

.campos { gap: 20px; align-items: start; }
.campos-3 { grid-template-columns: repeat(auto-fit,minmax(min(100%,190px),1fr)); }
.campo { min-width: 0; gap: 8px; align-content: start; }
.campo > label, .rotulo { font-size: 12px; font-weight: 500; color: var(--texto-2); }
.campo .ajuda { font-size: 11px; line-height: 1.65; color: var(--texto-3); }
input[type="text"], input[type="password"], input[type="date"], input[type="month"], input[type="search"], select, textarea { padding: 11px 12px; font-size: 14px; border: 1px solid var(--borda-forte); border-radius: 5px; background-color: var(--superficie-2); }
input:focus,select:focus,textarea:focus { border-color: var(--azul); box-shadow: 0 0 0 2px color-mix(in srgb,var(--azul) 12%,transparent); }
textarea { min-height: 88px; line-height: 1.6; }
.botao { font-size: 13px; font-weight: 500; min-height: 40px; }
.botao-pequeno { font-size: 12px; min-height: 34px; }
.selo { font-size: 11px; font-weight: 500; }
.filtros { gap: 14px; padding: 22px 24px; }
.filtros .campo:not(.campo-busca) { flex: 0 1 210px; }
.ficha-status { font-size: 11px; padding: 7px 11px; border-radius: 4px; border-color: var(--borda); }
.ficha-status[aria-pressed="true"] { background: var(--azul-nevoa); color: var(--azul); border-color: color-mix(in srgb,var(--azul) 30%,transparent); }
table.tabela { font-size: 13px; }
table.tabela th { font-size: 10px; }
table.tabela th.numerico { text-align: right; }
.celula-titulo small { font-size: 11px; }
.cartao-cabeca h2 { font-size: 16px; font-weight: 550; }
.cartao-cabeca h3 { font-size: 14px; }
.espaco-acima { margin-top: 1rem; }
.espaco-acima-curto { margin-top: .3rem; }
.espaco-abaixo { margin-bottom: .9rem; }
.borda-acima { border-top: 1px solid var(--borda); }
.campo-inteiro { grid-column: 1 / -1; }
.rodape { font-size: 11px; margin-top: 32px; }
input[type="file"] { background: var(--superficie-2); padding: 14px; border: 1px dashed var(--borda-forte); border-radius: 5px; font-size: 12px; }
input::file-selector-button { padding: 9px 13px; margin-right: 12px; border: 1px solid var(--borda-forte); border-radius: 4px; background: var(--superficie); color: var(--texto); cursor: pointer; }
/* Administração */
.menu-divisor-admin { margin: 18px 10px 8px; }
.admin-indice { display: flex; gap: 26px; border-bottom: 1px solid var(--borda); margin-bottom: 28px; overflow-x: auto; }
.admin-indice a { padding: 0 0 14px; color: var(--texto-2); font-size: 13px; white-space: nowrap; }
.admin-indice a:hover { color: var(--texto); text-decoration: none; }
.admin-indice a[aria-current] { color: var(--texto); font-weight: 550; box-shadow: inset 0 -2px 0 var(--azul); }
/* "Acessar como usuario" e a unica entrada que troca de tela; ela encosta na
   direita e vem na cor de acao para nao se confundir com as ancoras. */
.admin-indice a.admin-indice-destaque { margin-left: auto; padding-left: 26px; color: var(--azul); }
.admin-indice a.admin-indice-destaque[aria-current] { box-shadow: inset 0 -2px 0 var(--azul); }
.admin-metricas { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border: 1px solid var(--borda); background: var(--superficie); border-radius: 8px; margin-bottom: 28px; }
.admin-metricas > div { padding: 24px; border-right: 1px solid var(--borda); }
.admin-metricas > div:last-child { border-right: 0; }
.admin-metricas span,.admin-metricas small { display: block; color: var(--texto-3); font-size: 12px; }
.admin-metricas strong { display: block; color: var(--texto); font-size: 36px; font-weight: 500; margin: 14px 0 8px; font-variant-numeric: tabular-nums; }
.admin-metricas small { font-size: 11px; }
.metrica-atencao strong,.texto-alerta { color: var(--vermelho); }
.admin-secao { scroll-margin-top: 100px; }
.admin-secao + .admin-secao { margin-top: 24px; }
.admin-secao .subtitulo { margin-bottom: 0; }
.admin-marca { display: inline-flex; align-items: center; gap: 16px; color: var(--texto); }
.admin-marca .icone { width: 15px; height: 15px; color: var(--texto-3); }
.admin-perfis { display: flex; flex-wrap: wrap; gap: 12px 24px; padding: 20px 24px 0; }
.admin-perfis > span { display: inline-flex; gap: 12px; color: var(--texto-3); font-size: 12px; }
.admin-perfis strong { color: var(--texto); font-weight: 550; }
.admin-secundario { display: block; margin-top: 5px; font-size: 11px; color: var(--texto-3); }
.admin-paginacao { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 18px 24px; color: var(--texto-3); font-size: 12px; border-top: 1px solid var(--borda); }
.admin-acessos { padding: 20px 24px; background: var(--superficie-2); border-top: 1px solid var(--borda); border-radius: 0 0 8px 8px; color: var(--texto-3); font-size: 12px; line-height: 1.8; }
.admin-acessos strong { font-weight: 550; color: var(--texto-2); }
.admin-acessos p { margin: 6px 0; }
.admin-acessos code { font-size: 11px; color: var(--texto-2); }
.admin-observacao { min-width: 200px; max-width: 380px; overflow-wrap: anywhere; white-space: pre-wrap; font-size: 12px; }

/* Entrada: composi??o institucional restaurada, com a seta inteira no painel. */
.tela-entrada { display: grid; grid-template-columns: 1.04fr 1fr; min-height: 100dvh; }
.entrada-arte { position: relative; isolation: isolate; display: flex; flex-direction: column; min-height: 100dvh; padding: 44px 9% 28px; color: #fff; overflow: hidden; background: radial-gradient(ellipse at 100% 55%, rgba(32,126,176,.18), transparent 58%), linear-gradient(145deg,#10171e,#172633); border-right: 1px solid #30404d; }
.entrada-arte::before { content: ''; position: absolute; inset: 0; z-index: -2; background-image: linear-gradient(rgba(130,186,216,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(130,186,216,.035) 1px,transparent 1px); background-size: 66px 66px; mask-image: linear-gradient(120deg,transparent,#000); }
.entrada-arte .marca { color: #fff; position: relative; z-index: 2; }
.entrada-arte .marca-nome { font-size: 25px; letter-spacing: .13em; }
.entrada-arte .marca-nome small { color: #79bfe7; font-size: 10px; }
.entrada-manifesto { position: relative; z-index: 1; max-width: 72%; margin: auto 0; padding: 70px 0 50px; }
.entrada-manifesto .sobretitulo { font-size: 9px; color: #91bed4; letter-spacing: .18em; margin-bottom: 25px; }
.entrada-manifesto h1 { font-size: clamp(48px,4.5vw,76px); font-weight: 550; letter-spacing: -.065em; line-height: 1.04; margin: 0 0 24px; }
.entrada-manifesto h1 span { color: #79bfe7; }
.entrada-manifesto p { color: #b2c5d5; font-size: 13px; line-height: 1.85; }
.entrada-seta { position: absolute; z-index: 0; display: block; width: min(36%,390px); height: auto; right: 4%; top: 26%; object-fit: contain; opacity: .22; transform: rotate(-8deg); animation: seta-ambiente 14s ease-in-out infinite alternate; }
.entrada-processo { position: relative; z-index: 2; }
.entrada-processo > .sobretitulo { color: #8facc0; font-size: 9px; letter-spacing: .14em; margin-bottom: 18px; }
.fluxo-ilustrado { list-style: none; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); padding: 0; margin: 0; gap: 0; }
.fluxo-ilustrado li { position: relative; border-top: 1px solid #3c5263; padding: 14px 12px 0 0; }
.fluxo-ilustrado li:not(:last-child)::after { content: ''; position: absolute; right: 4px; top: -3px; width: 5px; height: 5px; border-radius: 50%; background: #79bfe7; }
.fluxo-ilustrado li > span { display: block; color: #79bfe7; font: 10px ui-monospace,Consolas,monospace; margin-bottom: 14px; }
.fluxo-ilustrado strong { display: block; font-size: 12px; font-weight: 600; }
.fluxo-ilustrado small { display: block; color: #8fa5b7; font-size: 9px; margin-top: 4px; }
.entrada-assinatura { position: relative; z-index: 2; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; border-top: 1px solid #304655; padding-top: 22px; margin-top: 38px; font-size: 9px; letter-spacing: .12em; color: #8facc0; }
.entrada-assinatura span { letter-spacing: 0; }
.entrada-form { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 28px 8%; background: radial-gradient(ellipse at 100% 0%,rgba(121,191,231,.04),transparent 65%),var(--fundo); }
.entrada-controles { display: flex; align-items: center; justify-content: space-between; width: 100%; gap: 20px; margin-bottom: 32px; color: var(--texto-3); font-size: 9px; letter-spacing: .13em; }
.entrada-controles .botao-icone { border-color: var(--borda); background: var(--superficie); }
.entrada-caixa { width: 100%; max-width: 450px; padding: 38px; margin: auto 0; background: var(--superficie); border: 1px solid var(--borda); border-radius: 12px; box-shadow: var(--sombra-alta); }
.entrada-emblema { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid color-mix(in srgb,var(--azul) 20%,transparent); background: var(--azul-nevoa); color: var(--azul); border-radius: 8px; margin-bottom: 24px; }
.entrada-emblema .icone { width: 24px; height: 24px; }
.entrada-caixa .sobretitulo { font-size: 8px; letter-spacing: .12em; margin-bottom: 10px; }
.entrada-caixa h2 { font-size: clamp(23px,2.1vw,30px); font-weight: 650; letter-spacing: -.045em; margin-bottom: 10px; }
.entrada-caixa .lead { color: var(--texto-2); font-size: 12px; line-height: 1.8; margin-bottom: 28px; }
.entrada-caixa form { display: grid; gap: 20px; }
.entrada-input { position: relative; display: flex; align-items: center; }
.entrada-input > .icone { position: absolute; left: 15px; width: 17px; height: 17px; color: var(--texto-3); pointer-events: none; }
.entrada-input input { min-height: 48px; padding: 13px 43px; font-size: 12px; }
.senha-visibilidade { position: absolute; right: 6px; width: 34px; height: 34px; }
.senha-visibilidade .icone { width: 17px; height: 17px; }
.entrada-enviar { min-height: 48px; justify-content: space-between; padding: 12px 18px; margin-top: 4px; }
.entrada-enviar .icone { width: 17px; height: 17px; }
.entrada-seguranca { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 24px 0 20px; margin-top: 4px; color: var(--texto-2); font-size: 10px; }
.entrada-seguranca > .icone { color: var(--azul); width: 18px; height: 18px; }
.entrada-seguranca span span { display: block; font-size: 9px; color: var(--texto-3); margin-top: 2px; }
.entrada-nota { border-top: 1px solid var(--borda); padding-top: 18px; color: var(--texto-3); font-size: 10px; line-height: 1.8; }
.entrada-rodape { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; width: 100%; font-size: 9px; color: var(--texto-3); margin-top: 32px; padding-top: 6px; }

@media (min-width:1081px) {
  :root[data-menu-recolhido] { --menu-largura: 78px; }
  [data-menu-recolhido] .menu-lateral { padding-inline: 12px; }
  [data-menu-recolhido] .menu-lateral .marca { padding: 2px 0 16px; justify-content: center; }
  [data-menu-recolhido] .menu-lateral .marca-nome,[data-menu-recolhido] .menu-legenda,[data-menu-recolhido] .nav span,[data-menu-recolhido] .menu-processo,[data-menu-recolhido] .eu-texto { display: none; }
  [data-menu-recolhido] .nav a { justify-content: center; padding: 11px; }
  [data-menu-recolhido] .menu-conta { margin-top: auto; flex-direction: column; }
}
@media (max-width:1200px) {
  .entrada-arte { padding-inline: 6%; }
  .entrada-form { padding-inline: 8%; }
}
@media (max-width:1080px) {
  .area-trabalho { margin-left: 0; }
  .menu-lateral { width: 260px; transform: translateX(-100%); }
  [data-menu-aberto] .menu-lateral { transform: translateX(0); }
  [data-menu-aberto] body { overflow: hidden; }
  .menu-fundo { position: fixed; z-index: 40; inset: 0; width: 100%; height: 100%; background: rgba(0,0,0,.6); border: 0; cursor: pointer; }
  .entrada-copy h1 { font-size: 32px; }
  .entrada-copy p { font-size: 12px; }
  .entrada-manifesto { gap: 10px; }
}
@media (max-width:760px) {
  .pagina { padding: 24px 18px; }
  .barra-topo { height: 64px; padding: 0 16px; gap: 10px; }
  .barra-local { gap: 10px; font-size: 11px; }
  .barra-contexto { font-size: 10px; }
  .cabecalho-pagina .acoes { margin-left: 0; }
  .cartao-cabeca,.cartao-corpo { padding: 20px; }
  .cartao-cabeca .direita { margin-left: 0; }
  .filtros { padding: 20px; }
  .filtros .campo:not(.campo-busca) { flex: 1 1 180px; }
  .admin-metricas { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-metricas > div { padding: 20px; border-bottom: 1px solid var(--borda); }
  .admin-metricas > div:nth-child(2) { border-right: 0; }
  .admin-metricas > div:nth-last-child(-n+2) { border-bottom: 0; }
  .admin-metricas span { font-size: 11px; }
  .admin-metricas strong { font-size: 30px; }
  .admin-indice { gap: 22px; }
  .admin-paginacao { flex-wrap: wrap; }
  .tela-entrada { grid-template-columns: 1fr; }
  .entrada-arte { min-height: auto; padding: 24px; border-right: 0; border-bottom: 1px solid #29313a; }
  .entrada-arte .marca-logo { width: 38px; height: 38px; }
  .entrada-arte .marca-nome { font-size: 20px; }
  .entrada-arte .marca-nome small { font-size: 8px; }
  .entrada-manifesto { padding: 30px 0 8px; grid-template-columns: minmax(0,1fr) 110px; gap: 12px; }
  .entrada-copy .sobretitulo { font-size: 8px; margin-bottom: 12px; }
  .entrada-copy h1 { font-size: 32px; margin-bottom: 0; }
  .entrada-copy p,.entrada-processo,.entrada-assinatura { display: none; }
  .entrada-form { padding: 22px 26px 24px; }
  .entrada-controles { max-width: 400px; }
  .entrada-caixa { padding: 32px 0; }
  .entrada-caixa h2 { font-size: 28px; }
  .entrada-caixa .lead { font-size: 13px; margin-bottom: 28px; }
  .entrada-rodape { max-width: 400px; margin-top: 0; }
  input[type="text"],input[type="password"],input[type="date"],input[type="month"],input[type="search"],select,textarea,.entrada-input input { font-size: 16px; }
}
@media (max-width:390px) {
  .barra-contexto { display: none; }
  .barra-topo > [data-alternar-tema] { margin-left: auto; }
  .pagina { padding-inline: 14px; }
  .entrada-manifesto { grid-template-columns: minmax(0,1fr) 90px; }
  .entrada-copy h1 { font-size: 30px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  *,*::before,*::after { animation: none !important; transition: none !important; }
}

@media (max-width:760px) {
  .entrada-arte { padding: 24px; }
  .entrada-manifesto { max-width: calc(100% - 105px); padding: 30px 0 8px; }
  .entrada-manifesto .sobretitulo { font-size: 8px; margin-bottom: 12px; }
  .entrada-manifesto h1 { font-size: 32px; margin-bottom: 0; }
  .entrada-manifesto p,.entrada-processo,.entrada-assinatura { display: none; }
  .entrada-seta { width: 92px; right: 24px; top: 100px; opacity: .32; }
  .entrada-caixa { padding: 28px 24px; }
}
@media (max-width:390px) {
  .entrada-manifesto { max-width: calc(100% - 82px); }
  .entrada-manifesto h1 { font-size: 29px; }
  .entrada-seta { width: 72px; right: 20px; top: 106px; }
}

/* A faixa acompanha a rolagem: agindo como outra pessoa, saber disso não pode
   depender de o usuário estar no topo da página. */
.impersonacao-faixa { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 16px 20px; margin-bottom: 24px; border: 1px solid var(--azul); border-radius: 10px; background: var(--azul-nevoa); box-shadow: var(--sombra); }
@media (prefers-reduced-motion: no-preference) { .impersonacao-faixa { transition: box-shadow .2s; } }
.impersonacao-faixa > div { flex: 1 1 320px; }
.impersonacao-faixa strong,.impersonacao-faixa span,.impersonacao-faixa small { display: block; }
.impersonacao-faixa span { margin-top: 4px; font-size: 12px; color: var(--texto-2); }
.impersonacao-faixa small { margin-top: 6px; color: var(--texto-3); }
/* "Acessar como usuario" e uma secao da Administracao: mesmo cartao, mesmas
   metricas e a mesma barra de secoes do painel. O elenco e uma lista de
   linhas, e nao uma grade de cartoes, porque a tela e usada procurando uma
   pessoa por nome — e linha se varre mais rapido que cartao. */
.impersonacao-alerta { margin-bottom: 20px; }
.impersonacao-recentes .cartao-cabeca { border-bottom: 0; padding-bottom: 0; }
.impersonacao-atalhos {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
  gap: 10px; padding: 16px 24px 24px;
}
.impersonacao-atalho {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center;
  gap: 11px; margin: 0; padding: 10px 12px;
  border: 1px solid var(--borda); border-radius: var(--raio-g); background: var(--superficie-2);
}
.impersonacao-atalho .avatar { width: 32px; height: 32px; font-size: 11px; }
.impersonacao-atalho .impersonacao-perfil > strong { font-size: 12px; }

.impersonacao-barra { display: grid; gap: 16px; }
.impersonacao-filtros { max-width: 460px; }
.impersonacao-barra .ajuda { margin: 0; font-size: 12px; line-height: 1.7; color: var(--texto-3); }
.impersonacao-papeis { display: flex; flex-wrap: wrap; gap: 8px; }
.impersonacao-papeis .ficha-status { display: inline-flex; align-items: baseline; gap: 7px; }
.impersonacao-papeis .ficha-status strong { font-weight: 650; font-variant-numeric: tabular-nums; }

/* A linha do elenco: quatro colunas fixas. Antes era uma fila flexivel e o
   seletor de login (que so algumas pessoas tem) empurrava o botao para outra
   altura, deixando a lista com linhas de tamanhos diferentes. */
.impersonacao-pessoa,.impersonacao-lista > .vazio { border-top: 1px solid var(--borda); }
.impersonacao-pessoa {
  display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 250px) auto;
  align-items: center; gap: 10px 18px; margin: 0; padding: 16px 24px;
}
.impersonacao-pessoa:hover { background: var(--superficie-2); }
.impersonacao-perfil { min-width: 0; display: grid; gap: 4px; overflow-wrap: anywhere; }
.impersonacao-perfil > strong { font-size: 14px; font-weight: 600; }
.impersonacao-perfil > span { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.impersonacao-perfil > small { font-size: 11px; color: var(--texto-3); }
.impersonacao-login-papeis { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; }
.impersonacao-login-papeis > .codigo { font-size: 11px; color: var(--texto-3); }
/* A alcada vem do Holmes e e so um cracha: nenhuma permissao depende dela. */
.impersonacao-alcada { display: flex; flex-wrap: wrap; gap: 4px 6px; margin-top: 2px; }
.impersonacao-alcada span {
  padding: 2px 8px; border: 1px solid var(--borda); border-radius: 999px;
  background: var(--superficie-2); font-size: 10px; color: var(--texto-2);
}
.impersonacao-login { min-width: 0; display: grid; align-content: center; gap: 4px; }
.impersonacao-login label { font-size: 11px; font-weight: 500; color: var(--texto-3); }
.impersonacao-login select { width: 100%; }
.impersonacao-login strong { font-size: 12px; }
.impersonacao-login small { font-size: 11px; color: var(--texto-3); overflow-wrap: anywhere; }

@media (max-width:1080px) {
  .impersonacao-pessoa { grid-template-columns: auto minmax(0, 1fr) auto; }
  .impersonacao-login { grid-column: 2 / 3; }
}
@media (max-width:760px) {
  .impersonacao-pessoa { grid-template-columns: auto minmax(0, 1fr); padding: 16px 20px; }
  .impersonacao-login,.impersonacao-pessoa > .botao { grid-column: 1 / -1; }
  .impersonacao-pessoa > .botao { justify-self: stretch; }
  .impersonacao-atalhos { grid-template-columns: 1fr; padding-inline: 20px; }
}

/* Início da plataforma: um cartão por módulo, e o menu que os lista.
   ``Modulo.cor`` é um token de cor (``cor-<token>``, ver nucleo/navegacao.py);
   quem não casa com nenhum cai no azul. */
.cor-azul { --cor-modulo: var(--azul); --cor-modulo-suave: var(--azul-nevoa); }
.cor-verde { --cor-modulo: var(--verde); --cor-modulo-suave: var(--verde-suave); }
.cor-ambar { --cor-modulo: var(--ambar); --cor-modulo-suave: var(--ambar-suave); }
.cor-indigo { --cor-modulo: var(--indigo); --cor-modulo-suave: var(--indigo-suave); }
.cor-vermelho { --cor-modulo: var(--vermelho); --cor-modulo-suave: var(--vermelho-suave); }
.cor-roxo { --cor-modulo: var(--roxo); --cor-modulo-suave: var(--superficie-2); }
.menu-modulo { display: flex; align-items: center; gap: 8px; margin-top: 18px; margin-bottom: 8px; color: var(--cor-modulo); }
.menu-modulo .icone { width: 14px; height: 14px; flex: none; }
.nav-modulo { margin-top: 6px; }
.nav-modulo a .icone { color: var(--cor-modulo); }
.inicio-modulos { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 18px; }
.inicio-modulos .cartao + .cartao { margin-top: 0; }
.cartao-modulo { display: flex; flex-direction: column; gap: 14px; padding: 22px 24px; border-top: 3px solid var(--cor-modulo); }
.modulo-cabeca { display: flex; align-items: center; gap: 14px; }
.modulo-cabeca h2 { margin: 0 0 6px; font-size: 18px; font-weight: 600; }
.modulo-icone { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border-radius: var(--raio-g); background: var(--cor-modulo-suave); color: var(--cor-modulo); }
.modulo-icone .icone { width: 22px; height: 22px; }
.modulo-descricao { margin: 0; color: var(--texto-2); font-size: 13px; line-height: 1.6; }
.modulo-pendencia { margin: 0; padding: 12px 14px; border: 1px solid var(--borda); border-radius: var(--raio); background: var(--superficie-2); color: var(--texto-2); font-size: 13px; }
.modulo-pendencia a { color: inherit; }
.modulo-pendencia strong { color: var(--texto); font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums; }
.modulo-pendencia-falha { color: var(--texto-3); font-size: 12px; }
.modulo-abrir { align-self: flex-start; margin-top: auto; }