/* =====================================================================
   <pc-editor-documento> — editor dentro do visualizador (ADR 0018).
   A barra de ferramentas é a mesma linguagem dos botões do sistema; a folha é a
   moldura `.previa-documento` que já emoldura a minuta.
   ===================================================================== */

.editor {
  display: block;
}

/* Estação documental: moldura institucional, sem tocar a folha oficial do iframe. */
.editores.editores--documental { border-radius: var(--raio-lg); border: var(--borda-forte); background: var(--cor-superficie-realce); box-shadow: var(--sombra-2); }
.editores--documental .editores__indice { background: var(--cor-superficie-sutil); }
.editores--documental.editores--unidos .editor > .editor__barra { padding: var(--esp-3) var(--esp-4); border-bottom: var(--filete-fino) solid var(--cor-marca); background: var(--cor-superficie-sutil); }
.editores--documental .editores__pagina { border-radius: var(--raio-md); padding: var(--esp-2); }
.editores--documental .editores__pagina[aria-current="true"] { background: var(--cor-marca-fundo); }
.editores--documental .editores__legenda { font-weight: var(--peso-semi); }
.editores--documental.editores--unidos .editores__titulo { padding-top: var(--esp-5); color: var(--cor-texto-secundario); }

@media (max-width: 767.98px) {
  .editores.editores--documental { grid-template-columns: minmax(0, 1fr); }
  .editores--documental:not(.editores--sem-indice):not(.editores--pdf) .editores__indice {
    grid-column: 1;
    grid-row: 2;
    position: static;
    flex-direction: row;
    max-height: none;
    padding: var(--esp-3);
    border-right: 0;
    border-bottom: var(--borda);
    overflow-x: auto;
  }
  .editores--documental .editores__pagina { flex: 0 0 6rem; }
  .editores--documental.editores--unidos .editor > *,
  .editores--documental.editores--unidos .editores__titulo { grid-column: 1; }
}

.editor__barra {
  display: flex;
  flex-direction: column;
  gap: var(--esp-2);
  padding: var(--esp-2);
  border: 1px solid var(--cor-borda);
  border-bottom: 0;
  border-radius: var(--raio-md) var(--raio-md) 0 0;
  background: var(--cor-superficie);
}

/* Duas linhas: a do documento (modo + estado) e a das ferramentas (só no modo Texto). */
.editor__linha {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--esp-2);
}

.editor__linha--ferramentas {
  padding-top: var(--esp-2);
  border-top: 1px solid var(--cor-borda-sutil);
}
.editor__ferramentas { border-top: var(--borda-sutil); padding-top: var(--esp-2); }
.editor__ferramentas > summary { width: fit-content; list-style: none; }
.editor__ferramentas > summary::-webkit-details-marker { display: none; }
.editor__ferramentas[open] > summary > .icone:last-child { rotate: 180deg; }
.editor__ferramentas .editor__linha--ferramentas { border-top: 0; padding-top: var(--esp-3); }

.editor__linha--ferramentas[hidden] {
  display: none;
}

.editor__grupo {
  display: flex;
  align-items: center;
  gap: var(--esp-05);
  padding-right: var(--esp-2);
  border-right: 1px solid var(--cor-borda-sutil);
}

.editor__grupo:last-child {
  border-right: 0;
}

.editor__grupo .botao--icone {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.editor__grupo .botao--icone:hover {
  background: var(--cor-superficie-realce);
}

.editor__grupo .botao[aria-pressed="true"] {
  border-color: var(--cor-marca-borda);
  background: var(--cor-marca-fundo-forte);
  color: var(--cor-marca-texto);
}

/* Modo Texto / PDF: um controle segmentado. */
.editor__modos {
  gap: 0;
  padding: var(--esp-05);
  border: 1px solid var(--cor-borda);
  border-radius: var(--raio-pilula);
  background: var(--cor-superficie-sutil);
}

.editor__modos .botao {
  border-color: transparent;
  border-radius: var(--raio-pilula);
  background: transparent;
  box-shadow: none;
}

.editor__modos .botao[aria-pressed="true"] {
  border-color: var(--grafite-900);
  background: var(--grafite-900);
  color: var(--neutro-0);
}

.editor__modos .botao[aria-pressed="true"]:hover {
  background: var(--grafite-800);
}

/* Estado (páginas, salvo) à esquerda; à direita, baixar, anexar e Texto/PDF. */
.editor__estado {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--esp-2);
  font-size: var(--texto-xs);
  color: var(--cor-texto-secundario);
}

.editor__fim {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--esp-2);
  margin-left: auto;
}

.editor__salvo {
  white-space: nowrap;
}

.editor__salvo--salvando::before {
  animation: girar var(--duracao-enfase) linear infinite;
}

.editor__presenca[hidden],
.editor__paginas[hidden] {
  display: none;
}

.editor__presenca {
  display: inline-flex;
  align-items: center;
  gap: var(--esp-1);
  color: var(--cor-info);
}

.editor__paginas {
  white-space: nowrap;
}

/* Avisos entre a barra e a folha: conflito, texto desatualizado, pendências, versão antiga. */
.editor__avisos:empty {
  display: none;
}

.editor__avisos {
  display: flex;
  flex-direction: column;
  gap: var(--esp-2);
  padding: var(--esp-2);
  border: 1px solid var(--cor-borda);
  border-bottom: 0;
  background: var(--cor-superficie-sutil);
}

.editor__avisos .alerta {
  margin: 0;
}

.alerta__corpo .editor__pendencias {
  display: flex;
  flex-wrap: wrap;
  gap: var(--esp-1);
  margin: var(--esp-1) 0 0;
  padding: 0;
  list-style: none;
}

.editor__pendencias .botao {
  height: auto;
  min-height: var(--altura-controle-sm);
  white-space: normal;
  text-align: left;
}

.editor__folha {
  /* A folha só carrega quando chega à tela: até lá a moldura já tem a altura dela, para
     a página não pular quando o documento aparece (CLS). */
  min-height: max(24rem, 72vh);
  border: 1px solid var(--cor-borda);
  border-radius: 0 0 var(--raio-md) var(--raio-md);
}

.editor__quadro {
  display: block;
  width: 100%;
  height: 72vh;
  min-height: 24rem;
  border: 0;
  background: var(--neutro-0);
}

.editor__quadro[hidden] {
  display: none;
}

/* Painel de textos prontos e de tabela (mesma peça do menu de ações). */
.editor__painel {
  min-width: 18rem;
  max-width: min(28rem, calc(100vw - 2 * var(--esp-4)));
  max-height: 24rem;
  overflow: auto;
}

/* Menu de textos prontos sem nenhum texto: ícone, título e a dica, centralizados. */
.editor__textos-vazio {
  display: grid;
  justify-items: center;
  gap: var(--esp-1);
  padding: var(--esp-4) var(--esp-4) var(--esp-3);
  font-size: var(--texto-xs);
  color: var(--cor-texto-secundario);
  text-align: center;
}

.editor__textos-vazio strong {
  font-size: var(--texto-sm);
  color: var(--cor-texto);
}

.editor__textos-vazio-icone {
  display: inline-grid;
  place-items: center;
  width: 2.25rem;
  height: 2.25rem;
  margin-bottom: var(--esp-1);
  border-radius: var(--raio-pilula);
  background: var(--cor-marca-fundo);
  color: var(--cor-marca-texto);
}

.editor__textos-carregando {
  margin: 0;
  padding: var(--esp-3) var(--esp-4);
  font-size: var(--texto-xs);
  color: var(--cor-texto-secundario);
}

.editor__texto-pronto {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: var(--esp-1);
}

.editor__texto-pronto .menu__item {
  display: block;
  white-space: normal;
}

.editor__texto-pronto small {
  display: block;
  color: var(--cor-texto-terciario);
}

.editor__tabela-form {
  display: flex;
  align-items: end;
  gap: var(--esp-2);
  padding: var(--esp-2);
}

.editor__tabela-form .campo {
  width: 5rem;
}

/* Histórico de versões (diálogo) */
.editor__versoes {
  margin: 0;
  padding: 0;
  list-style: none;
}

.editor__versao {
  display: grid;
  grid-template-columns: 3.25rem 1fr auto;
  gap: var(--esp-3);
  align-items: center;
  padding: var(--esp-2) 0;
  border-top: 1px solid var(--cor-borda-sutil);
}

.editor__versao:first-child {
  border-top: 0;
}

.editor__versao--vigente {
  background: var(--cor-marca-fundo);
  margin-inline: calc(-1 * var(--esp-3));
  padding-inline: var(--esp-3);
  border-radius: var(--raio-sm);
}

.editor__versao-numero {
  font-size: var(--texto-lg);
  font-weight: var(--peso-forte);
  color: var(--cor-marca-texto);
}

.editor__versao-texto small {
  display: block;
  color: var(--cor-texto-terciario);
}

@media (max-width: 767.98px) {
  .editor__grupo {
    padding-right: var(--esp-1);
  }

  .editor__quadro {
    height: 60vh;
  }

  .editor__folha {
    min-height: max(24rem, 60vh);
  }

  .editor__versao {
    grid-template-columns: 3.25rem 1fr;
  }

  .editor__versao .grupo-botoes {
    grid-column: 2;
  }
}

@media (prefers-reduced-motion: reduce) {
  .editor__salvo--salvando::before {
    animation: none;
  }
}

/* Pendências do documento na barra: botões pequenos em tom de aviso, à esquerda do estado
   do salvamento. Levam ao trecho que falta sem empurrar a folha para baixo. */
.editor__estado > .editor__pendencias {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--esp-1);
}

.editor__pendencia {
  --botao-texto: var(--cor-texto);
  border-color: var(--cor-aviso-borda);
  background: var(--cor-aviso-fundo);
}

/* Escolhas compactas na barra (tamanho da fonte, largura e altura da tabela). */
/* Escolhas da barra (tamanho da fonte, largura da tabela…): com a cara dos botões da
   barra — sem a caixa de campo de formulário, só a seta e o realce ao passar o mouse. */
.editor__selecao {
  min-height: var(--altura-controle-sm);
  width: auto;
  padding: 0 var(--esp-6) 0 var(--esp-2);
  border-color: transparent;
  border-radius: var(--raio-sm);
  background-color: transparent;
  background-position: calc(100% - 0.85rem) 50%, calc(100% - 0.55rem) 50%;
  font-size: var(--texto-sm);
  font-weight: var(--peso-semi);
  color: var(--cor-texto);
  box-shadow: none;
  cursor: pointer;
}

.editor__selecao:hover {
  border-color: transparent;
  background-color: var(--cor-superficie-realce);
}

.editor__selecao:focus-visible {
  border-color: var(--grafite-900);
  background-color: var(--cor-superficie);
  box-shadow: none;
}

/* Amostra de cor no menu de cor da fonte. As cores são as do documento (impresso), não do
   sistema — por isso vêm da paleta fixa do saneador, e não de tokens de interface. */
.editor__cor {
  width: 0.9rem;
  height: 0.9rem;
  border-radius: var(--raio-xs);
  box-shadow: inset 0 0 0 1px var(--cor-borda);
}

.editor__cor--preto { background: var(--doc-cor-preto); }
.editor__cor--cinza { background: var(--doc-cor-cinza); }
.editor__cor--vermelho { background: var(--doc-cor-vermelho); }
.editor__cor--azul { background: var(--doc-cor-azul); }
.editor__cor--verde { background: var(--doc-cor-verde); }

/* Menus de texto da barra (Tamanho): botão da barra com o rótulo e a seta. */
.editor__menu-texto {
  gap: var(--esp-1);
  padding: 0 var(--esp-2);
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.editor__menu-texto:hover,
.editor__menu-texto[aria-expanded="true"] {
  background: var(--cor-superficie-realce);
}

.editor__menu-seta {
  color: var(--cor-texto-terciario);
  transition: rotate var(--duracao-rapida) var(--curva-padrao);
}

.editor__menu-texto[aria-expanded="true"] .editor__menu-seta {
  rotate: 180deg;
}

/* Tamanhos: uma coluna estreita, sem a largura dos menus de texto pronto. */
.editor__painel.editor__tamanhos {
  width: 6.5rem;
  min-width: 0;
}

/* Escolhas da tabela (pc-select) na barra: do tamanho do conteúdo, não da linha toda. */
.editor__seletor {
  display: inline-block;
}

.editor__seletor .seletor__gatilho {
  min-width: 6.5rem;
}

/* =============== Vários editores empilhados (o termo: um por documento) =============== */
.editores {
  display: grid;
  gap: var(--esp-6);
}

.editores__item {
  display: grid;
  gap: var(--esp-2);
  scroll-margin-top: calc(var(--altura-topo) + var(--esp-4));
}

.editores__titulo {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--esp-2);
  margin: 0;
  font-size: var(--texto-sm);
  font-weight: var(--peso-semi);
}

.editores__numero {
  font-size: var(--texto-xs);
  font-variant-numeric: tabular-nums;
  color: var(--cor-texto-secundario);
}

/* Folha inteira: a altura do documento (editor-documento.js), sem rolagem própria; a barra
   acompanha a rolagem enquanto o editor está na tela. */
.editor--inteira .editor__quadro {
  height: auto;
  min-height: 297mm;
}

.editor--inteira .editor__folha {
  min-height: 0;
}

.editor--inteira .editor__barra {
  position: sticky;
  top: var(--altura-topo);
  z-index: 2;
  box-shadow: var(--sombra-1);
}

/* ---- Bloco único (o termo): as páginas de vários editores numa moldura só ----
   A barra de ferramentas é o cabeçalho do bloco (linha 1, largura toda; as barras de
   todos os editores ficam na mesma casa e só a do editor ativo aparece). Embaixo, à
   esquerda, o índice das páginas — a miniatura de cada folha, como num leitor de PDF, que
   o botão de painel da barra fecha e abre — e, ao lado, título e folha de cada página, na
   ordem. Os editores, os itens e a área somem como caixa (display: contents) para as peças
   entrarem nesta grade. Barra e índice acompanham a rolagem (a altura da barra vem de
   editores.js em --altura-barra). Em tela estreita o índice começa fechado. */
.editores--unidos {
  --largura-indice: 9.5rem;
  --altura-barra: 5.5rem;
  grid-template-columns: var(--largura-indice) minmax(0, 1fr);
  gap: 0;
  overflow: clip;
  border: 1px solid var(--cor-borda);
  border-radius: var(--raio-md);
  background: var(--neutro-200);
}

.editores--sem-indice {
  grid-template-columns: 0 minmax(0, 1fr);
}

.editores--unidos .editores__area,
.editores--unidos .editores__item,
.editores--unidos .editor {
  display: contents;
}

/* Tudo o que vem dos editores vai para a coluna das páginas; a barra, para o topo. */
.editores--unidos .editor > *,
.editores--unidos .editores__titulo {
  grid-column: 2;
}

.editores__indice {
  grid-column: 1;
  /* Da linha 2 até o fim: as linhas a mais, vazias, não têm altura. */
  grid-row: 2 / span 400;
  position: sticky;
  top: calc(var(--altura-topo) + var(--altura-barra));
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: var(--esp-4);
  max-height: calc(100vh - var(--altura-topo) - var(--altura-barra));
  padding: var(--esp-4) var(--esp-3);
  overflow-y: auto;
  /* A barra de rolagem não muda a largura das miniaturas quando aparece. */
  scrollbar-gutter: stable;
  border-right: 1px solid var(--cor-borda);
  background: var(--cor-superficie);
  scrollbar-width: thin;
}

.editores--sem-indice .editores__indice {
  display: none;
}

/* "PDF" na barra: o bloco todo vira um PDF só, com todos os documentos (editores.js). As
   páginas de edição, os títulos e o índice saem — o leitor do navegador já tem as dele. */
.editores--pdf {
  grid-template-columns: 0 minmax(0, 1fr);
}

.editores--pdf .editores__indice,
.editores--pdf .editores__titulo,
.editores--pdf .editor > .editor__folha,
.editores--pdf .editor > .editor__avisos,
.editores--pdf .editor__paginas,
.editor--pdf [data-alternar-indice] {
  display: none;
}

.editores__pdf {
  grid-column: 2;
  padding: var(--esp-4);
}

.editores__pdf[hidden] {
  display: none;
}

.editores__pdf iframe {
  display: block;
  width: 100%;
  height: calc(100vh - var(--altura-topo) - var(--altura-barra) - var(--esp-8));
  min-height: 24rem;
  border: 0;
  border-radius: var(--raio-sm);
  background: var(--neutro-0);
}

.editores__pagina {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--esp-2);
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--cor-texto-secundario);
  font: inherit;
  font-size: var(--texto-xs);
  cursor: pointer;
}

/* A miniatura: a folha A4 inteira em escala (editores.js), sem rolagem nem clique próprios. */
.editores__miniatura {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 210 / 297;
  overflow: hidden;
  border-radius: var(--raio-xs);
  background: var(--neutro-0);
  box-shadow: 0 0 0 1px var(--cor-borda);
  transition: box-shadow var(--duracao-rapida) var(--curva-padrao);
}

.editores__miniatura iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 210mm;
  height: 297mm;
  border: 0;
  transform-origin: top left;
  pointer-events: none;
}

.editores__miniatura iframe[data-carregando] {
  visibility: hidden;
}

.editores__pagina:hover .editores__miniatura {
  box-shadow: 0 0 0 2px var(--cor-borda-forte);
}

.editores__pagina[aria-current="true"] .editores__miniatura {
  box-shadow: 0 0 0 3px var(--cor-marca);
}

.editores__pagina:focus-visible {
  outline: none;
}

.editores__pagina:focus-visible .editores__miniatura {
  box-shadow: 0 0 0 3px var(--foco-cor);
}

.editores__legenda {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: var(--esp-1);
  max-width: 100%;
  line-height: var(--altura-linha-justa);
  text-align: center;
}

.editores__pagina .editores__numero {
  flex: none;
  font-weight: var(--peso-semi);
  color: var(--cor-texto);
}

.editores__nome {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.editores__pagina[aria-current="true"] .editores__legenda {
  color: var(--cor-texto);
  font-weight: var(--peso-medio);
}

.editores--unidos .editor > .editor__barra {
  grid-row: 1;
  grid-column: 1 / -1;
  top: var(--altura-topo);
  z-index: 3;
  border: 0;
  border-bottom: 1px solid var(--cor-borda);
  border-radius: 0;
}

.editor__indice[aria-expanded="true"] {
  background: var(--cor-superficie-realce);
}

.editores--unidos .editor:not(.editor--ativo) .editor__barra {
  display: none;
}

.editores--unidos .editores__titulo {
  margin: 0;
  padding: var(--esp-4) var(--esp-5) 0;
  scroll-margin-top: calc(var(--altura-topo) + var(--altura-barra) + var(--esp-2));
}

.editores--unidos .editor__folha {
  min-height: 0;
  border: 0;
  border-radius: 0;
}

@media (max-width: 767.98px) {
  .editores--unidos {
    --largura-indice: 6rem;
  }
}

/* =====================================================================
   Estação de documento (operacional: ofício, termo, OS, plano) — redesenho.
   Uma moldura clara, no padrão dos cartões da folha:
   1. cabeçalho claro: o documento (ícone + nome), os selos de estado e, à direita, Texto/PDF,
      Atualizar e Baixar — sem a faixa grafite;
   2. ferramentas numa linha só, botões fantasmas agrupados por filetes finos (os rótulos
      dos grupos saem da tela; o título de cada botão continua); nada de filete dourado;
   3. embaixo, o índice de páginas num trilho leve e a mesa com a folha.
   As regras ficam aqui, no fim do editor.css, para valerem sobre as antigas.
   ===================================================================== */
.editores.editores--documental.editores--operacional { border: 1px solid var(--cor-borda); border-radius: var(--raio-lg); background: var(--cor-superficie-sutil); box-shadow: none; }

/* 1. Cabeçalho */
.editores--operacional .editor.editor--operacional > .editor__barra,
.editor.editor--operacional > .editor__barra { padding: 0; gap: 0; border: 0; border-bottom: 1px solid var(--cor-borda); border-radius: 0; background: var(--cor-superficie); box-shadow: var(--sombra-1); }
.editor--operacional > .editor__barra > .editor__linha:first-child { gap: var(--esp-3); padding: var(--esp-3) var(--esp-4); background: var(--cor-superficie); color: var(--cor-texto); }
.editor--operacional > .editor__barra > .editor__linha:first-child :is(button, a):focus-visible { --foco-cor: var(--cor-marca); --foco-contraste: var(--cor-superficie); }
.editor--operacional .editor__estado { gap: var(--esp-2); color: var(--cor-texto-secundario); }
.editor--operacional .editor__identidade { display: inline-flex; align-items: center; gap: var(--esp-2); margin-right: var(--esp-1); font-size: var(--texto-md); font-weight: var(--peso-semi); color: var(--cor-texto); }
.editor--operacional .editor__identidade-icone { display: inline-grid; place-items: center; width: var(--altura-controle-sm); height: var(--altura-controle-sm); border-radius: var(--raio-md); background: var(--cor-marca-fundo); color: var(--cor-marca-texto); }
.editor--operacional .editor__estado .selo { border: 1px solid var(--cor-borda); background: var(--cor-superficie-sutil); color: var(--cor-texto-secundario); }
.editor--operacional .editor__paginas { padding: var(--esp-05) var(--esp-2); border-radius: var(--raio-pilula); background: var(--cor-superficie-realce); font-size: var(--texto-xs); color: var(--cor-texto-secundario); }
.editor--operacional .editor__linha:first-child .editor__pendencia { min-height: var(--altura-controle-sm); border: 1px solid var(--cor-aviso-borda); border-radius: var(--raio-pilula); background: var(--cor-aviso-fundo); color: var(--cor-aviso); box-shadow: none; font-weight: var(--peso-medio); }
.editor--operacional .editor__linha:first-child .editor__pendencia::before { content: ""; width: var(--esp-2); height: var(--esp-2); margin-right: var(--esp-1); border-radius: var(--raio-pilula); background: var(--cor-aviso-solida); }
.editor--operacional .editor__linha:first-child .editor__pendencia:hover { border-color: var(--cor-aviso-solida); background: var(--cor-aviso-fundo); color: var(--cor-aviso); }
.editor--operacional .editor__linha:first-child .botao { border-color: var(--cor-borda-forte); background: var(--cor-superficie); color: var(--cor-texto); box-shadow: var(--sombra-1); }
.editor--operacional .editor__linha:first-child .botao:hover { border-color: var(--cor-marca-borda); background: var(--cor-marca-fundo); color: var(--cor-marca-texto); }
.editor--operacional .editor__linha:first-child .editor__indice { border-color: transparent; box-shadow: none; }
.editor--operacional .editor__linha:first-child .editor__indice[aria-expanded="true"] { background: var(--cor-superficie-realce); }
.editor--operacional .editor__fim { gap: var(--esp-3); }
.editor--operacional .editor__acoes { gap: var(--esp-2); }
/* Texto | PDF: o segmentado claro do sistema. */
.editor--operacional .editor__modos { padding: var(--esp-05); gap: var(--esp-05); border: 0; border-radius: var(--raio-md); background: var(--cor-superficie-realce); }
.editor--operacional .editor__linha:first-child .editor__modos .botao { height: var(--altura-controle-sm); padding-inline: var(--esp-3); border: 0; border-radius: var(--raio-sm); background: transparent; color: var(--cor-texto-secundario); box-shadow: none; font-weight: var(--peso-medio); }
.editor--operacional .editor__linha:first-child .editor__modos .botao:hover { background: var(--cor-superficie-sutil); color: var(--cor-texto); }
.editor--operacional .editor__linha:first-child .editor__modos .botao[aria-pressed="true"],
.editor--operacional .editor__linha:first-child .editor__modos .botao[aria-pressed="true"]:hover { background: var(--cor-superficie); color: var(--cor-texto); box-shadow: var(--sombra-1); font-weight: var(--peso-semi); }

/* 2. Ferramentas: uma linha, botões fantasmas, grupos separados por filete. */
.editor--operacional .editor__ferramentas { margin: 0; padding: 0; border: 0; border-top: 1px solid var(--cor-borda-sutil); background: var(--cor-superficie); }
.editor--operacional .editor__ferramentas > summary { display: none; }
.editor--operacional .editor__ferramentas .editor__linha--ferramentas,
.editor--operacional .editor__linha--ferramentas { flex-wrap: wrap; align-items: center; gap: var(--esp-1) 0; padding: var(--esp-2) var(--esp-3); border: 0; }
.editor--operacional .editor__linha--ferramentas > .editor__grupo { display: flex; align-items: center; gap: var(--esp-05); padding: 0 var(--esp-2); border: 0; }
.editor--operacional .editor__linha--ferramentas > .editor__grupo:first-child { padding-left: 0; }
.editor--operacional .editor__linha--ferramentas > .editor__grupo + .editor__grupo { padding-left: var(--esp-2); border-left: 1px solid var(--cor-borda); }
.editor--operacional .editor__linha--ferramentas > .editor__grupo[hidden] { display: none; }
.editor--operacional .editor__linha--ferramentas .editor__rotulo { display: none; }
.editor--operacional .editor__controles { gap: var(--esp-05); }
.editor--operacional .editor__linha--ferramentas .botao { min-height: var(--altura-controle-sm); border-color: transparent; background: transparent; box-shadow: none; color: var(--cor-texto-secundario); }
.editor--operacional .editor__linha--ferramentas .botao--icone { width: var(--altura-controle-sm); padding: 0; }
.editor--operacional .editor__linha--ferramentas .botao:hover:not(:disabled) { background: var(--cor-superficie-realce); color: var(--cor-texto); }
.editor--operacional .editor__linha--ferramentas .botao[aria-pressed="true"] { border-color: var(--cor-marca-borda); background: var(--cor-marca-fundo); color: var(--cor-marca-texto); }
.editor--operacional .editor__linha--ferramentas .botao:disabled { opacity: 0.35; }

/* 3. Índice e mesa */
.editores--operacional .editores__indice { gap: var(--esp-3); padding: var(--esp-4) var(--esp-3); border-right: 1px solid var(--cor-borda); background: var(--cor-superficie); }
.editores--operacional .editores__pagina { padding: var(--esp-2); border-radius: var(--raio-md); transition: background-color var(--duracao-rapida) var(--curva-padrao); }
.editores--operacional .editores__pagina:hover { background: var(--cor-superficie-sutil); }
.editores--operacional .editores__pagina[aria-current="true"] { background: var(--cor-marca-fundo); }
.editores--operacional .editores__miniatura { box-shadow: 0 0 0 1px var(--cor-borda), var(--sombra-1); }
.editores--operacional .editores__pagina[aria-current="true"] .editores__miniatura { box-shadow: 0 0 0 2px var(--cor-marca), var(--sombra-2); }
.editores--operacional .editores__legenda { font-size: var(--texto-xs); font-weight: var(--peso-medio); }
.editores--operacional .editores__pagina[aria-current="true"] .editores__legenda { color: var(--cor-marca-texto); }
.editores--operacional.editores--unidos .editores__titulo { display: flex; align-items: center; gap: var(--esp-2); margin: 0; padding: var(--esp-4) var(--esp-5) 0; background: transparent; font-size: var(--texto-sm); font-weight: var(--peso-semi); color: var(--cor-texto); }
.editores--operacional.editores--unidos .editores__titulo .editores__numero { padding: var(--esp-05) var(--esp-2); border-radius: var(--raio-pilula); background: var(--cor-superficie); box-shadow: 0 0 0 1px var(--cor-borda); font-size: var(--texto-2xs); font-weight: var(--peso-semi); letter-spacing: var(--rastreio-rotulo); text-transform: uppercase; color: var(--cor-texto-secundario); }
/* Ajustes: o trilho do índice ocupa a altura toda (desenhado no fundo da moldura, já que o
   índice acompanha a rolagem e só tem a altura das miniaturas) e a mesa em volta da folha é
   a mesma cor da mesa de dentro dela (folha.css) — sem duas faixas de cinza. */
.editores.editores--documental.editores--operacional.editores--unidos { background: linear-gradient(to right, var(--cor-superficie) calc(var(--largura-indice) - 1px), var(--cor-borda) calc(var(--largura-indice) - 1px) var(--largura-indice), var(--neutro-200) var(--largura-indice)); }
.editores.editores--documental.editores--operacional.editores--unidos:is(.editores--sem-indice, .editores--pdf) { background: var(--neutro-200); }
.editores--operacional .editores__indice { border-right: 0; background: transparent; }
.editores.editores--operacional.editores--unidos .editor.editor--operacional > .editor__barra { border: 0; border-bottom: 1px solid var(--cor-borda); border-radius: 0; background: var(--cor-superficie); }
/* A folha ocupa a mesa inteira (a própria folha já tem a mesa em volta do papel): sem a
   moldura dupla, que deixava um contorno claro em volta do quadro. */
.editores--operacional.editores--unidos .editor__folha { padding: 0; background: var(--neutro-200); }
.editores--operacional .editor__quadro { background: var(--neutro-200); }
/* Os botões do cabeçalho já nascem na própria camada de desenho: sem isso o navegador só a
   cria no primeiro hover e o texto "assenta" meio pixel (parecia uma subidinha a cada carga). */
.editor--operacional .editor__linha:first-child .botao { will-change: transform; backface-visibility: hidden; }