/* Marca Manusis4 (40-Empresa/17-marca): laranja é ação e destaque, azul estrutura,
   grafite no topo, Montserrat em tudo. */
@font-face { font-family: Montserrat; src: url(fontes/Montserrat-Regular.ttf); font-weight: 400; }
@font-face { font-family: Montserrat; src: url(fontes/Montserrat-Bold.ttf); font-weight: 700; }
@font-face { font-family: Montserrat; src: url(fontes/Montserrat-Italic.ttf); font-style: italic; }
/* Canaro nos títulos, como nos apps de tarefas e fluxo (marca: Canaro título, Montserrat corpo) */
@font-face { font-family: Canaro; src: url(fontes/Canaro-Bold.woff2) format("woff2"); font-weight: 700; font-display: swap; }

:root {
  --laranja: #F58220; --laranja-claro: #FEF1E6; --azul: #006CB7; --azul-vivo: #009BDF;
  --grafite: #1E1E1E; --grafite-2: #2B303B; --texto: #333; --cinza: #6B7280; --linha: #E2E4E8;
  --fundo: #F4F5F7; --branco: #fff; --verde: #00A651; --vermelho: #CE181E; --vermelho-claro: #FDECEC;
  --raio: 8px;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: Montserrat, system-ui, sans-serif; font-size: 14px; color: var(--texto);
       background: var(--fundo); line-height: 1.45; }
a { color: var(--azul); }
.faixa { height: 4px; background: linear-gradient(90deg, #8DC63F, #FFCB05, #F58220, #CE181E, #A50575); }
.topo { background: linear-gradient(120deg, var(--grafite-2), #1C1F28); color: #fff; display: flex;
        align-items: center; justify-content: space-between; gap: 16px; padding: 10px 24px; flex-wrap: wrap; }
.marca { display: flex; align-items: center; gap: 14px; color: #fff; text-decoration: none; }
.marca img { height: 26px; }
.marca span { font-weight: 700; letter-spacing: .12em; text-transform: uppercase; font-size: 12px;
              color: var(--laranja); border-left: 1px solid #555; padding-left: 14px; }
.quem { font-size: 12px; color: #C8CCD4; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.quem input { width: 220px; }
.aviso { background: var(--laranja-claro); color: #8A4B0F; padding: 8px 24px; font-size: 12.5px;
         border-bottom: 1px solid #F9D3B0; }
.tela { max-width: 1120px; margin: 0 auto; padding: 24px 24px 64px; }
.carregando { color: var(--cinza); }

h1, h2, .titulo-acesso { font-family: Canaro, Montserrat, sans-serif; }
h1 { font-size: 22px; margin: 0 0 4px; color: var(--grafite); }
h2 { font-size: 16px; margin: 28px 0 10px; color: var(--grafite); }
h2 .num { color: var(--laranja); margin-right: 8px; }
.sobrancelha { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--laranja); }
.sub { color: var(--cinza); margin: 0 0 16px; }
.cabeca { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }

.acesso { max-width: 440px; margin: 32px auto; }
.cartao { background: var(--branco); border: 1px solid var(--linha); border-radius: var(--raio); padding: 20px; }
.botao { font: inherit; font-weight: 700; border: 0; border-radius: var(--raio); padding: 9px 16px; cursor: pointer;
         background: var(--laranja); color: #fff; text-decoration: none; display: inline-block; }
.botao:hover { filter: brightness(.95); }
.botao.secundario { background: #fff; color: var(--grafite); border: 1px solid var(--linha); }
.botao.pequeno { padding: 5px 10px; font-size: 12px; }
.botao:disabled { opacity: .5; cursor: not-allowed; }
.acoes { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* filtros e tabela */
.filtros { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.filtros > * { flex: 1 1 160px; }
table.lista { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; }
.lista th { background: var(--grafite); color: #fff; text-align: left; font-size: 11px; letter-spacing: .08em;
            text-transform: uppercase; padding: 10px 12px; }
.lista td { padding: 11px 12px; border-top: 1px solid var(--linha); vertical-align: top; }
.lista tr.clicavel { cursor: pointer; }
.lista tr.clicavel:hover td { background: #FAFBFC; }
.numero { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.vazio { text-align: center; color: var(--cinza); padding: 32px; }

.chip { display: inline-block; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 99px;
        background: #EEF2F7; color: var(--azul); white-space: nowrap; }
.chip.rascunho { background: var(--vermelho-claro); color: var(--vermelho); }
.chip.ok { background: #E6F6EC; color: var(--verde); }

/* formulários */
.grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; }
.grade .inteiro { grid-column: 1 / -1; }
label { display: block; font-size: 12px; font-weight: 700; color: var(--grafite); margin-bottom: 4px; }
label small { font-weight: 400; color: var(--cinza); }
input, select, textarea { font: inherit; width: 100%; padding: 8px 10px; border: 1px solid #CBD0D8;
        border-radius: 6px; background: #fff; color: var(--texto); }
textarea { min-height: 64px; resize: vertical; }
.itens-escopo textarea { min-height: 56px; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--azul-vivo); outline-offset: -1px; border-color: transparent; }
.invalido { border-color: var(--vermelho) !important; background: var(--vermelho-claro); }
.lacuna { border-color: var(--laranja) !important; background: var(--laranja-claro); }
.erro-campo { color: var(--vermelho); font-size: 12px; margin-top: 3px; }
.dica { color: var(--cinza); font-size: 12px; margin-top: 3px; }
.mensagem { padding: 10px 14px; border-radius: var(--raio); margin: 12px 0; }
.mensagem.erro { background: var(--vermelho-claro); color: var(--vermelho); }
.mensagem.ok { background: #E6F6EC; color: #046A33; }
.mensagem.alerta { background: var(--laranja-claro); color: #8A4B0F; }

/* abas */
.abas { display: flex; gap: 4px; border-bottom: 1px solid var(--linha); margin: 16px 0 20px; overflow-x: auto; }
.abas button { font: inherit; font-weight: 700; background: none; border: 0; padding: 10px 14px; cursor: pointer;
               color: var(--cinza); border-bottom: 3px solid transparent; white-space: nowrap; }
.abas button[aria-selected="true"] { color: var(--grafite); border-bottom-color: var(--laranja); }

/* editor da composição */
.linha-lista { display: flex; gap: 8px; align-items: flex-start; margin-bottom: 8px; }
.linha-lista textarea, .linha-lista input { flex: 1; }
.remover { background: none; border: 0; color: var(--cinza); font-size: 18px; cursor: pointer; padding: 6px; line-height: 1; }
.remover:hover { color: var(--vermelho); }
.itens-escopo .item { display: grid; grid-template-columns: 1.1fr 2fr 90px 1.1fr 32px; gap: 8px; margin-bottom: 10px; align-items: start; }
.itens-escopo .item.sem-perfil { grid-template-columns: 1.2fr 2.4fr 90px 32px; }
.itens-escopo .rotulos { font-size: 11px; font-weight: 700; color: var(--cinza); text-transform: uppercase; letter-spacing: .06em; }
.etapas .item { display: grid; grid-template-columns: 2fr 1fr 32px; gap: 8px; margin-bottom: 8px; }
.painel-total { position: sticky; bottom: 0; background: var(--grafite); color: #fff; border-radius: var(--raio);
                padding: 12px 18px; display: flex; gap: 24px; align-items: center; flex-wrap: wrap; margin-top: 24px; }
.painel-total .valor { font-size: 20px; font-weight: 700; color: var(--laranja); font-variant-numeric: tabular-nums; }
.painel-total .rotulo { font-size: 11px; color: #C8CCD4; text-transform: uppercase; letter-spacing: .08em; }
.painel-total .acoes { margin-left: auto; }
.lista-erros { margin: 0; padding-left: 18px; }
.grupo { margin: 10px 0; }
.previa { width: 100%; height: 760px; border: 1px solid var(--linha); border-radius: var(--raio); background: #fff; margin-top: 12px; }
@media (max-width: 720px) { .previa { height: 520px; } }

.trilha { list-style: none; padding: 0; margin: 0; border-left: 2px solid var(--linha); }
.trilha li { padding: 0 0 16px 16px; position: relative; }
.trilha li::before { content: ""; position: absolute; left: -6px; top: 5px; width: 10px; height: 10px; border-radius: 50%; background: var(--laranja); }
.trilha .quando { font-size: 12px; color: var(--cinza); }
dl.dados { display: grid; grid-template-columns: 200px 1fr; gap: 8px 16px; margin: 0; }
dl.dados dt { font-weight: 700; color: var(--grafite); }
dl.dados dd { margin: 0; }

@media (max-width: 720px) {
  .tela { padding: 16px 16px 48px; }
  .topo { padding: 10px 16px; }
  .grade { grid-template-columns: 1fr; }
  dl.dados { grid-template-columns: 1fr; }
  .itens-escopo .item, .itens-escopo .item.sem-perfil { grid-template-columns: 1fr 90px 32px; }
  .itens-escopo .item > :nth-child(2) { grid-column: 1 / -1; order: 5; }
  .itens-escopo .item > .perfil { grid-column: 1 / -1; order: 6; }
  .itens-escopo .rotulos { display: none; }
  .etapas .item { grid-template-columns: 1fr 32px; }
  .etapas .item > :nth-child(2) { grid-column: 1 / 2; }
  table.lista thead { display: none; }
  table.lista tr { display: block; border-top: 1px solid var(--linha); padding: 8px 0; }
  table.lista td { display: block; border: 0; padding: 3px 12px; }
  .painel-total { padding: 8px 12px; gap: 12px; }
  .painel-total .valor { font-size: 15px; }
  .painel-total .rotulo { font-size: 10px; }
  .painel-total .chip { display: none; }
  .painel-total .acoes { margin-left: auto; }
  .painel-total .botao { padding: 7px 12px; }
}

/* ---------- tela de entrada: capa dos decks, igual aos apps de tarefas e fluxo ---------- */
body.modo-acesso .faixa, body.modo-acesso .topo, body.modo-acesso .aviso { display: none; }
body.modo-acesso .tela { max-width: none; padding: 0; }
.capa-acesso { position: relative; overflow: hidden; min-height: 100vh; display: flex; align-items: center;
               justify-content: center; padding: 16px; background: linear-gradient(135deg, #2B303B 0%, #1C1F28 100%); }
.capa-acesso .malha { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; min-width: 1100px; opacity: .07;
                      pointer-events: none; user-select: none; }
.capa-acesso .faixa-capa { position: absolute; top: 0; left: 0; right: 0; height: 4px;
                           background: linear-gradient(90deg, #8DC63F, #FFCB05, #F58220, #CE181E, #A50575, #564894); }
.hexagono-capa { position: absolute; aspect-ratio: 1 / 1.16; pointer-events: none; display: block; }
.cartao-acesso { position: relative; background: #fff; border-radius: 8px; padding: 40px; width: 100%; max-width: 400px;
                 box-shadow: 0 24px 60px rgba(0, 0, 0, .35); border-top: 4px solid var(--laranja); }
.logo-acesso { height: 38px; display: block; }
.titulo-acesso { font-size: 24px; line-height: 1.2; margin: 0; color: var(--grafite); }
.cartao-acesso input { padding: 12px 14px; border-color: #E4E8EB; border-radius: 6px; margin-bottom: 4px; }
.botao-acesso { width: 100%; padding: 13px; font-size: 15px; margin-top: 18px; }
.link-acesso { text-align: center; margin: 16px 0 0; }
.link-acesso a { color: var(--azul); font-weight: 700; text-decoration: none; }
.rodape-acesso { text-align: center; color: #9CA3AF; font-size: 11.5px; margin: 22px 0 0; }
@media (max-width: 767px) {
  .hexagono-capa { display: none; }
  .cartao-acesso { padding: 28px 22px; }
}

/* ---------- fluxo de aprovação ---------- */
.fila { margin-bottom: 16px; border-left: 4px solid var(--laranja); }
.item-fila { display: grid; grid-template-columns: 190px 1fr; gap: 2px 14px; padding: 10px 0; border-top: 1px solid var(--linha);
             text-decoration: none; color: var(--texto); }
.item-fila:hover { background: #FAFBFC; }
.item-fila .dica { grid-column: 2; }
.painel-acoes { margin: 12px 0 4px; border-left: 4px solid var(--azul); }
.painel-acoes textarea { min-height: 54px; margin-top: 8px; }
@media (max-width: 720px) { .item-fila { grid-template-columns: 1fr; } .item-fila .dica { grid-column: 1; } }

/* ---------- fluxo de aprovação (admin) ---------- */
.fluxo { margin-bottom: 16px; border-left: 4px solid var(--azul); }
.etapas-fluxo { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.etapa-fluxo { border: 1px solid var(--linha); border-radius: 10px; padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; }
.etapa-fluxo h3 { margin: 0; font-size: 15px; }
.etapa-fluxo select { max-width: 100%; }
.pessoas-etapa { display: flex; flex-wrap: wrap; gap: 4px; }
.pessoa-etapa { display: inline-flex; gap: 4px; align-items: center; }
.pessoa-etapa .remover { font-size: 14px; padding: 0 2px; }
@media (max-width: 900px) { .etapas-fluxo { grid-template-columns: 1fr; } }

/* ---------- ações do closer ---------- */
.form-acao { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--linha); }
.form-acao h3 { margin: 0 0 6px; font-size: 15px; }
.envios { margin: 0; padding-left: 18px; }
.envios li { margin: 6px 0; }

/* ---------- página do cliente (link) ---------- */
.tela-cliente { max-width: 760px; }
.cartao-cliente { margin-bottom: 16px; }
.pdfs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px; }
.botao-pdf { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; text-align: left; cursor: pointer;
             border: 1px solid var(--linha); border-left: 4px solid var(--laranja); border-radius: var(--raio);
             background: var(--branco); padding: 14px 16px; font: inherit; color: var(--texto); }
.botao-pdf:hover { background: var(--laranja-claro); }
.botao-pdf span { font-size: 12px; color: var(--cinza); word-break: break-all; }
.respostas { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 14px; }
.respostas textarea { min-height: 70px; margin-bottom: 10px; }
@media (max-width: 640px) { .pdfs, .respostas { grid-template-columns: 1fr; } }

/* ---------- alertas na tela inicial ---------- */
.alertas { margin-bottom: 16px; border-left: 4px solid var(--vermelho); }
.grupo-alerta + .grupo-alerta { margin-top: 12px; }
.grupo-alerta .sobrancelha { margin-bottom: 2px; }

/* ---------- painel do funil (padrao dos dashboards: cabecalho azul, cards uniformes, tag de periodo) ---------- */
.painel-cabeca { background: linear-gradient(120deg, var(--azul), var(--azul-vivo)); color: #fff; border-radius: 12px;
                 padding: 18px 22px; margin: 10px 0 18px; display: flex; justify-content: space-between; align-items: flex-end;
                 gap: 16px; flex-wrap: wrap; }
.painel-cabeca h1 { color: #fff; margin: 2px 0 0; }
.painel-cabeca .sobrancelha { color: #D6ECFA; }
.filtros-painel { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.filtros-painel select, .filtros-painel input { width: auto; }
.filtros-painel .datas { display: inline-flex; gap: 6px; align-items: center; }
.kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 18px; }
.kpi { background: var(--branco); border: 1px solid var(--linha); border-radius: 10px; padding: 14px 16px; min-height: 118px;
       display: flex; flex-direction: column; gap: 6px; }
.kpi-rotulo { font-size: 12px; font-weight: 700; color: var(--cinza); text-transform: uppercase; letter-spacing: .04em; }
.kpi-valor { font-family: Canaro, Montserrat, sans-serif; font-size: 26px; color: var(--grafite); }
.tag-periodo { align-self: flex-start; font-size: 11px; background: #E8F3FB; color: var(--azul); border-radius: 999px; padding: 2px 8px; }
@media (max-width: 900px) { .kpis { grid-template-columns: repeat(2, 1fr); } }
.filtros-painel .datas[hidden] { display: none; }
.kpi { min-width: 0; }
.kpi-valor { overflow-wrap: anywhere; }
@media (max-width: 900px) { .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .kpi-valor { font-size: 20px; } .kpi { padding: 12px; } }

/* ================================================================
   App de Procedimentos — acréscimos ao estilo da casa
   ================================================================ */
.menu { display: flex; gap: 4px; flex: 1; margin-left: 12px; flex-wrap: wrap; }
.menu a { color: #C8CCD4; text-decoration: none; font-weight: 700; font-size: 13px; padding: 6px 10px; border-radius: 6px; }
.menu a:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.menu a.ativo { color: #fff; box-shadow: inset 0 -3px 0 var(--laranja); border-radius: 0; }
.quem a { color: #C8CCD4; }
body.modo-acesso .menu { display: none; }

.chip.alerta { background: var(--laranja-claro); color: #8A4B0F; }
.chip.cinza { background: #EEF0F3; color: var(--cinza); }
.texto-vermelho { color: var(--vermelho); font-weight: 700; }
.texto-laranja { color: #B4530F; font-weight: 700; }
.botao-link { background: none; border: 0; color: var(--azul); font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; padding: 4px 6px; }
.botao-link:hover { text-decoration: underline; }
.remover.claro { color: #C8CCD4; }
.caixa { display: inline-flex; gap: 6px; align-items: center; font-weight: 400; font-size: 13px; margin: 0 14px 6px 0; cursor: pointer; }
.caixa input { width: auto; }
.caixas { display: flex; flex-wrap: wrap; margin-top: 6px; }
.caixas.colunas { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 2px 12px; }
.codigo-previsto { margin-top: 12px; padding: 10px 12px; background: #EEF6FC; border-left: 4px solid var(--azul); border-radius: 6px;
                   font-weight: 700; color: var(--azul); font-size: 13px; }
.rolagem { overflow-x: auto; }
.cartao + .cartao, .cartao + h2, .kpis + .cartao { margin-top: 14px; }
.dica-papeis { margin-top: 14px; font-size: 12.5px; color: var(--cinza); }

/* janela modal */
.modal-fundo { position: fixed; inset: 0; background: rgba(20, 22, 28, .55); display: flex; align-items: flex-start; justify-content: center;
               padding: 5vh 16px; z-index: 50; overflow-y: auto; }
.modal { background: #fff; border-radius: 10px; width: 100%; max-width: 620px; box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
         border-top: 4px solid var(--laranja); }
.modal.modal-largo { max-width: 1000px; }
.modal-cabeca { display: flex; justify-content: space-between; align-items: center; padding: 14px 20px 0; }
.modal-cabeca h2 { margin: 0; }
.modal-corpo { padding: 12px 20px; }
.modal-rodape { padding: 0 20px 18px; }

/* início */
.fila .item-fila { grid-template-columns: 170px 1fr; }
.alertas { border-left-color: var(--vermelho); }

/* etapas, decisão, leitura */
.etapas { margin-bottom: 14px; }
.lista-etapas { list-style: none; padding: 0; margin: 6px 0 0; }
.lista-etapas li { padding: 6px 0; border-top: 1px solid var(--linha); }
.leitura { background: #fff; border: 1px solid var(--linha); border-radius: var(--raio); padding: 8px 24px 24px; margin-top: 14px; }
.titulo-secao { color: var(--azul); border-bottom: 2px solid var(--laranja); padding-bottom: 4px; margin-top: 26px; }
.subtitulo { color: var(--laranja); text-transform: uppercase; letter-spacing: .08em; font-size: 12px; margin: 16px 0 6px; font-family: Montserrat, sans-serif; }
.tabela-doc { width: 100%; border-collapse: collapse; font-size: 13px; margin: 6px 0; }
.tabela-doc th { background: var(--azul); color: #fff; text-align: left; padding: 6px 8px; font-size: 12px; }
.tabela-doc td { padding: 6px 8px; border-bottom: 1px solid var(--linha); vertical-align: top; }
.tabela-doc tr:nth-child(even) td { background: #F4F6F9; }
.comentarios { margin: 8px 0 4px; }
.comentario { background: #FFF8E6; border-left: 3px solid #FFCB05; padding: 8px 10px; border-radius: 4px; margin-bottom: 6px; font-size: 13px; }
.mermaid-alvo { background: #fff; border: 1px dashed var(--linha); border-radius: 8px; padding: 10px; overflow-x: auto; }
.mermaid-alvo svg { max-width: 100%; height: auto; }
pre { white-space: pre-wrap; font-size: 12px; background: #F4F6F9; padding: 8px; border-radius: 6px; }
.apontamentos li { margin: 6px 0; }

/* editor */
.barra-editor { position: sticky; top: 0; z-index: 5; display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
                background: var(--grafite); color: #fff; padding: 10px 14px; border-radius: var(--raio); margin-bottom: 14px; }
.barra-editor .botao.secundario { background: transparent; color: #fff; border-color: #555; }
.barra-editor .botao-link { color: #C8CCD4; }
.status-salvo { font-size: 12px; color: #9FE0B8; margin-right: auto; }
.status-salvo.pendente { color: #FFCB05; }
.status-salvo.erro { color: #FF9C9C; }
.editor { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 18px; align-items: start; }
.lateral { position: sticky; top: 64px; display: flex; flex-direction: column; gap: 12px; }
.checagem { background: #fff; border: 1px solid var(--linha); border-left: 4px solid var(--cinza); border-radius: var(--raio); padding: 12px; font-size: 12.5px; }
.checagem.ok { border-left-color: var(--verde); }
.checagem.bloqueada { border-left-color: var(--vermelho); }
.checagem ul { padding-left: 16px; margin: 6px 0; }
.checagem li { margin: 4px 0; }
.lista-bloqueios a { color: var(--vermelho); font-weight: 700; }
.lista-avisos a { color: #B4530F; font-weight: 700; }
.indice-secoes { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--linha); border-radius: var(--raio); padding: 8px; }
.indice-secoes a { text-decoration: none; color: var(--texto); font-size: 12.5px; padding: 4px 6px; border-radius: 4px; }
.indice-secoes a:hover { background: #F4F6F9; }
.secao-edicao { background: #fff; border: 1px solid var(--linha); border-radius: var(--raio); padding: 12px 16px; margin: 10px 0;
                transition: box-shadow .3s; scroll-margin-top: 70px; }
.secao-edicao.destaque { box-shadow: 0 0 0 3px var(--laranja); }
.secao-topo { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.secao-topo .subtitulo { margin-top: 0; }
.obrigatoria { color: var(--vermelho); }
.secao-edicao > .dica { margin: -2px 0 8px; }
.num-lista { font-weight: 700; color: var(--laranja); min-width: 44px; padding-top: 8px; font-size: 12px; }
.tabela-edicao { width: 100%; border-collapse: collapse; margin-bottom: 8px; }
.tabela-edicao th { text-align: left; font-size: 11px; color: var(--cinza); text-transform: uppercase; letter-spacing: .05em; padding: 4px; white-space: nowrap; }
.tabela-edicao td { padding: 3px; vertical-align: top; }
.tabela-edicao textarea { min-height: 38px; }
.tabela-edicao.raci select { min-width: 64px; }
.tabela-edicao .linha-alerta td { background: var(--vermelho-claro); }
.acoes-linha { white-space: nowrap; width: 1%; }
textarea.codigo { font-family: Consolas, monospace; font-size: 12px; }
.mermaid-previa { min-height: 80px; }
.sugestao { border: 1px solid var(--linha); border-radius: 8px; padding: 10px 12px; margin: 10px 0; }
.sugestao-corpo { margin-top: 6px; font-size: 13px; }

@media (max-width: 900px) {
  .editor { grid-template-columns: 1fr; }
  .lateral { position: static; }
  .indice-secoes { display: none; }
  .menu { order: 3; margin-left: 0; width: 100%; }
}
@media (max-width: 720px) {
  .leitura { padding: 4px 12px 16px; }
  .tabela-edicao thead { display: none; }
  .tabela-edicao tr { display: block; border-top: 1px solid var(--linha); padding: 6px 0; }
  .tabela-edicao td { display: block; }
  .fila .item-fila { grid-template-columns: 1fr; }
}