/* =====================================================
   Audithec Thermal Pro 3.3.1 — DARK TECH PREMIUM
   RDC · Design System Dark · 2026
   ===================================================== */

:root {
  /* ── Fundos — Manual Identidade RDC (Jun 2026) ────────────────────────── */
  --rdc-bg-deep:         #0A2E5C;  /* Azul AUDITHEC oficial */
  --rdc-bg-card:         #0D3770;  /* Card — variante clara do bg-deep */
  /* Superfície de MODAL. Existe separada de --rdc-bg-card porque no shell da
     auditoria (body.v2) o card é rgba(...,0.60) de propósito, para os painéis
     deixarem a planta industrial aparecer por trás. Num pop-up isso deixava o
     conteúdo da página legível ATRAVÉS da caixa — o CNPJ do cliente aparecia
     no meio da mensagem de erro. Modal é opaco, nos dois temas. */
  --rdc-superficie-modal: #0E2743;
  --rdc-bg-input:        #082448;  /* Input — variante escura do bg-deep */
  /* Texto de TODO campo de entrada. Token próprio, e não --rdc-text-pure direto,
     porque o shell da auditoria (styles-ui.css, body.v2) usa outro tom e o
     texto do campo precisa ser UM por tema — inclusive no campo que o
     navegador preenche sozinho, que ignora `color` (ver .fg input:-webkit-autofill). */
  --campo-txt:           #FFFFFF;

  /* ── Cores primárias — Manual Identidade RDC ─────────────────────────── */
  --rdc-orange:          #FF6B35;  /* Laranja primária oficial RDC */
  --rdc-orange-rgb:      255,107,53; /* Canais de --rdc-orange p/ rgba(var(--rdc-orange-rgb),alfa) —
                                        usado em M4 (view.js) e nunca tinha sido declarado; a regra
                                        caía em rgba(,.08), inválida, e o destaque do item ativo do
                                        ranking de combustíveis não aparecia. */
  --rdc-orange-br:       #FF8C52;  /* Laranja claro (hover / destaque) — V2 */
  --rdc-orange-dp:       #E05A28;  /* Laranja escuro (sombra / gradiente) — V2 */
  --rdc-laranja:         #FF6B35;  /* Alias explícito do manual */
  --rdc-cyan:            #4FC6E0;  /* Ciano técnico — V2 atualizado */
  /* Laranja e ciano quando são a cor do TEXTO. No escuro, a própria marca; no
     claro, o mesmo matiz escurecido (ver blocos de tema abaixo). Tokens à
     parte porque #FF6B35 e #4FC6E0 sobre branco dão 2,8:1 e 1,9:1 — o PO viu
     valores calculados ilegíveis em M1, M2, M7, M8 e M9 (24/09). Fundo, borda
     e botão continuam em --rdc-orange/--rdc-cyan, com o valor da marca. */
  --rdc-orange-txt:      var(--rdc-orange);
  --rdc-orange-br-txt:   var(--rdc-orange-br);
  --rdc-cyan-txt:        var(--rdc-cyan);

  /* ── Tokens de contexto — Manual Identidade RDC ─────────────────────── */
  --rdc-fundo-website:   #001F3F;  /* Azul Marinho — site institucional */
  --rdc-fundo-auditec:   #0A2E5C;  /* Azul AUDITHEC — este sistema */
  --rdc-fundo-documento: #FFFFFF;  /* Branco — PDFs e relatórios */

  /* ── Texto ───────────────────────────────────────────────────────────── */
  --rdc-text-pure:       #FFFFFF;
  --rdc-text-muted:      #94A3B8;
  --rdc-text-light:      #CBD5E1;
  --rdc-text-base:       var(--rdc-text-light); /* Alias — M6 (controller.js) usa este nome pro
                                                    texto de ação das recomendações e nunca tinha
                                                    sido declarado; caía em cor herdada do pai. */
  --rdc-texto-claro:     #B0C4DE;  /* Texto sobre fundos escuros (manual) */
  --rdc-texto-escuro:    #1a1a1a;  /* Texto sobre fundos claros (manual) */

  /* ── Bordas e estado ─────────────────────────────────────────────────── */
  --rdc-border:          #1B4A7E;  /* Borda — complemento do bg-deep */
  --rdc-green:           #1A7F3C;
  --rdc-red:             #C62828;
  --rdc-amber:           #92600A;

  /* ── Status semafórico — tokens únicos para todo o sistema ────────────
     Eram auto-referenciados (--status-ok: var(--status-ok)) — custom property
     circular resolve para "guaranteed-invalid value" no CSS, então nenhum dos
     4 nunca teve cor real. Todo badge/valor que dependia só do var(), sem cor
     literal de reforço no mesmo seletor, herdava a cor do texto do elemento
     pai em vez do verde/amarelo/vermelho pretendido. Os valores abaixo não são
     novos: são os mesmos literais já usados como rgba(...) em dezenas de
     regras deste arquivo — ver SRS-UI-FORM-VISUAL-STANDARD-001 item 4.1. */
  --status-ok:           #22C55E;
  --status-warn:         #EAB308;
  --status-danger:       #EF4444;
  --status-info:         var(--rdc-cyan-txt); /* -txt: é cor de texto e de traço; no claro, o ciano escuro */
  --status-na:           var(--rdc-text-muted); /* Indeterminado/N-A — usado em M9
                            (controller.js:64) e nunca declarado; o mesmo caso
                            "Indeterminado" em controller.js:135 já usa
                            --rdc-text-muted direto, então é o valor certo. */

  /* ── Layout ──────────────────────────────────────────────────────────── */
  --sidebar-w:           260px;
  --sidebar-collapsed-w: 48px;
  --kpi-w:               280px;
  /* Altura da barra compartilhada (shared/appHeader.js), MEDIDA no navegador:
     .9rem de padding em cima e embaixo, o botão de 38px e o rótulo sob ele
     ("Início", "Tema"...), mais 1px de borda. Só a conta dos números do CSS
     dava 69 e ignorava o rótulo — e o wizard, que posiciona sidebar, área de
     trabalho e painel de KPI a partir daqui, ficava 11px POR BAIXO da barra.
     Mudou o tamanho da fonte do rótulo? Meça de novo, não recalcule de cabeça. */
  --header-h:            80px;
  --footer-h:            56px;
  --sh-sm: 0 1px 4px rgba(0,0,0,.4), 0 2px 10px rgba(0,0,0,.3);
  --sh-md: 0 4px 20px rgba(0,0,0,.5), 0 1px 4px rgba(0,0,0,.3);
  --r: 8px; --r-sm: 6px;
  --r-md: var(--r); /* Usado em M9 (styles.css .rag-semaforo-wrap) e nunca declarado —
                        border-radius caía em 0 (initial value). Alias de --r: é o único
                        raio "padrão" que já existe além do --r-sm menor. */

  /* ── Espaçamento (grid 8px) — Manual RDC "Respiro" ───────────────────── */
  --sp-1:  8px;
  --sp-2: 16px;
  --sp-3: 24px;
  --sp-4: 32px;
  --sp-6: 48px;

  /* ── Recesso de painel — pedido do PO (22/09): substitui o rgba(0,0,0,.25)
     hardcoded usado em .rag-semaforo-wrap (e candidatos semelhantes achados
     na Fase 0 do levantamento de tema). Como token, cada tema define o
     próprio "encaixe visual" em vez de um preto cru que só faz sentido
     sobre fundo escuro. */
  --panel-recesso: rgba(0,0,0,.25);

  /* Fundo tintado do status "atenção" (--status-warn, amarelo) — é uma cor
     semântica de risco (RAG/KPI), separada do acento laranja/azul da marca,
     então tem o próprio par claro/escuro em vez de reusar --rdc-orange-*. */
  --status-warn-bg: rgba(234,179,8,.18);
  /* Par claro/escuro para os avisos tintados (banners do Live Preview, título
     dos pop-ups). Os tons claros — #fca5a5, #fcd34d — foram escolhidos para
     LER SOBRE FUNDO ESCURO; no tema claro eles caíam sobre a versão clara do
     mesmo fundo tintado e ficava vermelho-claro sobre rosa-claro, ilegível
     (relatado pelo PO em 23/09, no banner "CÁLCULO BLOQUEADO"). O fundo já
     tinha o seu par desde o início (--status-warn-bg); o TEXTO não tinha. */
  --status-danger-bg:  rgba(220,38,38,.12);
  --status-danger-txt: #FCA5A5;
  --status-danger-tit: #F87171;
  --status-warn-txt:   #FCD34D;
  --status-warn-tit:   #F59E0B;

  /* Fase 2 do plano de tema (PR2) — canais RGB (sem o alfa) pras ~150
     ocorrências de rgba(255,255,255,X)/rgba(0,0,0,X) espalhadas pelo
     arquivo, mesmo padrão já usado em --rdc-orange-rgb (ver comentário
     acima). Cada regra usava um X (alfa) escolhido a dedo pro peso visual
     daquele elemento — trocar só os CANAIS aqui preserva o alfa original
     de cada uma sem precisar reescrever as ~150 linhas uma por uma.
       --wash-rgb: branco translúcido no escuro (realça uma superfície
       sobre fundo escuro — hover, divisor, scrollbar, badge). No claro
       vira um azul-marinho translúcido: branco sobre branco seria
       invisível, o papel ("realçar") é o mesmo, a direção que inverte.
       --recesso-rgb: preto translúcido no escuro (afunda uma superfície —
       poço, caixa de KPI, .rag-semaforo-wrap). No claro era o mesmo azul-
       marinho de --wash-rgb, e com os alfas pensados pro escuro (.2-.3)
       isso dava um cinza pesado (#C2C8CF) sob os campos calculados — texto
       nenhum ficava legível em cima. Agora é um azul-acinzentado claro
       (170,190,215): a .25 resulta em #EAEFF5, poço visível e texto legível. */
  --wash-rgb:    255,255,255;
  --recesso-rgb: 0,0,0;

  /* Fundo da barra de cabeçalho — achado na Fase 0 do PR3: #0D1527 estava
     hardcoded (sem var()) em 19 regras/16 arquivos, nunca tinha sido
     tokenizado. Precisa ser ADAPTATIVO (não fixo tipo laranja/ciano): o
     texto do cabeçalho já usa --rdc-text-pure, que É adaptativo — cabeçalho
     fixo escuro + texto virando escuro no tema claro apagaria o título. */
  --rdc-bg-header: #0D1527;
}

/* =====================================================
   TEMA CLARO/ESCURO — pedido do PO (22/09)
   ===================================================== */
/* Design dark-first: o :root acima já É o tema escuro (histórico do
   sistema, nunca mudou) — aqui só ENTRAM os valores do tema claro, nos dois
   gatilhos possíveis:
     1) "Sistema" (nenhum atributo data-theme): @media prefers-color-scheme
        decide sozinho, sem JS.
     2) Escolha explícita: [data-theme="light"] vence a preferência do SO.
   Todo token redefinido aqui já existe no :root acima — nenhuma cor nasce
   só dentro de um destes blocos (senão um seletor sem :root correspondente
   fica ilegível quando o outro tema está ativo).

   ESCOPO DESTA FASE (PR1 do plano de tema): só a INFRAESTRUTURA de tokens.
   As ~183 regras de styles.css que hoje usam rgba(0,0,0,...)/rgba(255,255,255,...)
   cru (pensadas só pro fundo escuro) ainda não foram migradas pros tokens —
   isso é o PR2. Até lá, ativar [data-theme="light"] de propósito mostra uma
   mistura incompleta; é esperado dentro do branch feature/tema-claro-escuro,
   nunca chega a developer/main antes do PR2+PR3 fecharem. */
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --rdc-bg-deep:    #EEF2F9;
    --rdc-bg-card:    #FFFFFF;
    --rdc-superficie-modal: #FFFFFF;
    --rdc-bg-input:   #F7F9FC;
    --rdc-border:     #D7E0EF;

    --rdc-text-pure:  #10223D;
    --rdc-text-muted: #5B6B85;
    --rdc-text-light: #33465F;
    --campo-txt:      #10223D;
    /* Texto legível no claro — ver :root[data-theme="light"]. */
    --rdc-orange-txt: #9A3412;
    --rdc-orange-br-txt: #9A3412;
    --rdc-cyan-txt:   #155E75;
    --status-ok:      #166534;
    --status-warn:    #854D0E;
    --status-danger:  #B91C1C;

    --panel-recesso:   rgba(10,34,61,.05);
    --status-warn-bg:  #FDF3D6;
  --status-danger-bg:  #FEF2F2;
  --status-danger-txt: #991B1B;
  --status-danger-tit: #B91C1C;
  --status-warn-txt:   #854D0E;
  --status-warn-tit:   #92500A;
    --status-danger-bg:  #FEF2F2;
    --status-danger-txt: #991B1B;
    --status-danger-tit: #B91C1C;
    --status-warn-txt:   #854D0E;
    --status-warn-tit:   #92500A;

    --wash-rgb:    10,34,61;
    --recesso-rgb: 170,190,215;

    --rdc-bg-header: #FFFFFF;
    --rdc-fundo-website: #FFFFFF;
  }
}

:root[data-theme="light"] {
  --rdc-bg-deep:    #EEF2F9;
  --rdc-bg-card:    #FFFFFF;
  --rdc-superficie-modal: #FFFFFF;
  --rdc-bg-input:   #F7F9FC;
  --rdc-border:     #D7E0EF;

  --rdc-text-pure:  #10223D;
  --rdc-text-muted: #5B6B85;
  --rdc-text-light: #33465F;
  --campo-txt:      #10223D;
  /* Texto de marca e de status legível no claro. O alvo é 4,5:1 sobre os
       fundos TINGIDOS (badge, poço, card de KPI), não só sobre branco: com o
       tom -700 (#C2410C, #0E7490...) metade dos valores ficava em 4,0-4,4
       nesses fundos. Por isso -800: laranja #9A3412 (o mesmo do selo em
       styles-ui.css), ciano #155E75, verde #166534, amarelo #854D0E (igual
       a --status-warn-txt), vermelho #B91C1C — todos >= 7:1 sobre branco.
       Os valores do escuro (#22C55E, #EAB308, #FF6B35, #4FC6E0) ficavam
       entre 1,2 e 2,8:1 no claro. */
  --rdc-orange-txt: #9A3412;
  --rdc-orange-br-txt: #9A3412;
  --rdc-cyan-txt:   #155E75;
  --status-ok:      #166534;
  --status-warn:    #854D0E;
  --status-danger:  #B91C1C;

  --panel-recesso:   rgba(10,34,61,.05);
  --status-warn-bg:  #FDF3D6;
  --status-danger-bg:  #FEF2F2;
  --status-danger-txt: #991B1B;
  --status-danger-tit: #B91C1C;
  --status-warn-txt:   #854D0E;
  --status-warn-tit:   #92500A;

  --wash-rgb:    10,34,61;
  --recesso-rgb: 170,190,215;

  --rdc-bg-header: #FFFFFF;

  /* Azul marinho institucional. No escuro pinta cabecalho, sidebar e faixas de
     KPI; no claro, essas MESMAS superficies precisam acompanhar o tema — sem
     esta linha elas ficavam azul-escuras sobre a tela clara, em 7 pontos.
     O azul segue valendo como cor de marca em borda, texto e destaque; o que
     muda e o papel de SUPERFICIE. */
  --rdc-fundo-website: #FFFFFF;
}

/* Laranja (--rdc-orange e variantes) e ciano (--rdc-cyan) NÃO aparecem em
   nenhum dos dois blocos acima — pedido do PO: "use ainda o laranja e o
   azul" continua valendo com o MESMO valor nos dois temas, só o papel do
   azul de fundo (--rdc-bg-deep) muda de "tela inteira" pra "fundo claro".
   --rdc-texto-claro/--rdc-texto-escuro também ficam de fora: são tokens
   role-locked ("texto sobre fundo escuro"/"texto sobre fundo claro" — ver
   comentário original), não "texto primário do tema atual", e continuam
   válidos nos dois temas onde quer que um retalho escuro/claro apareça
   independente do tema geral (ex.: cabeçalho de marca). */

/* Nome da página, primeiro elemento do conteúdo em cada tela. Saiu de dentro
   do cabeçalho quando as barras foram unificadas (PO, 23/09): título dentro da
   barra fazia o texto mudar de tela para tela, que é justamente o que impedia
   as barras de serem idênticas. */
.pagina-titulo {
  font-size: 1.15rem; font-weight: 800; color: var(--rdc-text-pure);
  margin: 0 0 1.25rem; letter-spacing: .2px;
}

/* Botão de tema — construído por shared/tema.js (montarToggle), CSS
   centralizado aqui pra não duplicar em 21 telas.
   Era um grupo de três rótulos de texto ("Sistema | Claro | Escuro") que
   ocupava 194px do cabeçalho; virou um botão só com sol ou lua por decisão do
   PO em 23/09. */
.tema-toggle { display: inline-flex; flex: none; }
.tema-toggle .tema-btn {
  appearance: none; display: inline-flex; align-items: center; justify-content: center;
  /* Mesma caixa dos .hm-icon-btn ao lado (sem contorno, PO 24/09): o botão
     vive dentro da barra, entre eles, e qualquer diferença salta aos olhos. */
  width: 38px; height: 38px; padding: 0; border-radius: 8px; cursor: pointer;
  background: transparent; border: 0;
  color: var(--rdc-text-light); transition: color .15s ease, background .15s ease;
}
.tema-toggle .tema-btn:hover { background: rgba(var(--wash-rgb),.08); color: var(--rdc-orange-txt); }
.tema-toggle .tema-btn:focus-visible { outline: 2px solid var(--rdc-orange); outline-offset: 2px; }
/* O SVG herda currentColor do botão — é o que faz o ícone acompanhar o tema
   e o hover sem uma segunda regra de cor. */
.tema-toggle .tema-btn svg { display: block; }

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;
  background: var(--rdc-bg-deep);
  color: var(--rdc-text-light);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}

/* ── HEADER ──────────────────────────────────────────────────────────────── */
.header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: var(--header-h);
  background: var(--rdc-fundo-website);
  border-bottom: 2px solid var(--rdc-orange);
  display: flex; align-items: center; justify-content: space-between; padding: 0 1.25rem;
  box-shadow: 0 2px 16px rgba(0,0,0,.6); /* sombra fica preta nos dois temas — nao e superficie, nao inverte */
}

/* ── LOGO + TÍTULO CENTRALIZADOS ──────────────────────────────────────────── */
.header-brand-section {
  display: flex; align-items: center; gap: 1.2rem; justify-content: center; flex: 1;
}
/* 64px dentro da faixa de 76px (ver index.html). A regra existe porque a logo
   já vazou a faixa: com 80px numa faixa de 64px ela saía 8px acima e abaixo —
   invisível enquanto a arte tinha placa escura sobre cabeçalho escuro,
   gritante quando o tema claro chegou. Mantenha logo < faixa. */
.header-logo-wrap { display: flex; align-items: center; height: 64px; }
.header-logo-wrap img { height: auto; max-height: 64px; width: auto; object-fit: contain; display: block; }
.header-right { display: flex; align-items: center; }

/* ── LAYOUT PRINCIPAL ────────────────────────────────────────────────────── */
/* No wizard a barra é FIXA, não no fluxo como nas demais telas: o .app-layout
   abaixo é position:fixed e se desloca por --header-h. Com a barra no fluxo,
   os dois somavam e sobrava um buraco do tamanho dela no topo. */
body.v2 #app-header { position: fixed; top: 0; left: 0; right: 0; z-index: 100; }

.app-layout {
  display: flex;
  position: fixed;
  top: var(--header-h);
  bottom: var(--footer-h);
  left: 0; right: var(--kpi-w);
  overflow: hidden;
}

/* ── SIDEBAR ─────────────────────────────────────────────────────────────── */
.sidebar {
  width: var(--sidebar-w);
  flex-shrink: 0;
  background: var(--rdc-fundo-website);
  border-right: 1px solid var(--rdc-border);
  /* A sidebar inteira NÃO rola mais. Com os 10 módulos, o rodapé (perfil,
     configurações, sair) caía abaixo da dobra em telas de altura comum e o
     usuário concluía que não tinha permissão — o "Sair" também sumia.
     Agora só .nav-scroll rola; .nav-rodape fica sempre visível. */
  overflow: hidden;
  padding: 1rem .75rem;
  display: flex; flex-direction: column; gap: .35rem;
}

/* Lista de módulos — ocupa o espaço livre e rola sozinha. min-height:0 é
   obrigatório: sem ele um filho flex não encolhe abaixo do conteúdo e a
   rolagem nunca acontece. */
.nav-scroll {
  flex: 1 1 auto; min-height: 0; overflow-y: auto;
  display: flex; flex-direction: column; gap: .35rem;
  margin: 0 -.25rem; padding: 0 .25rem;
}
.nav-scroll::-webkit-scrollbar { width: 4px; }
.nav-scroll::-webkit-scrollbar-track { background: transparent; }
.nav-scroll::-webkit-scrollbar-thumb { background: rgba(var(--wash-rgb),.12); border-radius: 2px; }
.nav-scroll::-webkit-scrollbar-thumb:hover { background: rgba(var(--wash-rgb),.25); }

.sidebar::-webkit-scrollbar { width: 4px; }
.sidebar::-webkit-scrollbar-track { background: transparent; }
.sidebar::-webkit-scrollbar-thumb { background: rgba(var(--wash-rgb),.12); border-radius: 2px; }
.sidebar::-webkit-scrollbar-thumb:hover { background: rgba(var(--wash-rgb),.25); }
.sidebar-title {
  font-size: .62rem; font-weight: 700; color: var(--rdc-text-muted);
  text-transform: uppercase; letter-spacing: 1px;
  padding: .4rem .5rem .75rem;
  border-bottom: 1px solid var(--rdc-border); margin-bottom: .35rem;
}
.nav-item {
  display: flex; align-items: center; gap: .7rem;
  padding: .6rem .75rem;
  border-radius: var(--r-sm);
  cursor: pointer;
  transition: background .15s, border-color .15s;
  border: 1px solid transparent;
  position: relative;
}
.nav-item.active {
  background: rgba(255,107,53,.12);
  border-color: rgba(255,107,53,.3);
}
.nav-item.active .nav-num { background: var(--rdc-orange); color: var(--rdc-text-pure); }
.nav-item.active .nav-label { color: var(--rdc-orange-txt); font-weight: 700; }
.nav-item.active .nav-lock { display: none; }
.nav-item.pending {
  opacity: .45; cursor: not-allowed;
}
.nav-item.done .nav-num { background: rgba(26,127,60,.25); color: var(--status-ok); border-color: var(--rdc-green); }
.nav-item.done .nav-label { color: var(--rdc-text-light); }
.nav-item:not(.active):not(.pending):hover {
  background: rgba(var(--wash-rgb),.04);
  border-color: var(--rdc-border);
}
.nav-num {
  width: 24px; height: 24px; border-radius: 50%; flex-shrink: 0;
  background: rgba(var(--wash-rgb),.06);
  border: 1.5px solid var(--rdc-border);
  display: flex; align-items: center; justify-content: center;
  font-size: .62rem; font-weight: 800; color: var(--rdc-text-muted);
}
.nav-label {
  font-size: .72rem; font-weight: 600; color: var(--rdc-text-muted);
  line-height: 1.3; flex: 1;
}
.nav-sub {
  font-size: .6rem; color: var(--rdc-text-muted); opacity: .7; display: block; margin-top: 1px;
}
.nav-lock { display: flex; color: var(--rdc-text-muted); opacity: .6; }
.nav-check { display: flex; color: var(--status-ok); }

/* ── CONTENT AREA ────────────────────────────────────────────────────────── */
.content-area {
  flex: 1; overflow-y: auto;
  padding: var(--sp-2) var(--sp-3);
  background: var(--rdc-bg-deep);
}

/* ── MÓDULO HEADER ───────────────────────────────────────────────────────── */
.modulo-header {
  display: flex; align-items: flex-start; gap: 1rem;
  padding-bottom: 1rem; border-bottom: 1px solid var(--rdc-border); margin-bottom: 1.5rem;
}
.modulo-num-badge {
  width: 44px; height: 44px; border-radius: 50%; flex-shrink: 0;
  background: rgba(255,107,53,.15); border: 2px solid var(--rdc-orange);
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem; font-weight: 900; color: var(--rdc-orange-txt);
}
.modulo-title-wrap h2 {
  font-size: 1.15rem; font-weight: 800; color: var(--rdc-text-pure); letter-spacing: .2px;
}
.modulo-title-wrap p {
  font-size: .72rem; color: var(--rdc-text-muted); margin-top: .2rem; line-height: 1.5;
}

/* ── SEÇÕES DO FORMULÁRIO ────────────────────────────────────────────────── */
.secao {
  background: var(--rdc-bg-card);
  border: 1px solid var(--rdc-border);
  border-radius: var(--r);
  margin-bottom: var(--sp-2);
  overflow: hidden;
}
.secao-header {
  display: flex; align-items: center; gap: var(--sp-1);
  padding: var(--sp-1) var(--sp-2);
  background: rgba(var(--wash-rgb),.03);
  border-bottom: 1px solid var(--rdc-border);
  border-left: 3px solid var(--rdc-orange);
}
.secao-letra {
  width: 22px; height: 22px; border-radius: 4px;
  background: rgba(255,107,53,.2); border: 1px solid rgba(255,107,53,.4);
  display: flex; align-items: center; justify-content: center;
  font-size: .65rem; font-weight: 800; color: var(--rdc-orange-txt);
}
.secao-header h3 { font-size: .82rem; font-weight: 700; color: var(--rdc-text-pure); }
.secao-header span { font-size: .68rem; color: var(--rdc-text-muted); margin-left: auto; }
/* Glifo monocromático + cor via token (SRS-UI-FORM-VISUAL-STANDARD-001 item
   4.3/4.4) — emoji colorido (✅/⚠️) não aceita `color` por CSS, então o estado
   "pendência" e "completo" tinha a cor fixa do emoji do SO/navegador em vez do
   verde/amarelo do resto do sistema. Glifo vem de shared/secao-status.js. */
.secao-header .secao-status { margin-left: 0; font-size: .8rem; line-height: 1; font-weight: 900; display: inline-flex; align-items: center; }
.secao-status--ok       { color: var(--status-ok); }
.secao-status--pendente { color: var(--status-warn); }
/* ── DUAS COLUNAS COMO PADRAO DE BLOCO ───────────────────────────────────────
   Decisao do PO: todo bloco de M1 e M2 tem duas colunas. Antes o numero variava
   por bloco (1, 2 ou 3) e, pior, variava por ACIDENTE:

   existia regra `.grid-2` solta (linha ~1259) e `.grid-4` solta, mas NENHUMA
   `.grid-3` solta — a de 3 colunas so existia como `.secao-body.grid-3`. Entao
   um `<div class="med-bloco-body grid-3">`, que nao e .secao-body, nao casava
   regra nenhuma e caia em bloco: UMA coluna. Era o caso do "Termometro Digital
   Calibrado" (M2/A) ao lado do "Medidor de Vazao" com grid-2 em duas colunas,
   na mesma secao.

   Agora as classes grid-1..4 sobrevivem por compatibilidade com o markup
   existente, mas TODAS resolvem para duas colunas. Nao ha mais como um bloco
   sair diferente por esquecer uma regra. */
.secao-body { padding: var(--sp-2); display: grid; gap: var(--sp-1); grid-template-columns: 1fr 1fr; }
.secao-body.grid-1,
.secao-body.grid-2,
.secao-body.grid-3,
.secao-body.grid-4 { grid-template-columns: 1fr 1fr; }

/* Filho que nao e campo ocupa a linha inteira: titulo de subsecao, aviso, banner,
   sub-bloco com layout proprio (.med-bloco, .agua-bloco, .acess-grupo...). Sem
   isto o sub-bloco cairia numa das metades e quebraria a propria grade interna. */
.secao-body > *:not(.fg) { grid-column: 1 / -1; }

@media(max-width:900px) {
  .secao-body,
  .secao-body.grid-1,
  .secao-body.grid-2,
  .secao-body.grid-3,
  .secao-body.grid-4 { grid-template-columns: 1fr; }
}
/* Campo que ficaria sozinho no fim da linha — marcado por
   shared/secao-status.js::ajustarUltimoCampo(). Existe como classe, e nao como
   style inline, para a regra continuar visivel no CSS e sobrevivel a inspecao. */
.fg-preenche-linha { grid-column: 1 / -1; }

/* Com duas colunas, "span 2" e "span 3" significam a mesma coisa: a linha toda. */
.span-2 { grid-column: 1 / -1; }
.span-3 { grid-column: 1 / -1; }
.span-3 { grid-column: span 3; }
.span-4 { grid-column: span 4; }

/* ── FIELD GROUPS ────────────────────────────────────────────────────────── */
.fg { display: flex; flex-direction: column; gap: .32rem; }
.fg label {
  font-size: .65rem; font-weight: 700; color: var(--rdc-text-muted);
  text-transform: uppercase; letter-spacing: .7px;
}
.fg label .obrigatorio { color: var(--rdc-orange-txt); margin-left: 2px; }
.fg input[type=text],
.fg input[type=number],
.fg input[type=date],
/* type=time faltava aqui e so aqui. Sem entrar nesta lista o campo nao recebe
   o padding de 9px 11px nem o font-size, e cai no padding nativo do navegador
   (~1px): "Hora Inicio" e "Hora Fim" ficavam visivelmente mais baixos que os
   vizinhos na secao H. O bloco 12.2 de styles-ui.css ja incluia type=time,
   mas ele so pinta cor/borda/fonte — a geometria mora nesta regra. */
.fg input[type=time],
.fg input[type=email],
.fg input[type=password],
.fg input[type=tel],
.fg select,
.fg textarea {
  width: 100%; padding: 9px 11px;
  border: 1px solid rgba(var(--wash-rgb),.1);
  border-radius: var(--r-sm);
  font-size: .82rem; color: var(--campo-txt);
  background: var(--rdc-bg-input);
  font-family: inherit;
  transition: border-color .2s, box-shadow .2s;
  appearance: none;
}
/* Altura igual entre os tipos de campo.
   date e time trazem widget nativo (editor de partes + icone de
   calendario/relogio) cuja caixa de conteudo e mais alta que uma linha de
   texto. Medido no Chrome, com o MESMO padding de 9px: text/number/select
   rendem 37px, date 39px e time 42px — os tres na mesma grade, visivelmente
   desalinhados, e o time era o mais gritante.
   37px = 17px de linha (13.12px de fonte) + 18px de padding + 2px de borda,
   ou seja, e a altura que os demais campos ja produzem sozinhos; aqui ela e
   imposta a date/time porque o widget nativo nao a alcanca por conta propria.
   Se o padding ou o font-size da regra acima mudar, este numero muda junto.
   select entrou na mesma normalizacao: media 35px, 2px abaixo dos inputs em
   TODO o formulario — diferenca discreta, mas desalinha qualquer linha que
   misture select e input, que e a maioria das linhas do M1. */
.fg input[type=date],
.fg input[type=time],
.fg select {
  box-sizing: border-box;
  height: 37px;
}
.fg input[type=date]::-webkit-datetime-edit,
.fg input[type=time]::-webkit-datetime-edit { padding: 0; }

.fg input:focus, .fg select:focus, .fg textarea:focus {
  outline: none;
  border-color: var(--rdc-orange);
  box-shadow: 0 0 0 3px rgba(255,107,53,.15);
}
/* Campo preenchido pelo navegador: o Chrome o pinta com a própria folha, em
   !important, e `background`/`color` da página não vencem — ficava azul-claro
   no tema escuro e cinza com texto branco no shell da auditoria, destoando
   dos campos vizinhos. A sombra interna cobre o fundo nativo com o do tema. */
.fg input:-webkit-autofill,
.fg input:-webkit-autofill:hover,
.fg input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--campo-txt);
  caret-color: var(--campo-txt);
  box-shadow: 0 0 0 1000px var(--rdc-bg-input) inset;
  transition: background-color 99999s ease-out 0s;
}
.fg input.erro, .fg select.erro { border-color: var(--rdc-red); }
/* Duas correções que se encontraram no merge, e as duas valem:
   — sem escopo a `.fg` (f2a57f9): `.hint` também aparece fora de campo, como em
     m2-diagnostico/view.js `.tem-analisador-row`. Escopada, esses casos caíam no
     tamanho de parágrafo em vez de legenda.
   — `.fg-hint` junto: a view do M2 usa essa classe nas 7 dicas do Bloco U, e o
     CSS não tinha regra nenhuma para ela — as 7 herdavam 1rem do body e saíam a
     16px numa tela onde todo o resto de texto auxiliar está a 9,92px.
   Ficam na MESMA declaração de propósito: separá-las de novo é o caminho para
   qualquer um dos dois bugs voltar. */
.hint,
.fg-hint { font-size: .62rem; color: var(--rdc-text-muted); margin-top: .15rem; }
.fg .erro-msg { font-size: .62rem; color: var(--status-danger); margin-top: .15rem; display: none; }

/* ── INFO TOOLTIP — Notas Orientativas Normativas ──────────────────────── */
.info-tooltip-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 15px; height: 15px;
  font-size: .65rem; font-weight: 800; font-style: normal;
  color: var(--rdc-orange-br-txt);
  cursor: pointer; margin-left: 5px; vertical-align: middle;
  border-radius: 50%;
  transition: color .15s, transform .15s;
  outline: none; user-select: none; -webkit-user-select: none;
  position: relative; top: -1px;
}
.info-tooltip-icon:hover,
.info-tooltip-icon:focus { color: var(--rdc-orange-txt); transform: scale(1.2); }
.info-tooltip-popover {
  position: fixed; z-index: 9999;
  max-width: 320px; min-width: 200px;
  background: #002F5B;
  border: 1.5px solid rgba(242,90,10,.45);
  border-radius: 8px;
  padding: .55rem .75rem;
  box-shadow: 0 6px 24px rgba(0,0,0,.55), 0 0 0 1px rgba(0,47,91,.6); /* sombra — mesma excecao da linha 194 */
  pointer-events: auto;
  opacity: 0; visibility: hidden;
  transition: opacity .18s ease, visibility .18s ease, transform .18s ease;
  transform: translateY(4px);
  display: flex; flex-direction: column; gap: .3rem;
}
.info-tooltip-popover.visible {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.itp-norma-badge {
  display: inline-block;
  font-size: .58rem; font-weight: 800; letter-spacing: .5px;
  color: #F25A0A;
  background: rgba(242,90,10,.12);
  border: 1px solid rgba(242,90,10,.3);
  border-radius: 4px;
  padding: .1rem .45rem;
  text-transform: uppercase;
  align-self: flex-start;
}
.itp-texto {
  font-size: .72rem; font-weight: 500;
  color: #FFFFFF;
  line-height: 1.45;
}
.fg.com-erro .erro-msg { display: block; }
.fg.com-erro input, .fg.com-erro select { border-color: var(--status-danger); }
/* B8: valor padrão do sistema, ainda não confirmado pelo auditor. Tracejado
   e não vermelho: não é erro — é um número que ninguém mediu, e que o laudo
   vai imprimir como "estimado". Some quando o auditor mexe no campo. */
.fg.campo-padrao input, .fg.campo-padrao select, .fg.campo-padrao .sbtn.active { border-style: dashed; border-color: var(--status-warn); }
.fg.campo-padrao > label::after { content: ' · padrão do sistema — confirme'; color: var(--status-warn); font-weight: 400; text-transform: none; letter-spacing: 0; }
.fg select option { background: var(--rdc-bg-input); }
.fg .unidade {
  position: relative;
}
.fg .unidade input { padding-right: 3.5rem; }
.fg .unidade-badge {
  position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  font-size: .65rem; font-weight: 700; color: var(--rdc-cyan-txt);
  background: rgba(0,210,255,.08); padding: .1rem .4rem;
  border-radius: 4px; border: 1px solid rgba(0,210,255,.2); pointer-events: none;
}

/* ── TOGGLE BUTTONS (sbtn) ───────────────────────────────────────────────── */
.sbtn-group { display: flex; gap: .3rem; flex-wrap: wrap; }
.sbtn {
  padding: .35rem .8rem;
  border: 1.5px solid rgba(var(--wash-rgb),.1);
  border-radius: 20px; font-size: .72rem; font-weight: 600;
  cursor: pointer; background: var(--rdc-bg-input);
  color: var(--rdc-text-muted); transition: all .15s; font-family: inherit;
}
.sbtn.active {
  background: rgba(255,107,53,.12); color: var(--rdc-orange-txt);
  border-color: var(--rdc-orange); box-shadow: 0 0 10px rgba(255,107,53,.2);
}
.sbtn:hover:not(.active) { border-color: rgba(255,107,53,.4); color: var(--rdc-text-light); }

/* ── COMBUSTÍVEL DINÂMICO ────────────────────────────────────────────────── */
.comb-fields { transition: opacity .25s; }
.comb-fields.hidden { display: none; }
.pci-calc-box {
  background: rgba(0,210,255,.05); border: 1px solid rgba(0,210,255,.2);
  border-radius: var(--r-sm); padding: .6rem .9rem;
  display: flex; align-items: center; justify-content: space-between;
}
.pci-calc-box .pci-label { font-size: .7rem; color: var(--rdc-text-muted); }
.pci-calc-box .pci-val   { font-size: .95rem; font-weight: 800; color: var(--rdc-cyan-txt); }

/* ── ART / ENG. RESPONSÁVEL ─────────────────────────────────────────────── */
.art-label-title { color: var(--rdc-orange-txt); font-weight: 800; font-size: .82rem; }
.art-label-sub   { color: var(--rdc-text-muted); font-size: .72rem; }
.art-aviso {
  display: block; margin-top: .3rem;
  font-size: .7rem; font-weight: 700; color: var(--status-danger);
  background: rgba(239,68,68,.08); border: 1px solid rgba(239,68,68,.25);
  border-radius: 4px; padding: .25rem .55rem;
}

/* ── VAPOR SATURADO — IAPWS-IF97 ────────────────────────────────────────── */
.secao-vapor {
  background: var(--rdc-bg-card);
  border: 1px solid rgba(255,107,53,.25);
  border-radius: var(--r);
  overflow: hidden;
  margin-bottom: 1rem;
}
.secao-vapor.vapor-sem-pressao { opacity: .45; pointer-events: none; }
.vapor-header {
  display: flex; align-items: center; gap: .75rem;
  background: rgba(255,107,53,.1); border-bottom: 1px solid rgba(255,107,53,.2);
  padding: .6rem 1.1rem;
}
.vapor-icon  { font-size: 1.1rem; }
.vapor-title { font-size: .78rem; font-weight: 800; letter-spacing: .06em; color: var(--rdc-text-pure); text-transform: uppercase; }
.vapor-norm  { font-size: .65rem; color: var(--rdc-orange-txt); font-weight: 700; margin-left: auto; letter-spacing: .04em; }
.vapor-cards {
  display: flex; gap: .75rem; padding: 1rem 1.1rem;
  overflow-x: auto;
}
.vapor-card {
  flex: 1; min-width: 120px;
  background: var(--rdc-orange); border-radius: var(--r-sm);
  padding: .85rem .75rem;
  display: flex; flex-direction: column; align-items: center; gap: .15rem;
  position: relative;
}
.vapor-val  {
  font-size: 1.4rem; font-weight: 900; color: var(--rdc-text-pure);
  line-height: 1.1; letter-spacing: -.02em;
}
.vapor-unit { font-size: .62rem; color: rgba(var(--wash-rgb),.75); font-weight: 600; }
.vapor-badge {
  position: absolute; top: .5rem; right: .6rem;
  font-size: .65rem; font-weight: 700; color: rgba(var(--wash-rgb),.65);
}
.vapor-badge sub { font-size: .5rem; }
.vapor-label {
  font-size: .65rem; color: rgba(var(--wash-rgb),.7);
  margin-top: auto; font-weight: 600; white-space: nowrap;
}
.vapor-footer {
  padding: .5rem 1.1rem;
  font-size: .68rem; color: var(--rdc-text-muted);
  border-top: 1px solid var(--rdc-border); text-align: right;
}
.vapor-footer strong { color: var(--rdc-orange-txt); }

/* ── COMBUSTÍVEL — SELETOR POR CATEGORIAS ────────────────────────────────── */
.comb-cat-selector { display: flex; flex-direction: column; gap: .55rem; }
.comb-cat-row { display: flex; align-items: flex-start; gap: .75rem; flex-wrap: wrap; }
.comb-cat-label {
  font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .6px;
  color: var(--rdc-text-muted); min-width: 110px; padding-top: .45rem; white-space: nowrap;
}

/* ── EQUIPAMENTOS AUXILIARES ─────────────────────────────────────────────── */
.eqip-lista { display: flex; flex-direction: column; gap: .5rem; margin-bottom: 1rem; }
.eqip-item  { display: flex; align-items: flex-start; gap: .75rem; cursor: pointer; }
.eqip-check { margin-top: .25rem; accent-color: var(--rdc-orange); width: 16px; height: 16px; flex-shrink: 0; }
.eqip-check-label { display: flex; align-items: baseline; gap: .55rem; flex-wrap: wrap; line-height: 1.5; }
.eqip-nome  { font-size: .85rem; font-weight: 700; color: var(--rdc-text-pure); }
.eqip-ganho {
  font-size: .78rem; font-weight: 800; color: var(--status-ok);
  background: rgba(61,216,142,.12); border: 1px solid rgba(61,216,142,.25);
  border-radius: 4px; padding: .1rem .4rem;
}
.eqip-desc  { font-size: .72rem; color: var(--rdc-text-muted); width: 100%; }
.eqip-total-bar {
  display: flex; align-items: center; gap: .75rem; flex-wrap: wrap;
  background: rgba(0,210,255,.04); border: 1px solid rgba(0,210,255,.15);
  border-radius: var(--r-sm); padding: .7rem 1rem;
}
.eqip-title { font-size: .72rem; color: var(--rdc-text-muted); }
.eqip-ganho-val {
  font-size: 1rem; font-weight: 800; color: var(--status-ok);
  background: rgba(61,216,142,.1); border-radius: 4px; padding: .1rem .5rem;
}
.eqip-nota  { font-size: .72rem; color: var(--rdc-text-muted); margin-left: auto; }
.en-acess-val {
  font-size: 1rem; font-weight: 800; color: var(--rdc-cyan-txt);
  background: rgba(0,210,255,.08); border-radius: 4px; padding: .1rem .5rem;
}

/* ── RESUMO INLINE ───────────────────────────────────────────────────────── */
.resumo-box {
  background: rgba(0,210,255,.04); border: 1px solid rgba(0,210,255,.15);
  border-radius: var(--r); padding: .85rem 1.1rem;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(160px,1fr)); gap: .6rem;
}
.resumo-item { display: flex; flex-direction: column; gap: .2rem; }
.resumo-item .r-label { font-size: .6rem; color: var(--rdc-text-muted); text-transform: uppercase; letter-spacing: .5px; }
.resumo-item .r-val   { font-size: .88rem; font-weight: 700; color: var(--rdc-text-pure); }

/* ── FOOTER NAV ──────────────────────────────────────────────────────────── */
.footer-nav {
  position: fixed; bottom: 0; left: 0; right: 0;
  height: var(--footer-h);
  background: var(--rdc-fundo-website); border-top: 1px solid var(--rdc-border);
  display: flex; align-items: center; justify-content: space-between; padding: 0 1.5rem;
  z-index: 100;
}
.footer-modname { font-size: .75rem; font-weight: 700; color: var(--rdc-text-muted); }
.btn-nav {
  padding: .5rem 1.4rem; border-radius: 6px;
  font-size: .78rem; font-weight: 700; cursor: pointer;
  font-family: inherit; border: none; transition: all .15s;
}
.btn-anterior {
  background: var(--rdc-bg-card); color: var(--rdc-text-muted);
  border: 1px solid var(--rdc-border);
}
.btn-anterior:not(:disabled):hover { border-color: var(--rdc-orange); color: var(--rdc-orange-txt); }
.btn-anterior:disabled { opacity: .35; cursor: not-allowed; }
.btn-proximo {
  background: var(--rdc-orange); color: var(--rdc-text-pure);
  box-shadow: 0 0 14px rgba(255,107,53,.35);
}
.btn-proximo:hover { filter: brightness(.88); box-shadow: 0 0 20px rgba(255,107,53,.5); }

/* ── TOAST ───────────────────────────────────────────────────────────────── */
.toast {
  position: fixed; bottom: 72px; left: 50%; transform: translateX(-50%);
  background: var(--rdc-bg-card); color: var(--rdc-text-pure);
  padding: .6rem 1.4rem; border-radius: 6px; font-size: .8rem; font-weight: 600;
  border: 1px solid var(--rdc-border); pointer-events: none;
  opacity: 0; transition: opacity .3s; z-index: 200;
  box-shadow: var(--sh-md); white-space: nowrap;
  display: flex; align-items: center; gap: .5rem;
}
.toast.show { opacity: 1; pointer-events: auto; }
.toast-close {
  background: transparent; border: none; cursor: pointer;
  color: inherit; font-size: .85rem; line-height: 1;
  padding: 0 .15rem; opacity: .65; font-family: inherit;
}
.toast-close:hover { opacity: 1; }
.toast.toast-ok    { border-color: var(--rdc-green); background: rgba(26,127,60,.15); }
.toast.toast-erro  { border-color: var(--rdc-red); background: rgba(198,40,40,.15); }
.toast.toast-aviso { border-color: var(--rdc-orange); background: rgba(255,107,53,.12); }
/* Ícone do toast pelo TIPO, não pela mensagem (PO, 24/09). Havia seis
   funções de toast espalhadas (renderer, app, M1, M2, M5, M9) e cada mensagem
   trazia o próprio emoji — ✅, ⚠️, 💾, 🔩, 🗑️ —, então o mesmo "salvo" saía
   com desenhos diferentes. Pelo CSS, as seis ganham o ícone sem mexer em
   nenhuma delas. Os traços repetem ok/atencao/bloqueado de shared/icones.js;
   mudando lá, mude aqui. */
.toast.toast-ok::before, .toast.toast-erro::before, .toast.toast-error::before,
.toast.toast-aviso::before, .toast.toast-alerta::before, .toast.toast-info::before {
  content: ""; flex: none; width: 16px; height: 16px; background: currentColor;
  -webkit-mask: var(--toast-ic) center / contain no-repeat; mask: var(--toast-ic) center / contain no-repeat;
}
.toast.toast-ok    { --toast-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
.toast.toast-erro, .toast.toast-error { --toast-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E"); }
.toast.toast-aviso, .toast.toast-alerta { --toast-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4l9 16H3z'/%3E%3Cpath d='M12 10v4M12 17v.5'/%3E%3C/svg%3E"); }
.toast.toast-info  { --toast-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5M12 8v.5'/%3E%3C/svg%3E"); }
.toast.toast-error { border-color: var(--rdc-red); background: rgba(198,40,40,.15); }
.toast.toast-alerta { border-color: var(--rdc-orange); background: rgba(255,107,53,.12); }

/* ── MODO FOCO — sidebar recolhida, KPI oculto, content expandido ───────── */
body.modo-foco .sidebar {
  width: var(--sidebar-collapsed-w);
  overflow: hidden;
  transition: width .25s ease;
}
body.modo-foco .sidebar .sidebar-title,
body.modo-foco .sidebar .nav-label,
body.modo-foco .sidebar .nav-sub,
body.modo-foco .sidebar .nav-lock,
body.modo-foco .sidebar .nav-check,
body.modo-foco .sidebar .nav-item { justify-content: center; padding: .6rem .5rem; }
body.modo-foco .sidebar .nav-num  { margin: 0; }
body:not(.modo-foco) .sidebar { transition: width .25s ease; }

body.modo-foco .kpi-panel-global {
  width: 0; overflow: hidden; padding: 0; border: none;
  transition: width .25s ease;
}
body.modo-foco .app-layout { right: 0; }
body.modo-foco .content-area { padding: var(--sp-2) var(--sp-6); }

/* ── CARD DE DESTAQUE TÉCNICO — Engineering KPI highlight ───────────────── */
.kpi-destaque {
  border: 1px solid var(--rdc-border);
  border-left: 4px solid var(--rdc-orange);
  border-radius: var(--r);
  background: var(--rdc-bg-card);
  padding: var(--sp-2);
  display: flex; flex-direction: column; gap: var(--sp-1);
}
.kpi-destaque.status-ok     { border-left-color: var(--status-ok); }
.kpi-destaque.status-warn   { border-left-color: var(--status-warn); }
.kpi-destaque.status-danger { border-left-color: var(--status-danger); }
.kpi-destaque-label {
  font-size: .62rem; font-weight: 700; color: var(--rdc-text-muted);
  text-transform: uppercase; letter-spacing: .8px;
}
.kpi-destaque-value {
  font-size: 2rem; font-weight: 900; line-height: 1;
  color: var(--rdc-orange-txt);
}
.kpi-destaque.status-ok     .kpi-destaque-value { color: var(--status-ok); }
.kpi-destaque.status-warn   .kpi-destaque-value { color: var(--status-warn); }
.kpi-destaque.status-danger .kpi-destaque-value { color: var(--status-danger); }
.kpi-destaque-sub {
  font-size: .65rem; color: var(--rdc-text-muted); line-height: 1.4;
}
.kpi-destaque-ref {
  font-size: .6rem; color: var(--rdc-text-muted);
  border-top: 1px solid var(--rdc-border); padding-top: var(--sp-1);
  font-style: italic;
}

/* ── ÍCONES DE CONTEÚDO (shared/icones.js) ───────────────────────────────
   Alinhados ao texto por padrão; quem precisa de flex já tem o próprio. */
.ic { display: inline-block; flex-shrink: 0; vertical-align: -0.18em; }
[data-icone] { display: inline-flex; align-items: center; }
/* Ícone em título de bloco é laranja (identifica); em status, a cor vem do
   estado. Mesma regra da barra do topo. */
.secao-header h3 > .ic, .secao-banner-txt > .ic, .section-wood-title > .ic,
.card-warning-title > .ic, .rp-card-tit > .ic, .m5-card-header > .ic,
.orvalho-hdr > .ic, .med-bloco-hdr > .ic, .conama-hdr > .ic, .perdas-sub-hdr > .ic,
.co2-ref-hdr > .ic, .insp-bloco-hdr > .ic, .insp-modelo3-hdr > .ic,
.secao-sub-title > .ic, .m5-benchmark-box .ic { color: var(--rdc-orange-txt); }
.secao-letra > .ic { display: block; }
.rel-icone > .ic { color: var(--rdc-orange-txt); }
.val-ok > .ic, .cert-ok > .ic, .rel-secao-item > .ic, .bndes-titulo > .ic,
.insp-anomalia-ok > .ic { color: var(--status-ok); }
.val-erro > .ic { color: var(--status-danger); }
.end-aviso > .ic, .insp-purga-penal > .ic { color: var(--status-warn); }

/* ── ÍCONE NAV (SVG inline) ──────────────────────────────────────────────── */
.nav-icon { width: 18px; height: 18px; flex-shrink: 0; color: currentColor; opacity: .7; }
.nav-item.active .nav-icon { opacity: 1; }

/* ── EM BREVE (stub) ─────────────────────────────────────────────────────── */
.em-breve-wrap {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  height: 60%; gap: 1rem; text-align: center; opacity: .5;
}
.em-breve-wrap .eb-icone { display: flex; color: var(--rdc-text-muted); }
.em-breve-wrap h3 { font-size: 1.1rem; font-weight: 800; color: var(--rdc-text-pure); }
.em-breve-wrap p  { font-size: .8rem; color: var(--rdc-text-muted); max-width: 360px; }

/* ── MÓDULO 9 — RELATÓRIOS ──────────────────────────────────────────────── */
.relatorio-card {
  background: var(--rdc-bg-card);
  border: 1px solid var(--rdc-border);
  border-radius: var(--r);
  padding: 2rem 1.5rem;
  display: flex; flex-direction: column; gap: 1rem;
  transition: border-color .2s, box-shadow .2s;
}
.relatorio-card:hover {
  border-color: var(--rdc-cyan);
  box-shadow: 0 0 20px rgba(0,210,255,.08);
}
.relatorio-card .rel-icone { font-size: 2.4rem; }
.relatorio-card h3 { font-size: 1rem; font-weight: 800; color: var(--rdc-text-pure); }
.relatorio-card p  { font-size: .78rem; color: var(--rdc-text-muted); line-height: 1.6; flex: 1; }
.rel-acoes { display: flex; gap: .6rem; flex-wrap: wrap; }
.btn-rel {
  padding: .45rem 1rem; border: none; border-radius: var(--r-sm);
  background: var(--rdc-orange); color: var(--rdc-text-pure); font-size: .78rem; font-weight: 700;
  cursor: pointer; transition: opacity .15s;
}
.btn-rel:hover { opacity: .85; }
.btn-rel.btn-sec { background: var(--rdc-bg-input); border: 1px solid var(--rdc-border); color: var(--rdc-text-light); }
.btn-rel.btn-sec:hover { border-color: var(--rdc-cyan); color: var(--rdc-cyan-txt); }
.toast.toast-info { border-color: var(--rdc-cyan); background: rgba(0,210,255,.1); }

/* ── UMIDADE — PRESET SELECT + ORIGEM ───────────────────────────────────── */
.umidade-row {
  display: flex; gap: .5rem; align-items: stretch;
}
.umid-preset {
  flex: 1;
  background: var(--rdc-bg-input); color: var(--rdc-text-light);
  border: 1px solid var(--rdc-border); border-radius: var(--r-sm);
  font-size: .75rem; padding: .4rem .5rem; cursor: pointer;
}
.umid-preset:focus { outline: none; border-color: var(--rdc-orange); }
.umid-num-wrap { width: 110px; flex-shrink: 0; }
.origem-row {
  display: flex; align-items: center; gap: .45rem; margin-top: .45rem;
  flex-wrap: wrap;
}
.origem-label {
  font-size: .65rem; font-weight: 800; color: var(--rdc-orange-txt);
  letter-spacing: .07em; white-space: nowrap;
}
.origem-btn {
  font-size: .62rem !important; padding: .2rem .55rem !important;
  line-height: 1.4;
}

/* ── SEÇÃO F — REGISTRO FOTOGRÁFICO ─────────────────────────────────────── */
.secao-fotos { }
.foto-bloco { margin-bottom: 1.25rem; }
.foto-bloco-header {
  background: rgba(var(--wash-rgb),.04);
  border-left: 3px solid var(--rdc-orange);
  padding: .45rem .8rem;
  font-size: .72rem; font-weight: 700; letter-spacing: .06em;
  color: var(--rdc-text-pure);
  margin-bottom: .75rem;
}
.foto-header-aviso {
  border-left-color: var(--status-warn); color: var(--status-warn);
  background: rgba(245,158,11,.05);
}
.foto-bloco-body { padding: 0 .1rem; }
.foto-grid-3 {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem;
}
.foto-grid-2 {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
}
.foto-card {
  border: 1px solid rgba(var(--wash-rgb),.08); border-radius: var(--r-sm);
  overflow: hidden;
}
.foto-card-placa { max-width: 340px; }
.foto-card-header {
  background: var(--rdc-orange); color: var(--rdc-text-pure);
  font-size: .62rem; font-weight: 800; letter-spacing: .07em;
  padding: .3rem .6rem;
}
.foto-card-header-prob {
  background: rgba(245,158,11,.12);
  border-bottom: 1px solid rgba(245,158,11,.3);
  color: var(--status-warn);
  font-size: .62rem; font-weight: 800; letter-spacing: .07em;
  padding: .3rem .6rem;
}
.foto-preview-area {
  background: rgba(var(--recesso-rgb),.25); min-height: 90px;
  display: flex; align-items: center; justify-content: center;
  background-size: cover; background-position: center;
  position: relative; transition: background-image .2s;
}
.foto-preview-area.has-photo .foto-pick-btn { opacity: .6; }
.foto-pick-btn {
  display: inline-flex; align-items: center; gap: .35rem;
  background: rgba(var(--wash-rgb),.07); border: 1px solid rgba(var(--wash-rgb),.14);
  color: var(--rdc-text-light); font-size: .68rem; font-weight: 700;
  letter-spacing: .05em; padding: .38rem .75rem; border-radius: 4px;
  cursor: pointer; transition: background .15s; user-select: none;
}
.foto-pick-btn:hover { background: rgba(var(--wash-rgb),.13); }
.foto-input { display: none; }
.foto-hint {
  display: block; font-size: .6rem; color: rgba(var(--wash-rgb),.35);
  padding: .22rem .5rem;
}
.foto-problema-card {
  border: 1px solid rgba(245,158,11,.18); border-radius: var(--r-sm);
  overflow: hidden; display: flex; flex-direction: column;
}
.foto-desc-label, .foto-rec-label {
  display: block; font-size: .62rem; color: rgba(var(--wash-rgb),.45);
  padding: .3rem .5rem .1rem;
}
.foto-desc {
  width: 100%; background: rgba(var(--wash-rgb),.03);
  border: none; border-top: 1px solid rgba(var(--wash-rgb),.06);
  color: var(--rdc-text-light); font-size: .73rem; font-family: inherit;
  padding: .35rem .5rem; resize: vertical; min-height: 58px;
  box-sizing: border-box;
}
.foto-desc:focus { outline: none; background: rgba(var(--wash-rgb),.05); }
.foto-rec {
  width: 100%; background: rgba(var(--wash-rgb),.03);
  border: none; border-top: 1px solid rgba(var(--wash-rgb),.06);
  color: var(--rdc-text-light); font-size: .73rem;
  padding: .38rem .5rem; box-sizing: border-box; cursor: pointer;
}
.foto-rec:focus { outline: none; }

/* ── M2 — CONTEXTO M1 (banner topo) ─────────────────────────────────────── */
.ctx-banner {
  background: rgba(0,210,255,.05);
  border: 1px solid rgba(0,210,255,.18);
  border-radius: var(--r-sm);
  padding: .5rem .85rem;
  margin-bottom: 1.25rem;
  display: flex; align-items: center; gap: .6rem; flex-wrap: wrap;
  font-size: .72rem;
}
.ctx-titulo { color: var(--rdc-cyan-txt); font-weight: 800; white-space: nowrap; }
.ctx-tags   { display: flex; flex-wrap: wrap; gap: .35rem; }
.ctx-tag {
  background: rgba(0,210,255,.1); border: 1px solid rgba(0,210,255,.22);
  color: var(--rdc-text-light); border-radius: 4px;
  padding: .15rem .45rem; font-size: .68rem;
}

/* ── PRESET BAR — Diagnóstico rápido por faixa de degradação ────────────────── */
.preset-bar {
  display: flex; align-items: center; flex-wrap: wrap; gap: .5rem;
  background: rgba(var(--wash-rgb),.03);
  border: 1px solid rgba(var(--wash-rgb),.09);
  border-radius: var(--r-sm);
  padding: .6rem .85rem;
  margin-bottom: 1.1rem;
}
.preset-bar-label {
  font-size: .7rem; font-weight: 700; color: var(--rdc-text-muted);
  white-space: nowrap; text-transform: uppercase; letter-spacing: .05em;
  margin-right: .25rem;
}
.preset-bar-hint {
  font-size: .65rem; color: var(--rdc-text-muted); flex-basis: 100%;
  margin-top: .2rem; opacity: .7;
}
.preset-btn {
  padding: .3rem .75rem; border-radius: 4px; border: 1px solid transparent;
  font-size: .72rem; font-weight: 600; cursor: pointer;
  transition: filter .15s, transform .1s, box-shadow .15s;
  white-space: nowrap;
}
.preset-btn:hover  { filter: brightness(1.2); transform: translateY(-1px); }
.preset-btn:active { transform: translateY(0); }
.preset-btn.ativo  { box-shadow: 0 0 0 2px #fff4; }

.preset-nova      { background: rgba(34,197,94,.12);  border-color: rgba(34,197,94,.4);  color: var(--status-ok); }
.preset-velha     { background: rgba(234,179,8,.12);  border-color: rgba(234,179,8,.4);  color: var(--status-warn); }
.preset-degradada { background: rgba(255,107,53,.12); border-color: rgba(255,107,53,.4); color: var(--rdc-orange-txt); }
.preset-critica   { background: rgba(239,68,68,.12);  border-color: rgba(239,68,68,.4);  color: var(--status-danger); }
.preset-sucateada { background: rgba(198,40,40,.12);  border-color: rgba(198,40,40,.4);  color: var(--rdc-red); }

/* M2 não tem mais .secao/.secao-header/.secao-letra/.secao-body próprios
   (SRS-UI-FORM-VISUAL-STANDARD-001 item 4.2): eram redeclarações sem seletor
   de módulo que venciam por cascata em QUALQUER tela, não só M2 — chegaram a
   ser escopadas com `body.mod-2` num primeiro passo (aplicado ao M1), e agora
   são removidas de vez para M2 usar o mesmo `.secao-letra` (quadrado, 22px,
   laranja translúcido) da linha ~237, igual a todos os outros módulos.
   `.secao-body.grid-3`/`.span-2`/`.span-3` que este bloco redeclarava já são
   cobertas pela regra canônica de 2 colunas da linha ~261. */

/* ── M2 — AVISOS / NOTICES ───────────────────────────────────────────────── */
.instr-aviso, .cinzas-aviso, .incert-aviso {
  background: rgba(0,210,255,.05);
  border-left: 3px solid rgba(0,210,255,.4);
  font-size: .72rem; color: var(--rdc-text-muted);
  padding: .5rem .85rem; margin: 0 1.1rem .85rem;
  line-height: 1.5;
}
.cinzas-aviso { border-left-color: rgba(var(--wash-rgb),.2); }
.cinzas-aviso span { color: var(--rdc-text-muted); }

/* ── M2 — RESULTADO INLINE (caixas pequenas nas seções) ─────────────────── */
.resultado-box-sm {
  background: var(--rdc-bg-input);
  border: 1px solid var(--rdc-border);
  border-radius: var(--r-sm);
  padding: .4rem .65rem;
  min-height: 34px;
  display: flex; flex-direction: column; justify-content: center;
  gap: .15rem;
}
.resultado-val-sm {
  font-size: .9rem; font-weight: 800;
  color: var(--rdc-cyan-txt);
  display: block;
}
.resultado-val {
  font-size: 1.6rem; font-weight: 900; color: var(--rdc-green);
}
.resultado-val.ok     { color: var(--rdc-green); }
.resultado-val.alerta { color: var(--rdc-orange-txt); }
.resultado-val.critico { color: var(--rdc-red); }

/* ── M2 — TEMPERATURA DOS GASES ─────────────────────────────────────────── */
.tgas-input-row {
  display: flex; align-items: stretch; gap: .6rem; margin-bottom: .5rem;
}
.tgas-input-wrap { flex: 1; }
.tgas-display-box {
  background: rgba(0,210,255,.08);
  border: 1px solid rgba(0,210,255,.3);
  border-radius: var(--r-sm);
  padding: .3rem .85rem;
  display: flex; align-items: center; justify-content: center;
  min-width: 110px;
}
.tgas-val-grande {
  font-size: 1.6rem; font-weight: 900; color: var(--rdc-cyan-txt); white-space: nowrap;
}
.tgas-barra-wrap { margin: .35rem 0; }
.tgas-barra-track {
  height: 6px; background: rgba(var(--wash-rgb),.08);
  border-radius: 3px; overflow: hidden;
}
.tgas-barra-fill {
  height: 100%; width: 0%; background: var(--rdc-orange);
  transition: width .4s ease, background .4s;
  border-radius: 3px;
}
.tgas-alert {
  font-size: .72rem; padding: .2rem 0;
  color: var(--rdc-text-muted);
}
.tgas-alert.alerta { color: var(--rdc-orange-txt); font-weight: 700; }
.tgas-alert.ok     { color: var(--status-ok); }
.tgas-sat-alerta         { font-size: .72rem; padding: .25rem .5rem; border-radius: 4px; margin: .2rem 0; }
.tgas-sat-alerta.hidden  { display: none; }
.tgas-sat-alerta.visivel { display: block; background: rgba(234,179,8,.12); color: var(--status-warn); font-weight: 600; border-left: 3px solid var(--status-warn); }

/* O₂ zonas de diagnóstico */
.o2-status-badge         { font-size: .68rem; padding: .2rem .45rem; border-radius: 4px; margin: .25rem 0 .15rem; line-height: 1.4; }
.o2-status-badge.hidden  { display: none; }
.o2-status-badge.ok         { background: rgba(34,197,94,.10);  color: var(--status-ok); }
.o2-status-badge.alerta     { background: rgba(234,179,8,.12);  color: var(--status-warn); font-weight: 600; }
.o2-status-badge.infiltracao{ background: rgba(255,107,53,.14); color: var(--rdc-orange-txt); font-weight: 700; }
.o2-status-badge.invalido   { background: rgba(239,68,68,.15);  color: var(--status-danger); font-weight: 800; border-left: 3px solid var(--status-danger); }
.o2-siegert-aviso        { font-size: .66rem; margin-top: .2rem; }
.o2-siegert-aviso.hidden { display: none; }
.o2-siegert-aviso.visivel{ display: block; color: var(--rdc-orange-txt); font-style: italic; }

/* ── M2 — CANAIS DO ANALISADOR ───────────────────────────────────────────── */
.canais-box {
  display: flex; flex-wrap: wrap; gap: .35rem; padding: .4rem 0;
}
.canal-tag {
  background: rgba(0,210,255,.1); border: 1px solid rgba(0,210,255,.25);
  color: var(--rdc-cyan-txt); border-radius: 4px;
  font-size: .68rem; font-weight: 700; padding: .2rem .5rem;
}
.canal-opc { opacity: .55; }

/* ── M2 — FÓRMULAS DISPLAY ───────────────────────────────────────────────── */
.formula-siegert-box, .formula-cinzas-box {
  background: rgba(var(--recesso-rgb),.25);
  border: 1px solid rgba(var(--wash-rgb),.07);
  border-radius: var(--r-sm);
  padding: .6rem .85rem;
  display: flex; flex-direction: column; gap: .3rem;
}
.formula-tex {
  font-size: .78rem; color: var(--rdc-text-light);
  font-family: 'Courier New', monospace;
}
.formula-coefs {
  font-size: .72rem; color: var(--rdc-text-muted);
}
.formula-result {
  font-size: .78rem; color: var(--rdc-text-light);
  border-top: 1px solid rgba(var(--wash-rgb),.06);
  padding-top: .25rem; margin-top: .15rem;
}

/* ── M2 — INCERTEZA EXPANDIDA ────────────────────────────────────────────── */
.incert-outra-txt {
  width: 100%; min-height: 68px; resize: vertical;
  background: var(--rdc-bg-input); border: 1px solid var(--rdc-border);
  border-radius: var(--r-sm); color: var(--rdc-text-light);
  font-family: inherit; font-size: .78rem;
  padding: .45rem .6rem; box-sizing: border-box;
}
.incert-outra-txt:focus { outline: none; border-color: var(--rdc-orange); }
.incert-resultado-row {
  border-top: 1px solid var(--rdc-border);
  padding: .85rem 1.1rem;
}
.incert-u-box {
  background: rgba(0,210,255,.07);
  border: 1px solid rgba(0,210,255,.25);
  border-radius: var(--r-sm);
  padding: .6rem 1rem;
  display: inline-flex; flex-direction: column; gap: .15rem;
}
.incert-u-val {
  font-size: 1.1rem; font-weight: 900; color: var(--rdc-cyan-txt);
}
.incert-u-sub {
  font-size: .62rem; color: var(--rdc-text-muted);
}
.incert-u-mini {
  font-size: .68rem; font-weight: 700;
  color: rgba(0,210,255,.7);
  margin-top: .35rem;
}

/* ── M2 — RETORNO CONDENSADO ─────────────────────────────────────────────── */
.retorno-group {
  display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .35rem;
}
.retorno-btn {
  min-width: 58px; text-align: center;
  font-size: .78rem !important; font-weight: 700;
}

/* ── M2 — PAINEL DE RESULTADOS ───────────────────────────────────────────── */
.painel-resultado {
  background: var(--rdc-bg-card);
  border: 2px solid var(--rdc-orange);
  border-radius: var(--r);
  margin-top: 2rem;
  overflow: hidden;
}
.painel-resultado-titulo {
  background: var(--rdc-orange);
  color: var(--rdc-text-pure); font-size: .72rem; font-weight: 900;
  letter-spacing: .1em; padding: .45rem 1rem;
}
.pr-topo-grid {
  display: grid; grid-template-columns: 1fr 1fr 1fr;
  border-bottom: 1px solid var(--rdc-border);
}
.pr-bloco {
  padding: 1rem;
  border-right: 1px solid var(--rdc-border);
}
.pr-bloco:last-child { border-right: none; }
.pr-bloco-label {
  font-size: .6rem; font-weight: 900; letter-spacing: .1em;
  color: var(--rdc-text-muted); margin-bottom: .45rem;
  text-transform: uppercase;
}
.pr-eta-nom {
  font-size: 2rem; font-weight: 900; color: var(--rdc-text-pure);
  line-height: 1; margin-bottom: .25rem;
}
.pr-eta-real {
  font-size: 2rem; font-weight: 900;
  line-height: 1; margin-bottom: .25rem;
}
.pr-sub {
  font-size: .65rem; color: var(--rdc-text-muted); margin-bottom: .6rem;
}
.pr-sub-note { font-style: italic; }
.pr-linha-sm {
  display: flex; justify-content: space-between; align-items: center;
  font-size: .73rem; padding: .15rem 0;
  border-bottom: 1px solid rgba(var(--wash-rgb),.04);
}
.pr-total-linha { border-bottom: none; }
.pr-perdas-destaque {
  border-top: 1px solid var(--rdc-border);
  padding-top: .3rem; margin-top: .15rem;
  font-size: .8rem; font-weight: 800;
}
.pr-nota-secoes { opacity: .6; font-size: .65rem; }
.pv { font-weight: 700; font-size: .8rem; color: var(--rdc-text-pure); }
.pv-vermelho { color: var(--rdc-red) !important; }
.pv-laranja  { color: var(--rdc-orange-txt) !important; }
.pv-muted    { color: var(--rdc-text-muted) !important; font-weight: 400 !important; }

/* Badges de classificação NR-13 */
.classe-badge-wrap {
  display: flex; align-items: center; gap: .5rem;
  margin: .55rem 0 .3rem;
}
.classe-badge {
  display: inline-block;
  font-size: .75rem; font-weight: 900; letter-spacing: .05em;
  padding: .25rem .7rem; border-radius: 4px;
  background: rgba(var(--wash-rgb),.1); color: var(--rdc-text-pure);
}
.classe-badge.classe-a { background: rgba(34,197,94,.12);  color: var(--status-ok);     border: 1px solid rgba(34,197,94,.35); }
.classe-badge.classe-b { background: rgba(96,165,250,.12); color: var(--status-info);   border: 1px solid rgba(96,165,250,.35); }
.classe-badge.classe-c { background: rgba(234,179,8,.12);  color: var(--status-warn);   border: 1px solid rgba(234,179,8,.35); }
.classe-badge.classe-d { background: rgba(255,107,53,.12); color: var(--rdc-orange-txt);    border: 1px solid rgba(255,107,53,.35); }
.classe-badge.classe-e { background: rgba(239,68,68,.12);  color: var(--status-danger); border: 1px solid rgba(239,68,68,.35); }
.classe-norma {
  font-size: .6rem; color: var(--rdc-text-muted); white-space: nowrap;
}

/* Custos e economia */
.pr-custo-grid {
  display: grid; grid-template-columns: 1fr 1fr;
}
.pr-custo-bloco {
  padding: .85rem 1rem;
  border-right: 1px solid var(--rdc-border);
}
.pr-economia-bloco {
  padding: .85rem 1rem;
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: .3rem;
}
.pr-custo-titulo {
  font-size: .6rem; font-weight: 900; letter-spacing: .08em;
  color: var(--rdc-text-muted); text-transform: uppercase; margin-bottom: .5rem;
}
.pr-custo-linha {
  display: flex; align-items: center; gap: .4rem;
  font-size: .75rem; padding: .2rem 0;
  border-bottom: 1px solid rgba(var(--wash-rgb),.04);
}
.pr-custo-linha > span:first-child { flex: 1; color: var(--rdc-text-muted); }
.pr-custo-total {
  border-top: 1px solid var(--rdc-border);
  border-bottom: none; font-weight: 800; margin-top: .15rem; padding-top: .35rem;
}
.pv-custo       { color: var(--rdc-text-pure); font-weight: 700; font-size: .8rem; }
.pv-custo-total { color: var(--rdc-cyan-txt);       font-weight: 900; font-size: .9rem; }
.pv-unit        { color: var(--rdc-text-muted); font-size: .65rem; }
.pr-eco-label {
  font-size: .6rem; font-weight: 900; letter-spacing: .08em;
  color: var(--rdc-text-muted); text-transform: uppercase;
}
.pr-eco-val {
  font-size: 1.5rem; font-weight: 900; color: var(--status-ok);
}
.pr-eco-sub {
  font-size: .65rem; color: var(--rdc-text-muted);
}

/* Qualidade água SDT */
.qualidade-bom     { color: var(--status-ok); }
.qualidade-alerta  { color: var(--status-warn); }
.qualidade-critico { color: var(--status-danger); }

/* CO₂/ano — IPCC 2006 */
.co2-resultado-bloco { display: none; }
.co2-resultado-row { display: flex; align-items: baseline; gap: .5rem; margin: .2rem 0; }
.co2-val  { font-size: 1.2rem; font-weight: 800; color: var(--rdc-cyan-txt); }
.co2-tipo { font-size: .7rem; font-weight: 700; padding: .1rem .35rem; border-radius: 3px; }
.co2-tipo.fossil { background: rgba(251,191,36,.12); color: var(--status-warn); }
.co2-tipo.bio    { background: rgba(34,197,94,.12); color: var(--status-ok); }

/* pH + SDT badges — VDI 2035 */
.ph-resultado-row { display: flex; flex-wrap: wrap; gap: .4rem; margin: .5rem 0 .2rem; }
.ph-badge  { padding: .2rem .55rem; border-radius: 4px; font-size: .72rem; font-weight: 700; }
.ph-badge.ok   { background: rgba(34,197,94,.12); color: var(--status-ok); }
.ph-badge.warn { background: rgba(234,179,8,.12); color: var(--status-warn); }
.ph-badge.nok  { background: rgba(239,68,68,.12); color: var(--status-danger); }
.ph-badge.nd   { background: rgba(var(--wash-rgb),.06); color: var(--rdc-text-muted); }
.ph-grid { margin-top: .6rem; }

/* ── M1 — LAYOUT COM PAINEL DIREITO ─────────────────────────────────────── */
.m1-layout { display: flex; gap: 0; align-items: flex-start; width: 100%; }
.m1-main   { flex: 1; min-width: 0; padding: 1.5rem; overflow-y: auto; }
.content-area:has(.m1-layout) { padding: 0; display: flex; align-items: flex-start; }
.m1-rpainel {
  width: 260px; min-width: 260px;
  background: var(--rdc-fundo-website); border-left: 1px solid var(--rdc-border);
  padding: 1rem .9rem; min-height: 100vh;
  position: sticky; top: 0; overflow-y: auto;
}
.rp1-tit-bloco {
  font-size: .6rem; font-weight: 700; color: var(--rdc-orange-txt);
  letter-spacing: .14em; text-transform: uppercase;
  border-bottom: 1px solid var(--rdc-border); padding-bottom: .2rem;
  margin: .8rem 0 .35rem;
}
.rp1-tit-bloco:first-of-type { margin-top: 0; }
.rp1-row {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: .18rem 0; font-size: .71rem; gap: .3rem;
}
.rp1-lbl { color: var(--rdc-text-muted); flex: 0 0 auto; white-space: nowrap; }
.rp1-val {
  color: var(--rdc-text-light); text-align: right; flex: 1;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-weight: 600;
}
.rp1-big  { font-size: .95rem; color: var(--rdc-orange-txt); }
.rp1-dest { border-top: 1px solid var(--rdc-border); padding-top: .4rem; margin-top: .2rem; }
.rp1-btn-av { width: 100%; margin-top: 1rem; font-size: .75rem; padding: .6rem .5rem; }

/* ── M8 — CONFORMIDADE AMBIENTAL ─────────────────────────────────────────── */
.m8-res-header {
  display: grid; grid-template-columns: 2fr 1fr 2fr 1fr;
  gap: .3rem; font-size: .65rem; color: var(--rdc-text-muted); text-transform: uppercase;
  letter-spacing: .08em; padding: .3rem .5rem; border-bottom: 1px solid var(--rdc-border);
  margin-bottom: .3rem;
}
.m8-res-row {
  display: grid; grid-template-columns: 2fr 1fr 2fr 1fr;
  gap: .3rem; align-items: center; padding: .3rem .5rem;
  border-radius: .3rem; font-size: .8rem; margin-bottom: .2rem;
  border-left: 3px solid transparent; background: var(--rdc-fundo-website);
}
.m8-res-row.m8-res-excelente    { border-color: var(--status-ok); background: rgba(34,197,94,.08); }
.m8-res-row.m8-res-regular      { border-color: var(--status-warn); background: rgba(234,179,8,.08); }
.m8-res-row.m8-res-alerta       { border-color: var(--rdc-orange); background: rgba(255,107,53,.08); }
.m8-res-row.m8-res-nao-conforme { border-color: var(--status-danger); background: rgba(239,68,68,.08); }
.m8-res-param { color: var(--rdc-text-muted); font-weight: 600; }
.m8-res-val   { color: var(--rdc-text-light); font-weight: 700; }
.m8-res-lim   { color: var(--rdc-text-muted); font-size: .72rem; }
.m8-res-pct   { text-align: right; font-weight: 700; color: var(--rdc-text-muted); }
.m8-status-wrap { text-align: center; margin-top: 1rem; }
.m8-status-badge {
  display: inline-block; padding: .5rem 1.5rem;
  border-radius: .4rem; font-weight: 700; font-size: .85rem; letter-spacing: .06em;
}
.m8-conforme     { background: rgba(34,197,94,.08); color: var(--status-ok); border: 1px solid var(--status-ok); }
.m8-alerta       { background: rgba(234,179,8,.08); color: var(--status-warn); border: 1px solid var(--status-warn); }
.m8-nao-conforme { background: rgba(239,68,68,.08); color: var(--status-danger); border: 1px solid var(--status-danger); }

/* ── M2 — LAYOUT PRINCIPAL COM PAINEL DIREITO ────────────────────────────── */
.m2-layout {
  display: flex; gap: 0; align-items: flex-start; width: 100%;
}
.m2-main {
  flex: 1; min-width: 0;
  padding: 0 1.5rem 3rem 1.75rem;
}
.m2-rpainel {
  width: 400px; min-width: 360px;
  flex-shrink: 0;
  background: var(--rdc-bg-deep);
  border-left: 2px solid var(--rdc-orange);
  display: flex; flex-direction: column; gap: 0;
  position: sticky; top: 0; align-self: flex-start;
  height: calc(100vh - var(--header-h) - var(--footer-h));
  overflow-y: auto;
  padding: 0 0 1rem;
}
/* scrollbar fina no painel direito */
.m2-rpainel::-webkit-scrollbar { width: 4px; }
.m2-rpainel::-webkit-scrollbar-track { background: transparent; }
.m2-rpainel::-webkit-scrollbar-thumb { background: rgba(var(--wash-rgb),.1); border-radius: 2px; }

/* ── M2 — SEÇÃO MEDIDOR DE VAZÃO ─────────────────────────────────────────── */
.instr-subbloco {
  border: 1px solid var(--rdc-border);
  border-radius: var(--r-sm);
  margin: .85rem 1.1rem .5rem;
  overflow: hidden;
}
.instr-subbloco-hdr {
  font-size: .68rem; font-weight: 900; letter-spacing: .08em;
  padding: .4rem .85rem;
  border-bottom: 1px solid var(--rdc-border);
}
.instr-hdr-vazao { background: rgba(0,210,255,.06); color: var(--rdc-cyan-txt); }
.instr-hdr-term  { background: rgba(255,107,53,.06);  color: var(--rdc-orange-txt); }
.instr-subbloco-body {
  padding: .85rem;
}
.secao-body.grid-2,
/* Versao "solta" (fora de .secao-body): usada por med-bloco-body, dosagem-grid
   e afins. grid-3 e grid-4 entram aqui — era a ausencia da grid-3 solta que
   fazia o bloco do termometro renderizar em uma coluna. */
.grid-2,
.grid-3,
.grid-4 {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: .85rem 1rem;
}
@media(max-width:900px) {
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
}
.mv-letra {
  background: linear-gradient(135deg, #00D2FF, #0066BB) !important;
}

/* ── M2 — COR DA FUMAÇA ──────────────────────────────────────────────────── */
.cor-fumaca-wrap {
  background: rgba(var(--recesso-rgb),.18);
  border: 1px solid rgba(var(--wash-rgb),.07);
  border-radius: var(--r-sm);
  margin: 0 0 .85rem 0;
  padding: .75rem .85rem .6rem;
}
.cor-fumaca-label {
  font-size: .62rem; font-weight: 900; letter-spacing: .12em;
  color: var(--rdc-text-muted); text-transform: uppercase;
  margin-bottom: .55rem;
}
.fuma-btns-row {
  display: flex; gap: .45rem; flex-wrap: wrap;
}
.fuma-btn {
  display: flex; flex-direction: column; align-items: center; gap: .15rem;
  background: var(--rdc-bg-input);
  border: 1px solid var(--rdc-border);
  border-radius: var(--r-sm);
  padding: .45rem .65rem;
  cursor: pointer; transition: border-color .2s, background .2s;
  min-width: 92px;
}
.fuma-btn:hover { border-color: rgba(0,210,255,.35); background: rgba(0,210,255,.05); }
.fuma-btn.fuma-ativa {
  border-color: var(--rdc-cyan);
  background: rgba(0,210,255,.1);
  box-shadow: 0 0 0 1px rgba(0,210,255,.3);
}
.fuma-emoji { font-size: 1.4rem; line-height: 1; }
.fuma-nome  { font-size: .67rem; font-weight: 700; color: var(--rdc-text-light); text-align: center; }
.fuma-vals  { font-size: .6rem; color: var(--rdc-text-muted); text-align: center; }
.tem-analisador-row {
  margin-top: .65rem;
  display: flex; flex-direction: column; gap: .3rem;
}
.chk-wrap {
  display: flex; align-items: center; gap: .5rem; cursor: pointer;
}
.chk-wrap input[type=checkbox] {
  accent-color: var(--rdc-orange); width: 15px; height: 15px; cursor: pointer;
}
.chk-txt {
  font-size: .72rem; font-weight: 700; color: var(--rdc-orange-txt); letter-spacing: .03em;
}
.analisador-campo { transition: opacity .25s; }
.analisador-hint  { color: rgba(255,107,53,.7) !important; }
.mt-secao { margin-top: .75rem; }

/* ── M2 — PAINEL DIREITO (rp-*) ─────────────────────────────────────────── */
.rp-card {
  padding: .7rem .85rem;
  border-bottom: 1px solid rgba(var(--wash-rgb),.05);
}
.rp-card-nom    { background: rgba(var(--wash-rgb),.02); }
.rp-card-desvio { background: rgba(255,107,53,.03); }
.rp-card-real   { background: rgba(0,210,255,.03); }

/* ── LAYOUT DOIS-COLUNAS dentro dos 3 blocos principais ─────────────────── */
.rp-card-cols {
  display: flex; gap: .55rem; align-items: flex-start; margin-top: .2rem;
}
.rp-col-esq { flex: 0 0 auto; }
.rp-col-dir {
  flex: 1; min-width: 0;
  border-left: 1px solid rgba(var(--wash-rgb),.07);
  padding-left: .5rem;
  display: flex; flex-direction: column; gap: .15rem;
}
/* Tags de contexto M1 — Bloco 1 */
.rp-ctx-tag {
  font-size: .6rem; font-weight: 600;
  color: var(--rdc-text-muted);
  padding: .1rem 0;
  border-bottom: 1px solid rgba(var(--wash-rgb),.04);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rp-ctx-tag:empty { display: none; }
/* Linhas η bruta / Gap — Bloco 3 */
.rp-bruta-item {
  display: flex; justify-content: space-between; align-items: center;
  font-size: .63rem; padding: .1rem 0;
  border-bottom: 1px solid rgba(var(--wash-rgb),.04);
}
.rp-bruta-item span   { color: var(--rdc-text-muted); }
.rp-bruta-item strong { color: var(--rdc-text-light); font-size: .67rem; }
.rp-card-direto { background: rgba(34,197,94,.04); border-left: 2px solid rgba(34,197,94,.3); }
.rp-dir-badge   { display: inline-block; padding: .15rem .45rem; border-radius: 3px; font-size: .68rem; font-weight: 700; letter-spacing: .04em; margin-top: .2rem; }
.rp-dir-badge.ok  { background: rgba(34,197,94,.12); color: var(--status-ok); }
.rp-dir-badge.nok { background: rgba(239,68,68,.12); color: var(--status-danger); }
.rp-dir-badge.nd  { background: rgba(var(--wash-rgb),.06); color: var(--rdc-text-muted); }
.rp-card-classe { display: flex; flex-direction: column; gap: .25rem; align-items: flex-start; }
.rp-card-custo  { background: rgba(var(--recesso-rgb),.1); }
.rp-card-eco    { background: rgba(34,197,94,.03); }
.rp-card-comp   { padding: .7rem .85rem .85rem; }

.rp-card-tit {
  font-size: .57rem; font-weight: 900; letter-spacing: .1em;
  color: var(--rdc-text-muted); text-transform: uppercase;
  margin-bottom: .35rem;
}
.rp-eta-nom-val {
  font-size: 2rem; font-weight: 900; color: var(--rdc-text-pure); line-height: 1;
}
.rp-hint-sm {
  font-size: .58rem; color: var(--rdc-text-muted); margin-top: .2rem;
}
.rp-desvio-val {
  font-size: 1.5rem; font-weight: 900; color: var(--rdc-red); line-height: 1;
  margin-bottom: .45rem;
}
.rp-perdas-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: .25rem .5rem;
}
.rp-perda-item {
  display: flex; justify-content: space-between; align-items: center;
  font-size: .65rem; padding: .1rem 0;
  border-bottom: 1px solid rgba(var(--wash-rgb),.04);
}
.rp-perda-item span  { color: var(--rdc-text-muted); }
.rp-perda-item strong { color: var(--rdc-orange-txt); font-size: .7rem; }
.rp-perda-dg { grid-column: span 2; }
.rp-perda-dg strong { color: var(--rdc-text-muted); }
.rp-total-perdas {
  margin-top: .4rem;
  font-size: .67rem; font-weight: 700; color: var(--rdc-text-light);
  border-top: 1px solid rgba(var(--wash-rgb),.08);
  padding-top: .3rem;
}
.rp-total-perdas strong { color: var(--rdc-red); }
.rp-eta-real-val {
  font-size: 2rem; font-weight: 900; color: var(--rdc-cyan-txt); line-height: 1;
}
.rp-eta-bruta-linha {
  font-size: .62rem; color: var(--rdc-text-muted); margin-top: .2rem;
}
.rp-gap-val { color: var(--rdc-orange-txt); font-weight: 700; }
.rp-classe-badge {
  display: inline-block;
  font-size: .78rem; font-weight: 900; letter-spacing: .05em;
  padding: .3rem .75rem; border-radius: 4px;
  background: rgba(var(--wash-rgb),.08); color: var(--rdc-text-pure);
}
.rp-classe-badge.classe-a { background: rgba(34,197,94,.12); color: var(--status-ok); border: 1px solid var(--status-ok); }
.rp-classe-badge.classe-b { background: var(--rdc-border); color: var(--status-info); border: 1px solid var(--status-info); }
.rp-classe-badge.classe-c { background: rgba(234,179,8,.12); color: var(--status-warn); border: 1px solid var(--status-warn); }
.rp-classe-badge.classe-d { background: rgba(255,107,53,.12); color: var(--rdc-orange-txt); border: 1px solid rgba(255,107,53,.35); }
.rp-classe-badge.classe-e { background: rgba(239,68,68,.12); color: var(--status-danger); border: 1px solid var(--status-danger); }
.rp-classe-norma { font-size: .58rem; color: var(--rdc-text-muted); }
.rp-incert-mini  { font-size: .62rem; color: rgba(0,210,255,.65); margin-top: .15rem; }
.rp-custo-linha {
  display: flex; justify-content: space-between; align-items: center;
  font-size: .68rem; padding: .18rem 0;
  border-bottom: 1px solid rgba(var(--wash-rgb),.04);
}
.rp-custo-linha span  { color: var(--rdc-text-muted); }
.rp-custo-linha strong { color: var(--rdc-text-pure); font-size: .72rem; }
.rp-custo-total-linha {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: .3rem; padding-top: .25rem;
  border-top: 1px solid rgba(var(--wash-rgb),.08);
  font-size: .65rem; font-weight: 700; color: var(--rdc-text-muted);
}
.rp-custo-total-val {
  color: var(--rdc-cyan-txt) !important; font-size: .82rem !important;
}
.rp-eco-val {
  font-size: 1.3rem; font-weight: 900; color: var(--status-ok); line-height: 1;
}
.rp-eco-detalhe {
  font-size: .6rem; color: var(--rdc-text-muted); margin-top: .2rem;
}
.btn-gerar-calculos {
  display: block; width: calc(100% - 1.7rem);
  margin: .6rem .85rem;
  background: linear-gradient(135deg, var(--rdc-orange), #d44a00);
  border: none; border-radius: var(--r-sm);
  color: var(--rdc-text-pure); font-size: .78rem; font-weight: 900;
  letter-spacing: .08em; text-transform: uppercase;
  padding: .65rem 1rem; cursor: pointer;
  transition: filter .2s, transform .1s;
}
.btn-gerar-calculos:hover { filter: brightness(1.15); }
.btn-gerar-calculos:active { transform: scale(.98); }
.btn-gerar-calculos.btn-calculado { background: var(--rdc-green); }

/* ── M2 — CUSTO 2×2 grid ─────────────────────────────────────────────────── */
.rp-custo-grid {
  display: flex; gap: .5rem; margin-bottom: .3rem;
}
.rp-custo-col {
  flex: 1; display: flex; flex-direction: column; gap: .12rem;
}
.rp-custo-label {
  font-size: .58rem; font-weight: 700; color: var(--rdc-text-muted);
  text-transform: uppercase; letter-spacing: .5px;
}
.rp-custo-preco {
  font-size: .65rem; color: var(--rdc-text-muted); font-weight: 600;
}
.rp-custo-ton {
  font-size: .72rem; font-weight: 800; color: var(--rdc-text-pure);
}

/* ── M2 — ECONOMIA itemizada ─────────────────────────────────────────────── */
.rp-eco-itens {
  list-style: none; padding: 0; margin: .35rem 0 0; display: flex; flex-direction: column; gap: .1rem;
}
.rp-eco-itens li {
  font-size: .59rem; color: var(--rdc-text-muted);
  padding: .1rem 0; border-bottom: 1px solid rgba(var(--wash-rgb),.04);
  line-height: 1.4;
}
.rp-eco-aviso {
  font-size: .6rem; color: var(--status-warn);
  background: rgba(245,158,11,.1); border: 1px solid rgba(245,158,11,.2);
  padding: .25rem .45rem; border-radius: .2rem; margin-top: .35rem;
}

/* ── M2 — Badge ISO + abas de ação ──────────────────────────────────────── */
.rp-iso-row {
  display: flex; align-items: center; gap: .4rem;
  padding: .3rem .5rem; margin: .4rem .85rem .2rem;
  background: rgba(var(--wash-rgb),.03); border-radius: .3rem; font-size: .6rem;
}
.rp-iso-label { color: var(--rdc-text-muted); font-size: .59rem; line-height: 1.3; }
.rp-iso-badge {
  font-size: .5rem; font-weight: 800; padding: .15rem .35rem;
  border-radius: .15rem; letter-spacing: .08em; white-space: nowrap;
}
.rp-iso-badge.iso-ok   { background: rgba(34,197,94,.12); color: var(--status-ok); }
.rp-iso-badge.iso-fail { background: rgba(248,113,113,.12); color: var(--status-danger); }
.rp-acoes-tabs {
  display: flex; gap: .3rem; margin: .3rem .85rem .5rem;
}
.rp-tab-btn {
  flex: 1; font-size: .6rem; font-weight: 700; padding: .3rem .2rem;
  border: 1px solid rgba(var(--wash-rgb),.12); border-radius: .25rem;
  background: rgba(var(--wash-rgb),.05); color: var(--rdc-text-muted);
  cursor: pointer; font-family: inherit; text-transform: uppercase; letter-spacing: .05em;
  transition: background .15s, color .15s;
}
.rp-tab-btn:hover { background: rgba(var(--wash-rgb),.12); color: var(--rdc-text-light); }

/* ── M2 — TABELA DE COMPARAÇÃO ───────────────────────────────────────────── */
.rp-comp-inputs { margin-bottom: .65rem; }
.rp-comp-spec-row { display: flex; gap: .35rem; align-items: flex-end; }
.rp-comp-spec-row .fg { flex: 1; }
.rp-comp-2col { display: grid; grid-template-columns: 1fr 1fr; gap: .35rem; margin-top: .2rem; }
.btn-gerar-comp {
  display: block; width: 100%; margin: .45rem 0;
  padding: .4rem; font-size: .62rem; font-weight: 700;
  border: 1px solid rgba(var(--wash-rgb),.18); border-radius: .3rem;
  background: rgba(var(--wash-rgb),.07); color: var(--rdc-text-light);
  cursor: pointer; text-transform: uppercase; letter-spacing: .06em; font-family: inherit;
  transition: background .15s;
}
.btn-gerar-comp:hover { background: rgba(var(--wash-rgb),.14); }
.comp-row-dest td { background: rgba(34,197,94,.05); }
.rp-comp-aviso {
  font-size: .59rem; color: var(--status-warn);
  background: rgba(245,158,11,.08); border: 1px solid rgba(245,158,11,.18);
  padding: .3rem .5rem; border-radius: .25rem; margin-top: .45rem; line-height: 1.4;
}
.rp-comp-inputs .fg { margin-bottom: .45rem; }
.rp-comp-inputs label { font-size: .65rem; }
.rp-comp-inputs input { font-size: .75rem; }
.rp-comp-tabela { overflow-x: auto; }
.comp-table {
  width: 100%; border-collapse: collapse;
  font-size: .63rem;
}
.comp-table th {
  background: rgba(var(--recesso-rgb),.3);
  color: var(--rdc-text-muted); font-size: .58rem;
  padding: .25rem .4rem; text-align: left;
  border-bottom: 1px solid rgba(var(--wash-rgb),.07);
}
.comp-table td {
  padding: .28rem .4rem;
  border-bottom: 1px solid rgba(var(--wash-rgb),.04);
  color: var(--rdc-text-light);
}
.comp-table td:first-child { color: var(--rdc-text-muted); }
.comp-ganho { font-weight: 800; text-align: right; }
.comp-pos { color: var(--status-ok); }
.comp-neg { color: var(--status-danger); }
.comp-col-opt { display: none; }
@media (min-width: 1400px) { .comp-col-opt { display: table-cell; } }
.comp-aguarde {
  padding: .5rem .4rem; font-size: .63rem;
  color: var(--rdc-text-muted); text-align: center;
}

/* ── M2 — DESVIO: descrição textual das perdas ───────────────────────────── */
.rp-perdas-desc {
  font-size: .6rem; color: var(--rdc-text-muted); line-height: 1.5;
  margin-top: .3rem;
}

/* ── M2 — IDE (Indicador de Desempenho Energético) ──────────────────────── */
.rp-ide-linha {
  font-size: .65rem; color: var(--rdc-text-muted); margin-top: .2rem;
}
.rp-ide-linha strong { color: var(--rdc-cyan-txt); font-size: .75rem; }
.rp-ide-row {
  padding: .35rem .85rem;
  font-size: .68rem; font-weight: 700; color: var(--rdc-text-muted);
  border-top: 1px solid rgba(var(--wash-rgb),.05);
  border-bottom: 1px solid rgba(var(--wash-rgb),.05);
  background: rgba(var(--recesso-rgb),.1);
}
.rp-ide-val { color: var(--rdc-orange-txt); font-size: .9rem; font-weight: 900; }

/* ── M2 — CUSTO 2×2 (novo) ──────────────────────────────────────────────── */
.rp-custo-2x2 {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: .5rem .6rem; margin-bottom: .45rem;
}
.rp-custo-cel {
  display: flex; flex-direction: column; gap: .1rem;
  padding: .3rem .4rem;
  background: rgba(var(--wash-rgb),.03);
  border-radius: .2rem;
  border: 1px solid rgba(var(--wash-rgb),.05);
}
.rp-custo-label {
  font-size: .57rem; font-weight: 700; color: var(--rdc-text-muted);
  text-transform: uppercase; letter-spacing: .5px;
}
.rp-custo-ton {
  font-size: .8rem; font-weight: 900; color: var(--rdc-text-pure);
}
.rp-custo-eco { color: var(--status-ok) !important; }
.rp-custo-sub {
  font-size: .55rem; color: var(--rdc-text-muted); margin-top: .3rem;
}

/* ── M2 — ECONOMIA: nota de manutenção corretiva ────────────────────────── */
.rp-eco-manut {
  font-size: .57rem; font-weight: 800; letter-spacing: .04em;
  color: var(--status-warn); text-transform: uppercase;
  background: rgba(245,158,11,.08); border: 1px solid rgba(245,158,11,.18);
  padding: .2rem .45rem; border-radius: .2rem; margin-top: .35rem;
}

/* ── M2 — BOTÃO RECALCULAR (laranja, substituí btn-gerar-calculos) ────────── */
.btn-recalcular {
  display: block; width: calc(100% - 1.7rem);
  margin: .55rem .85rem .3rem;
  background: linear-gradient(135deg, var(--rdc-orange), #d44a00);
  border: none; border-radius: var(--r-sm);
  color: var(--rdc-text-pure); font-size: .8rem; font-weight: 900;
  letter-spacing: .1em; text-transform: uppercase;
  padding: .65rem 1rem; cursor: pointer;
  transition: filter .2s, transform .1s;
}
.btn-recalcular:hover  { filter: brightness(1.15); }
.btn-recalcular:active { transform: scale(.98); }
.btn-recalcular.btn-calculado { background: var(--rdc-green); }

/* ── M2 — GERAR RELATÓRIO COMERCIAL ─────────────────────────────────────── */
.btn-gerar-comercial {
  display: block; width: calc(100% - 1.7rem);
  margin: .3rem .85rem .3rem;
  background: linear-gradient(135deg, var(--rdc-orange), #c04000);
  border: none; border-radius: var(--r-sm);
  color: var(--rdc-text-pure); font-size: .75rem; font-weight: 900;
  letter-spacing: .07em; text-transform: uppercase;
  padding: .6rem 1rem; cursor: pointer;
  transition: filter .2s, transform .1s;
  box-shadow: 0 2px 10px rgba(255,107,53,.35);
}
.btn-gerar-comercial:hover  { filter: brightness(1.15); }
.btn-gerar-comercial:active { transform: scale(.98); }

/* ── M2 — INICIAR AUDITORIA ─────────────────────────────────────────────── */
.btn-iniciar-auditoria {
  display: block; width: calc(100% - 1.7rem);
  margin: .3rem .85rem .3rem;
  background: rgba(var(--wash-rgb),.05);
  border: 1px solid rgba(var(--wash-rgb),.18); border-radius: var(--r-sm);
  color: var(--rdc-text-light); font-size: .72rem; font-weight: 800;
  letter-spacing: .07em; text-transform: uppercase;
  padding: .5rem 1rem; cursor: pointer;
  transition: background .15s, color .15s;
  font-family: inherit;
}
.btn-iniciar-auditoria:hover { background: rgba(var(--wash-rgb),.12); color: var(--rdc-text-pure); }

/* ── M2 — CARD COMPARAÇÃO (novo layout) ─────────────────────────────────── */
.rp-comp-tit { color: var(--rdc-orange-txt) !important; }
.rp-comp-hint {
  font-size: .57rem; color: var(--rdc-text-muted); margin-bottom: .55rem; line-height: 1.4;
}
.rp-comp-grid2 {
  display: grid; grid-template-columns: 1fr 1fr; gap: .4rem;
}
.rp-comp-grid2 label {
  font-size: .57rem; font-weight: 700; color: var(--rdc-text-muted);
  text-transform: uppercase; letter-spacing: .05em; margin-bottom: .15rem; display: block;
}
.rp-comp-grid2 input,
.rp-comp-grid2 select {
  width: 100%; font-size: .72rem; padding: .3rem .45rem;
  background: var(--rdc-bg-input); border: 1px solid var(--rdc-border);
  border-radius: .2rem; color: var(--rdc-text-pure); font-family: inherit; box-sizing: border-box;
}
.comp-pres-sel { font-size: .65rem !important; }
.btn-ver-comparacao {
  display: block; width: 100%; margin: .5rem 0 .4rem;
  padding: .4rem; font-size: .65rem; font-weight: 800;
  border: 1px solid var(--rdc-orange); border-radius: .3rem;
  background: rgba(255,107,53,.1); color: var(--rdc-orange-txt);
  cursor: pointer; text-transform: uppercase; letter-spacing: .06em; font-family: inherit;
  transition: background .15s, color .15s;
}
.btn-ver-comparacao:hover { background: var(--rdc-orange); color: var(--rdc-text-pure); }
.comp-thead-row th {
  font-size: .57rem; text-align: center;
}
.comp-thead-row th:first-child { text-align: left; }
.comp-resumo-box {
  margin-top: .45rem; padding: .45rem .65rem;
  border-radius: .25rem; font-size: .68rem; font-weight: 700; line-height: 1.45;
}
.comp-resumo-ok    { background: rgba(34,197,94,.08); border: 1px solid rgba(34,197,94,.2); color: var(--status-ok); }
.comp-resumo-total { background: rgba(255,107,53,.08);  border: 1px solid rgba(255,107,53,.2);  color: var(--rdc-orange-txt); }

/* ── M2: content-area sem padding e display:flex quando contém m2-layout ─── */
.content-area:has(.m2-layout) {
  padding: 0;
  display: flex;
  align-items: flex-start;
  overflow-x: hidden;
}

/* ── M6: layout com painel ASME PTC 4 ───────────────────────────────────── */
.m6-layout { display: flex; gap: 0; align-items: flex-start; width: 100%; }
.m6-main   { flex: 1; min-width: 0; padding: 0 1.5rem 3rem 1.75rem; }
.m6-rpainel {
  width: 380px; min-width: 340px; flex-shrink: 0;
  background: var(--rdc-bg-deep);
  border-left: 2px solid var(--rdc-orange);
  display: flex; flex-direction: column; gap: 0;
  position: sticky; top: 0; align-self: flex-start;
  height: calc(100vh - var(--header-h) - var(--footer-h));
  overflow-y: auto; padding: 0 0 1rem;
}
.m6-rpainel::-webkit-scrollbar { width: 4px; }
.m6-rpainel::-webkit-scrollbar-track { background: transparent; }
.m6-rpainel::-webkit-scrollbar-thumb { background: rgba(var(--wash-rgb),.1); border-radius: 2px; }
.content-area:has(.m6-layout) { padding: 0; display: flex; align-items: flex-start; overflow-x: hidden; }

/* ── M9: layout com painel de integridade ───────────────────────────────── */
.m9-layout { display: flex; gap: 0; align-items: flex-start; width: 100%; }
.m9-main   { flex: 1; min-width: 0; padding: 0 1.5rem 3rem 1.75rem; }
.m9-rpainel {
  width: 300px; min-width: 270px; flex-shrink: 0;
  background: var(--rdc-bg-deep);
  border-left: 2px solid var(--rdc-border);
  display: flex; flex-direction: column; gap: 0;
  position: sticky; top: 0; align-self: flex-start;
  height: calc(100vh - var(--header-h) - var(--footer-h));
  overflow-y: auto; padding: 0 0 1rem;
}
.m9-rpainel::-webkit-scrollbar { width: 4px; }
.m9-rpainel::-webkit-scrollbar-track { background: transparent; }
.m9-rpainel::-webkit-scrollbar-thumb { background: rgba(var(--wash-rgb),.1); border-radius: 2px; }
.content-area:has(.m9-layout) { padding: 0; display: flex; align-items: flex-start; overflow-x: hidden; }

/* ── PONTO DE ORVALHO — VDI 3511 / ASME PTC 4 ───────────────────────────── */
.orvalho-bloco {
  background: rgba(var(--recesso-rgb),.2);
  border: 1px solid rgba(var(--wash-rgb),.07);
  border-radius: var(--r-sm);
  padding: .65rem .85rem;
}
.orvalho-hdr {
  font-size: .63rem; font-weight: 800; color: var(--rdc-orange-txt);
  letter-spacing: .05em; margin-bottom: .5rem;
}
.orvalho-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem;
}
.orvalho-item {
  display: flex; flex-direction: column; gap: .15rem;
}
.orvalho-item span { font-size: .6rem; color: var(--rdc-text-muted); }
.orvalho-val       { font-size: .9rem; font-weight: 800; color: var(--rdc-cyan-txt); }
.orvalho-iapws     { font-size: .72rem; font-weight: 700; color: rgba(0,210,255,.7); }
.orvalho-status-badge {
  display: inline-block; font-size: .67rem; font-weight: 700;
  padding: .15rem .4rem; border-radius: 3px;
  background: rgba(var(--wash-rgb),.07); color: var(--rdc-text-muted);
}
.orvalho-status-badge.ok  { background: rgba(34,197,94,.12); color: var(--status-ok); }
.orvalho-status-badge.nok { background: rgba(248,113,113,.12); color: var(--status-danger); }

/* ── CONAMA 382/2006 — Bloco de Conformidade ─────────────────────────────── */
.conama-bloco {
  background: rgba(var(--recesso-rgb),.25);
  border: 1px solid rgba(255,100,0,.2);
  border-radius: var(--r-sm);
  overflow: hidden;
}
.conama-hdr {
  background: rgba(255,107,53,.08);
  border-bottom: 1px solid rgba(255,107,53,.2);
  font-size: .63rem; font-weight: 800; color: var(--rdc-orange-txt);
  padding: .35rem .75rem; letter-spacing: .04em;
}
.conama-items-row {
  display: grid; grid-template-columns: repeat(3,1fr);
  gap: 0;
}
.conama-item {
  padding: .55rem .75rem;
  border-right: 1px solid rgba(var(--wash-rgb),.04);
  display: flex; flex-direction: column; gap: .18rem;
}
.conama-item:last-child { border-right: none; }
.conama-item-lbl  { font-size: .6rem; color: var(--rdc-text-muted); font-weight: 700; }
.conama-item-val  { font-size: .88rem; font-weight: 800; color: var(--rdc-text-pure); }
.conama-item-lim  { font-size: .58rem; color: var(--rdc-text-muted); }
.conama-item-status {
  font-size: .65rem; font-weight: 700;
  padding: .12rem .35rem; border-radius: 3px; display: inline-block; width: fit-content;
  background: rgba(var(--wash-rgb),.06); color: var(--rdc-text-muted);
}
.conama-item-status.conama-ok  { background: rgba(34,197,94,.12); color: var(--status-ok); }
.conama-item-status.conama-nok { background: rgba(248,113,113,.12); color: var(--status-danger); }

/* ── ISO 50001 / EnPI — Painel Direito ───────────────────────────────────── */
.rp-card-iso { background: rgba(0,90,200,.04); }
.rp-enpi-val {
  font-size: 1.3rem; font-weight: 900; color: var(--rdc-cyan-txt); line-height: 1;
  margin-bottom: .3rem;
}
.rp-enpi-bar-wrap { margin: .3rem 0; }
.rp-enpi-bar-track {
  height: 5px; background: rgba(var(--wash-rgb),.06); border-radius: 3px; overflow: hidden;
}
.rp-enpi-bar-fill {
  height: 100%; background: linear-gradient(90deg, var(--status-ok), var(--status-warn), var(--status-danger));
  border-radius: 3px; transition: width .4s;
}
.rp-enpi-linhas {
  display: flex; flex-direction: column; gap: .12rem;
  font-size: .6rem; color: var(--rdc-text-muted);
}
.rp-enpi-linhas strong { color: var(--rdc-text-light); }
.rp-iapws-tag {
  margin-top: .3rem; font-size: .6rem; font-weight: 700;
  color: rgba(0,210,255,.6); letter-spacing: .04em;
}

/* ── CONAMA Mini no Painel Direito ───────────────────────────────────────── */
.rp-card-conama { background: rgba(255,60,0,.03); }
.conama-mini-grid {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: .35rem;
}
.conama-mini-item {
  display: flex; flex-direction: column; gap: .12rem;
}
.conama-mini-item span:first-child { font-size: .58rem; color: var(--rdc-text-muted); }
.conama-mini-item strong           { font-size: .72rem; color: var(--rdc-text-pure); font-weight: 800; }
.conama-mini-badge {
  font-size: .6rem; font-weight: 700;
  padding: .1rem .3rem; border-radius: 3px; display: inline-block;
  background: rgba(var(--wash-rgb),.07); color: var(--rdc-text-muted);
}
.conama-mini-badge.ok   { background: rgba(34,197,94,.12);  color: var(--status-ok); }
.conama-mini-badge.nok  { background: rgba(248,113,113,.12); color: var(--status-danger); }
.conama-mini-badge.warn { background: rgba(251,191,36,.12);  color: var(--status-warn); }

/* ── VPL / TIR / Payback — AACE RP 18R-97 ───────────────────────────────── */
.rp-card-vpl { background: rgba(var(--recesso-rgb),.12); }
.rp-vpl-inputs { margin-bottom: .5rem; }
.rp-vpl-fg label { font-size: .6rem !important; }
.rp-vpl-fg input { font-size: .72rem !important; padding: .25rem .45rem !important; }
.rp-vpl-row2 {
  display: grid; grid-template-columns: 1fr 1fr; gap: .45rem;
  margin-top: .35rem;
}
.rp-vpl-grid {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: .35rem;
  margin-bottom: .4rem;
}
.rp-vpl-item {
  display: flex; flex-direction: column; gap: .1rem;
  padding: .3rem .4rem;
  background: rgba(var(--recesso-rgb),.18); border-radius: 4px;
}
.rp-vpl-item span  { font-size: .58rem; color: var(--rdc-text-muted); }
.rp-vpl-item strong { font-size: .72rem; color: var(--rdc-cyan-txt); font-weight: 800; }
.rp-vpl-item.rp-vpl-payback strong { color: var(--status-warn); }
.rp-vpl-item-val.positivo { color: var(--status-ok) !important; }
.rp-vpl-item-val.negativo { color: var(--status-danger) !important; }
.rp-aace-nota {
  font-size: .57rem; color: var(--rdc-text-muted); font-style: italic;
  border-top: 1px solid rgba(var(--wash-rgb),.05); padding-top: .35rem;
}

/* ── M2 — SELECT GENÉRICO ────────────────────────────────────────────────── */
.m2-select {
  width: 100%;
  background: var(--rdc-bg-input);
  border: 1px solid var(--rdc-border);
  border-radius: var(--r-sm);
  color: var(--rdc-text-light);
  font-size: .75rem;
  padding: .38rem .55rem;
  cursor: pointer;
  outline: none;
  transition: border-color .2s;
}
.m2-select:focus { border-color: var(--rdc-cyan); }
.m2-select option { background: var(--rdc-bg-input); color: var(--rdc-text-light); }

/* ── M2 — SLIDER (range) — regras canônicas abaixo (linha ~2712) ──────────── */

/* ── M2 — ORIGEM TOGGLE ──────────────────────────────────────────────────── */
.origem-row {
  display: flex; align-items: center; flex-wrap: wrap; gap: .4rem;
  margin-top: .45rem;
}
.origem-label {
  font-size: .58rem; font-weight: 900; letter-spacing: .1em;
  color: var(--rdc-text-muted); text-transform: uppercase;
}
.origem-btn {
  font-size: .65rem; font-weight: 700;
  padding: .22rem .6rem;
  border-radius: var(--r-sm);
  border: 1px solid var(--rdc-border);
  background: var(--rdc-bg-input);
  color: var(--rdc-text-muted);
  cursor: pointer; transition: border-color .2s, background .2s, color .2s;
}
.origem-btn:hover { border-color: rgba(0,210,255,.3); color: var(--rdc-text-light); }
.origem-btn.ativo {
  border-color: var(--rdc-cyan);
  background: rgba(0,210,255,.1);
  color: var(--rdc-cyan-txt);
}

/* ── M2 — CONDENSADO LAYOUT ──────────────────────────────────────────────── */
.cond-layout {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
  align-items: start;
}
.cond-slider-col, .cond-temp-col {
  display: flex; flex-direction: column; gap: .4rem;
}
.cond-label {
  font-size: .58rem; font-weight: 900; letter-spacing: .1em;
  color: var(--rdc-text-muted); text-transform: uppercase;
}

/* ── M2 — GRID 4 COLUNAS (multi-gás) ────────────────────────────────────── */
/* Padronizado em 2 colunas (ver o bloco DUAS COLUNAS COMO PADRAO acima) —
   esta regra vinha depois na cascata e reimporia 4. */
.grid-4 {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem 1rem;
}

/* ── M2 — INCERTEZA INLINE (Seção B) ────────────────────────────────────── */
.incert-mini-row {
  display: flex; gap: .6rem; align-items: center; flex-wrap: wrap;
  margin-top: .35rem;
}
.incert-mini-item {
  display: flex; align-items: center; gap: .3rem;
  font-size: .67rem; color: var(--rdc-text-muted);
}
.incert-mini-item input[type=number] {
  width: 58px;
  padding: .22rem .35rem;
  font-size: .72rem;
}
.incert-mini-item span { white-space: nowrap; }

/* ── M2 — ÁGUA DE ALIMENTAÇÃO ────────────────────────────────────────────── */
.agua-bloco {
  background: rgba(0,150,255,.04);
  border: 1px solid rgba(0,150,255,.15);
  border-radius: var(--r-sm);
  padding: .75rem .85rem .65rem;
}
.agua-bloco-label {
  font-size: .6rem; font-weight: 900; letter-spacing: .1em;
  color: rgba(0,210,255,.65); text-transform: uppercase;
  margin-bottom: .4rem;
}
.agua-eco-aviso {
  background: rgba(251,191,36,.07);
  border: 1px solid rgba(251,191,36,.25);
  border-radius: var(--r-sm);
  color: var(--status-warn);
  font-size: .67rem;
  padding: .35rem .65rem;
  margin-top: .45rem;
}

/* ── M2 — SUB-SEÇÃO (qualidade da água) ─────────────────────────────────── */
.secao-sub {
  background: rgba(var(--recesso-rgb),.15);
  border: 1px solid rgba(var(--wash-rgb),.06);
  border-radius: var(--r-sm);
  padding: .7rem .85rem .8rem;
}
.secao-sub-hdr {
  font-size: .65rem; font-weight: 900; letter-spacing: .06em;
  color: var(--rdc-cyan-txt); text-transform: uppercase;
  margin-bottom: .55rem;
  padding-bottom: .35rem;
  border-bottom: 1px solid rgba(0,210,255,.15);
}

/* ── M2 — CICLOS + DOSAGEM QUÍMICA ──────────────────────────────────────── */
.agua-ciclos-row {
  font-size: .67rem; color: var(--rdc-text-muted);
  padding: .4rem .1rem;
  display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
}
.agua-ciclos-row strong { color: var(--rdc-text-light); }
.agua-efic-badge {
  display: inline-block; font-size: .62rem; font-weight: 700;
  padding: .1rem .4rem; border-radius: 3px;
  background: rgba(var(--wash-rgb),.07); color: var(--rdc-text-muted);
}
.agua-efic-badge.ok   { background: rgba(34,197,94,.12);  color: var(--status-ok); }
.agua-efic-badge.nok  { background: rgba(248,113,113,.12); color: var(--status-danger); }
.agua-efic-badge.warn { background: rgba(251,191,36,.12);  color: var(--status-warn); }
.dosagem-titulo {
  font-size: .57rem; font-weight: 900; letter-spacing: .1em;
  color: var(--rdc-text-muted); text-transform: uppercase;
  margin: .6rem 0 .35rem;
}
.dosagem-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem;
  margin-bottom: .5rem;
}
.dosagem-item {
  display: flex; flex-direction: column; align-items: center; gap: .1rem;
  background: rgba(var(--recesso-rgb),.18);
  border: 1px solid rgba(var(--wash-rgb),.06);
  border-radius: var(--r-sm);
  padding: .4rem .5rem;
}
.dosagem-item strong { font-size: .88rem; font-weight: 800; color: var(--rdc-cyan-txt); }
.dosagem-item span   { font-size: .58rem; color: var(--rdc-text-muted); }
.dosagem-impacto {
  display: grid; grid-template-columns: 1fr 1fr; gap: .5rem;
}
.dosagem-imp-item {
  display: flex; flex-direction: column; align-items: center; gap: .1rem;
  background: rgba(var(--recesso-rgb),.12);
  border: 1px solid rgba(var(--wash-rgb),.05);
  border-radius: var(--r-sm);
  padding: .35rem .5rem;
}
.dosagem-imp-item strong { font-size: .82rem; font-weight: 800; color: var(--rdc-text-light); }
.dosagem-imp-item span   { font-size: .58rem; color: var(--rdc-text-muted); }
.dosagem-imp-neg strong  { color: var(--status-danger); }

/* ── M2 — FULIGEM NOS TUBOS ─────────────────────────────────────────────── */
/* .fuligem-letra removida — mesmo achado do .cf-letra/.pc-letra/.df-letra/
   .ee-letra (SRS-UI-FORM-VISUAL-STANDARD-001 item 4.5): outra variante de cor
   por seção que escapou da primeira varredura. Seção N usa `.secao-letra`. */
.fuligem-wrap {
  background: rgba(255,50,0,.04);
  border: 1px solid rgba(255,50,0,.18);
  border-radius: var(--r-sm);
  padding: .75rem .85rem .65rem;
}
.fuligem-label {
  font-size: .6rem; font-weight: 900; letter-spacing: .1em;
  color: rgba(255,100,50,.7); text-transform: uppercase;
  display: block; margin-bottom: .4rem;
}
.fuligem-select {
  border-color: rgba(255,50,0,.3) !important;
}
.fuligem-select:focus { border-color: var(--rdc-orange) !important; }
.fuligem-msg {
  font-size: .67rem; color: var(--rdc-text-muted);
  padding: .35rem .1rem;
  min-height: 1.5rem;
}
.fuligem-rec {
  font-size: .65rem !important;
  color: var(--rdc-orange-txt);
}

/* ── UTILITÁRIOS INLINE ──────────────────────────────────────────────────── */
.hint-inline {
  font-size: .6rem; font-weight: 400; font-style: normal;
  color: var(--rdc-text-muted); margin-left: .3rem;
}
.unidade-badge-sm {
  font-size: .6rem; font-weight: 700;
  background: rgba(0,210,255,.12); color: var(--rdc-cyan-txt);
  padding: .05rem .3rem; border-radius: 3px; margin-left: .3rem;
}

/* ── BANNER DE SEÇÃO (PERDAS OCULTAS) ───────────────────────────────────── */
.secao-header-banner {
  background: linear-gradient(90deg, rgba(255,70,0,.12), rgba(255,70,0,.04));
  border-left: 3px solid var(--rdc-orange);
  padding: .4rem .85rem;
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: .35rem;
}
.secao-banner-txt {
  font-size: .67rem; font-weight: 900; color: var(--rdc-orange-txt);
  letter-spacing: .06em; text-transform: uppercase;
}
.secao-banner-sub {
  font-size: .58rem; color: var(--rdc-text-muted); font-style: italic;
}

/* .cf-letra/.pc-letra/.df-letra/.ee-letra (variantes de cor por seção do M2)
   removidas — SRS-UI-FORM-VISUAL-STANDARD-001 item 4.5: era um terceiro
   sistema de cor para o selo de início de bloco, incompatível com os outros
   dois (linha ~237 e a antiga `body.mod-2 .secao-letra`). M2 agora usa o
   `.secao-letra` único, igual ao resto do sistema. */

/* ── BLOCO CO₂ (PERDAS CALCULADAS) ─────────────────────────────────────── */
.co2-bloco {
  background: rgba(var(--recesso-rgb),.2);
  border: 1px solid rgba(var(--wash-rgb),.07);
  border-radius: var(--r-sm);
  padding: .7rem .85rem .6rem;
}
.co2-label {
  font-size: .62rem; font-weight: 900; letter-spacing: .08em;
  color: var(--rdc-text-muted); text-transform: uppercase;
  margin-bottom: .4rem;
}
.co2-auto-tag {
  font-weight: 400; font-size: .58rem; color: rgba(0,210,255,.6);
  margin-left: .3rem;
}
.co2-row {
  display: grid; grid-template-columns: 200px 1fr; gap: .75rem;
  align-items: start;
}
.co2-input-fg { margin-bottom: 0 !important; }
.co2-ref-bloco {
  margin-top: .55rem;
  background: rgba(255,120,0,.05);
  border: 1px solid rgba(255,120,0,.15);
  border-radius: var(--r-sm);
  padding: .45rem .65rem;
}
.co2-ref-hdr {
  font-size: .6rem; font-weight: 800; color: var(--rdc-orange-txt);
  letter-spacing: .04em; margin-bottom: .3rem;
}
.co2-ref-lista {
  display: flex; flex-direction: column; gap: .18rem;
  font-size: .63rem; color: var(--rdc-text-muted);
}
.co2-ref-lista strong { color: var(--rdc-text-light); }

/* ── PERDAS CALCULADAS GRID ─────────────────────────────────────────────── */
.perdas-calc-grid { display: flex; flex-direction: column; gap: .45rem; }
.perda-calc-item {
  background: rgba(var(--recesso-rgb),.18);
  border: 1px solid rgba(var(--wash-rgb),.06);
  border-radius: var(--r-sm);
  padding: .5rem .75rem;
}
.perda-q3 { border-color: rgba(255,107,53,.2); background: rgba(255,107,53,.04); }
.perda-calc-lbl  { font-size: .6rem; font-weight: 800; color: var(--rdc-orange-txt); text-transform: uppercase; letter-spacing: .05em; margin-bottom: .2rem; }
.perda-calc-val  { font-size: .88rem; font-weight: 800; color: var(--rdc-text-pure); margin-bottom: .1rem; }
.perda-calc-sub  { font-size: .6rem; color: var(--rdc-text-muted); }

/* ── EMISSÕES ────────────────────────────────────────────────────────────── */
.emissoes-grid { display: flex; flex-direction: column; gap: .35rem; }
.emissao-item {
  display: flex; align-items: flex-start; gap: .5rem;
  font-size: .65rem; padding: .35rem .65rem;
  background: rgba(var(--recesso-rgb),.15);
  border: 1px solid rgba(var(--wash-rgb),.05);
  border-radius: var(--r-sm);
  line-height: 1.4;
}
.emissao-txt { flex: 1; color: var(--rdc-text-muted); }
.emissao-ok      { border-color: rgba(34,197,94,.18);  background: rgba(34,197,94,.04); }
.emissao-ok .emissao-txt { color: rgba(34,197,94,.85); }
.emissao-alerta  { border-color: rgba(251,191,36,.2);   background: rgba(251,191,36,.04); }
.emissao-alerta .emissao-txt { color: var(--status-warn); }
.emissao-critico { border-color: rgba(248,113,113,.25); background: rgba(248,113,113,.05); }
.emissao-critico .emissao-txt { color: var(--status-danger); }

/* ── BNDES BANNER ────────────────────────────────────────────────────────── */
.bndes-banner {
  background: linear-gradient(90deg, rgba(22,163,74,.12), rgba(var(--recesso-rgb),.1));
  border: 1px solid rgba(34,197,94,.35);
  border-radius: var(--r-sm);
  padding: .6rem .85rem;
  margin-top: .65rem;
  text-align: center;
}
.bndes-titulo {
  font-size: .75rem; font-weight: 900; color: var(--status-ok);
  letter-spacing: .05em; margin-bottom: .2rem;
}
.bndes-sub { font-size: .62rem; color: rgba(34,197,94,.75); }

/* ── PERDA AUTO BOX ─────────────────────────────────────────────────────── */
.perda-auto-box {
  display: flex; flex-direction: column; gap: .2rem;
  background: rgba(var(--recesso-rgb),.2);
  border: 1px dashed rgba(var(--wash-rgb),.12);
  border-radius: var(--r-sm);
  padding: .4rem .65rem;
  min-height: 46px;
}
.perda-auto-val  { font-size: .88rem; font-weight: 800; color: var(--rdc-text-light); }
.perda-auto-hint { font-size: .58rem; color: var(--rdc-text-muted); }

/* ── DESCARGA DE FUNDO ───────────────────────────────────────────────────── */
.descarga-tipo-sel { border-color: rgba(3,105,161,.4) !important; }
.descarga-sub-hdr {
  font-size: .65rem; font-weight: 900; letter-spacing: .07em;
  color: rgba(0,210,255,.7); text-transform: uppercase;
  padding: .4rem 0 0;
}
.descarga-result-box {
  display: flex; align-items: center; gap: .6rem;
  background: rgba(3,105,161,.08);
  border: 1px solid rgba(3,105,161,.25);
  border-radius: var(--r-sm);
  padding: .5rem .75rem;
  margin-top: .65rem;
}
.descarga-result-icon { font-size: 1.1rem; flex-shrink: 0; }
.descarga-formula-txt { font-size: .63rem; color: rgba(0,210,255,.8); line-height: 1.5; }
.descarga-kpis {
  display: grid; grid-template-columns: 1fr 1fr; gap: .65rem;
}
.descarga-kpi {
  background: rgba(var(--recesso-rgb),.2);
  border: 1px solid rgba(var(--wash-rgb),.06);
  border-radius: var(--r-sm);
  padding: .55rem .75rem;
  text-align: center;
}
.descarga-kpi-val  { font-size: 1.3rem; font-weight: 900; color: var(--rdc-cyan-txt); }
.descarga-kpi-base { color: var(--status-ok) !important; font-size: .85rem !important; }
.descarga-kpi-lbl  { font-size: .6rem; color: var(--rdc-text-muted); margin-top: .15rem; }
.descarga-sugestao {
  background: rgba(251,191,36,.05);
  border: 1px solid rgba(251,191,36,.18);
  border-radius: var(--r-sm);
  color: rgba(251,191,36,.8);
  font-size: .63rem; line-height: 1.5;
  padding: .45rem .75rem;
  margin-top: .65rem;
}
.descarga-sugestao strong { color: var(--status-warn); }

/* ── ENERGIA ELÉTRICA ────────────────────────────────────────────────────── */
.ee-pot-row { display: flex; align-items: center; gap: .5rem; }
.ee-pot-row input { flex: 1; min-width: 0; }
.ee-kw-display {
  font-size: .72rem; font-weight: 700; color: var(--rdc-cyan-txt);
  white-space: nowrap; background: rgba(0,210,255,.08);
  border: 1px solid rgba(0,210,255,.22); border-radius: 4px;
  padding: .22rem .5rem; line-height: 1;
}
.ee-resultados {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: .65rem; margin-top: .75rem;
}
.ee-kpi {
  background: rgba(37,99,235,.13);
  border: 1px solid rgba(59,130,246,.22);
  border-radius: var(--r-sm);
  padding: .65rem .75rem;
  text-align: center;
}
.ee-kpi-total {
  border-color: rgba(0,210,255,.3);
  background: rgba(0,210,255,.08);
}
.ee-kpi-val { font-size: 1.1rem; font-weight: 900; color: var(--rdc-text-pure); line-height: 1.1; }
.ee-kpi-total .ee-kpi-val { font-size: 1.05rem; color: var(--rdc-cyan-txt); }
.ee-kpi-lbl { font-size: .58rem; color: var(--rdc-text-muted); margin-top: .2rem; text-transform: uppercase; letter-spacing: .03em; }

/* ── AQ-01 — Extracted inline styles (M1 view) ──────────────────────────── */
.hidden { display: none; }
.mt-1   { margin-top: 1rem; }

.card-warning {
  padding: 1rem;
  background: rgba(255,107,53,.1);
  border-radius: 8px;
  border-left: 4px solid var(--rdc-orange);
}
.card-title { font-weight: 700; margin-bottom: .8rem; }

/* ── M1/G — Problemas Graves (tabela dinâmica) ────────────────────────── */
.btn-problema-grave {
  background: var(--rdc-orange); color: var(--rdc-text-pure);
  border: none; border-radius: var(--r-sm, 6px);
  padding: .5rem 1rem; font-size: .8rem; font-weight: 700;
  cursor: pointer; margin-bottom: .8rem;
  box-shadow: 0 0 12px rgba(255,107,53,.3);
}
.btn-problema-grave:hover { background: var(--rdc-orange-br); }

.tabela-problemas-graves {
  width: 100%; border-collapse: collapse; font-size: .8rem;
}
.tabela-problemas-graves th, .tabela-problemas-graves td {
  padding: .55rem .6rem; text-align: left;
  border-bottom: 1px solid var(--rdc-border);
}
.tabela-problemas-graves th { color: var(--rdc-text-muted); font-weight: 700; text-transform: uppercase; font-size: .68rem; }
.tabela-problemas-graves-vazio { color: var(--rdc-text-muted); font-size: .8rem; padding: .5rem 0; }
.tabela-problemas-graves-vazio.hidden { display: none; }

.btn-pg-acao {
  background: none; border: 1px solid var(--rdc-border); border-radius: 4px;
  color: var(--rdc-text-light); font-size: .7rem; padding: .25rem .5rem;
  cursor: pointer; margin-right: .3rem;
}
.btn-pg-acao:hover { border-color: var(--rdc-orange); color: var(--rdc-orange-txt); }
.btn-pg-acao.btn-pg-excluir:hover { border-color: var(--status-danger, #c62828); color: var(--status-danger, #c62828); }

.modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.6); /* scrim de modal — sempre escuro, nos dois temas, pra escurecer o que estiver atras */
  display: flex; align-items: center; justify-content: center;
  z-index: 1000;
}
.modal-overlay[hidden] { display: none; }
.modal-card {
  background: var(--rdc-bg-card); border: 1px solid var(--rdc-border);
  border-radius: var(--r, 10px); padding: 1.2rem; width: 90%; max-width: 480px;
  max-height: 85vh; overflow-y: auto;
}
.modal-card h4 { margin: 0 0 1rem; color: var(--rdc-text-pure); }
.modal-acoes { display: flex; justify-content: flex-end; gap: .6rem; margin-top: 1rem; }
.btn-modal-cancelar {
  background: none; border: 1px solid var(--rdc-border); border-radius: var(--r-sm, 6px);
  color: var(--rdc-text-light); padding: .5rem 1rem; font-size: .8rem; cursor: pointer;
}
.btn-modal-cancelar:hover { border-color: var(--rdc-orange); color: var(--rdc-orange-txt); }

.cnpj-existente-lista { list-style: none; margin: 0; padding: 0; }
.cnpj-existente-lista li {
  display: flex; justify-content: space-between; align-items: center; gap: .6rem;
  border: 1px solid var(--rdc-border); border-radius: var(--r-sm, 6px);
  padding: .5rem .7rem; margin-bottom: .5rem; font-size: .8rem; color: var(--rdc-text-light);
}
.cnpj-existente-lista li a { color: var(--rdc-orange-txt); white-space: nowrap; }

/* ── M1/F — Fotos da Caldeira (lista dinâmica) ──────────────────────────── */
.foto-caldeira-add {
  display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; margin-bottom: .5rem;
}
.foto-caldeira-add select { flex: 0 0 auto; }
.foto-caldeira-add input[type="file"] { flex: 1 1 auto; min-width: 12rem; }
.foto-caldeira-aviso {
  font-size: .78rem; color: var(--rdc-amber); margin: .3rem 0 0;
}
.foto-caldeira-vazio {
  font-size: .82rem; color: var(--rdc-text-muted); margin: .4rem 0 0;
}
.fotos-caldeira-grid {
  display: flex; flex-wrap: wrap; gap: .8rem; margin-top: .6rem;
}
.foto-caldeira-item {
  position: relative; width: 9rem;
  background: var(--rdc-bg-input); border: 1px solid var(--rdc-border);
  border-radius: 8px; padding: .5rem; text-align: center;
}
.foto-caldeira-item img {
  width: 100%; height: 6rem; object-fit: cover; border-radius: 6px; display: block;
}
.foto-caldeira-item-rotulo {
  display: block; font-size: .72rem; color: var(--rdc-text-light);
  margin-top: .4rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.foto-caldeira-remover {
  position: absolute; top: -.5rem; right: -.5rem;
  width: 1.5rem; height: 1.5rem; border-radius: 50%;
  background: var(--rdc-red); color: #fff; border: none;
  cursor: pointer; font-size: .75rem; line-height: 1;
}
.foto-caldeira-remover:hover { background: #a02020; }

.textarea-field {
  min-height: 60px; width: 100%;
  padding: .6rem; border: 1.5px solid var(--rdc-border);
  border-radius: 6px; font-family: inherit; font-size: .85rem;
}
.textarea-field-lg { min-height: 80px; }

.radio-group { display: flex; gap: 1rem; margin-top: .5rem; }
.radio-label  { display: flex; align-items: center; gap: .5rem; }

.display-info {
  padding: .8rem;
  background: rgba(96,165,250,.1);
  border-radius: 6px;
  border-left: 4px solid var(--status-info);
  font-weight: 700; font-size: 1.1rem; color: var(--status-info);
}
.display-sub { font-size: .75rem; color: var(--rdc-text-muted); margin-top: .3rem; }

.section-wood {
  background: rgba(146,96,10,.05);
  border-radius: 8px; padding: 1rem;
  border-left: 4px solid var(--rdc-amber);
}
.section-wood-title {
  grid-column: 1/-1; font-weight: 700;
  color: var(--rdc-amber); margin-bottom: .5rem;
}

.card-warning-fullcol {
  padding: .8rem;
  background: rgba(255,107,53,.1);
  border-radius: 6px;
  border-left: 4px solid var(--rdc-orange);
  grid-column: 1/-1;
}
.card-warning-title { font-weight: 700; color: var(--rdc-orange-txt); margin-bottom: .5rem; }
.card-body-text     { font-size: .85rem; color: var(--rdc-text-muted); line-height: 1.5; }
.card-body-text-mb  { font-size: .85rem; color: var(--rdc-text-muted); margin-bottom: .5rem; }

.field-input-inline {
  width: 100%; padding: .6rem;
  border: 1.5px solid var(--rdc-border); border-radius: 6px;
  font-family: inherit; font-size: .85rem;
}
/* Laranja da marca. Era ciano; os dois unicos usos — "+ Adicionar foto" (M1/F)
   e "Aplicar PCI" (M1/L) — sao acoes que o auditor dispara, e o PO pediu a cor
   da marca nos dois. Com so esses dois usos nao ha motivo para modificador. */
.btn-action {
  margin-top: .5rem; padding: .6rem 1rem;
  background: var(--rdc-orange); color: white;
  border: none; border-radius: 6px;
  font-weight: 700; cursor: pointer;
}
.btn-action:hover { filter: brightness(1.08); }

.stats-wrapper {
  background: rgba(255,107,53,.05);
  border-radius: 8px; padding: 1rem;
  border-left: 4px solid var(--rdc-orange);
  margin-top: 1rem;
}
.stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.stat-card-orange {
  padding: .8rem;
  background: rgba(255,107,53,.1);
  border-radius: 6px;
  border-left: 4px solid var(--rdc-orange);
}
.stat-label    { font-size: .75rem; color: var(--rdc-text-muted); margin-bottom: .3rem; }
.stat-val-orange { font-weight: 700; font-size: 1.2rem; color: var(--rdc-orange-txt); }

.section-title-navy { font-weight: 700; color: var(--rdc-fundo-website); margin-bottom: .8rem; }

.efic-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .8rem; }
.efic-btn-orange {
  padding: 1rem;
  background: rgba(255,107,53,.1);
  border: 2px solid var(--rdc-orange);
  border-radius: 6px; cursor: pointer;
  font-weight: 700; color: var(--rdc-orange-txt);
}
.efic-btn-orange.active { background: var(--rdc-orange); color: white; }
.efic-btn-green {
  padding: 1rem;
  background: rgba(34,197,94,.1);
  border: 2px solid var(--status-ok);
  border-radius: 6px; cursor: pointer;
  font-weight: 700; color: var(--status-ok);
}

.efic-slider-label { font-weight: 700; color: var(--rdc-fundo-website); margin-bottom: .5rem; }
.efic-slider {
  width: 100%; height: 8px; border-radius: 5px;
  background: linear-gradient(to right, var(--rdc-orange), var(--status-ok));
  outline: none; -webkit-appearance: none;
}
.slider-labels {
  display: flex; justify-content: space-between;
  align-items: center; margin-top: .8rem;
  /* position:relative + o valor absoluto: o numero acompanha a bolinha em vez
     de ficar parado no centro. Antes ele era o item do meio de um
     space-between, entao o slider podia marcar 94 com o "87%" imovel no
     centro — dois indicadores do mesmo dado discordando na mesma linha. */
  position: relative;
}
.slider-range-label { font-size: .75rem; color: var(--rdc-text-muted); }
.efic-current-val {
  font-weight: 700; font-size: 1.3rem; color: var(--rdc-orange-txt);
  position: absolute; top: 0;
  /* left vem do controller (_posicionarValorEficiencia) — depende do valor. */
  transform: translateX(-50%);
  white-space: nowrap; pointer-events: none;
}

.hint-center { text-align: center; padding: 2rem; }

/* ═══════════════════════════════════════════════════════════════════════════
   MÓDULO 10 — PAINEL DE CICLO DE VIDA DO ATIVO (PREMIUM)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Glass Card base ─────────────────────────────────────────────────────── */
.glass-card {
  background: rgba(var(--wash-rgb),0.03);
  border: 1px solid rgba(var(--wash-rgb),0.08);
  border-radius: 10px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* ── Layout raiz ─────────────────────────────────────────────────────────── */
.m10-painel {
  display: flex; flex-direction: column; gap: 1rem;
  padding: 1rem 1.1rem 1.5rem;
  background: var(--rdc-bg-deep);
}

/* ── Header band ─────────────────────────────────────────────────────────── */
.m10-header-band {
  display: flex; align-items: center; justify-content: space-between;
  padding: .75rem 1rem;
  background: rgba(255,107,53,.06);
  border: 1px solid rgba(255,107,53,.2);
  border-radius: 10px;
}
.m10-header-info { display: flex; align-items: center; gap: .85rem; }
.m10-header-info h2 { font-size: .95rem; font-weight: 800; color: var(--rdc-text-pure); }
.m10-header-info p  { font-size: .72rem; color: var(--rdc-orange-txt); margin-top: 2px; }

/* ── Modo badge ──────────────────────────────────────────────────────────── */
.m10-modo-badge {
  display: flex; align-items: center; gap: .4rem;
  font-size: .65rem; font-weight: 700; letter-spacing: .08em;
  padding: .3rem .75rem; border-radius: 20px;
}
.m10-modo-vis  { background: rgba(34,197,94,.12);  border: 1px solid rgba(34,197,94,.4);  color: var(--status-ok); }
.m10-modo-inst { background: rgba(255,107,53,.12); border: 1px solid rgba(255,107,53,.4); color: var(--rdc-orange-txt); }
.m10-dot-visual::before { content: '●'; font-size: .55rem; color: var(--status-ok); }

/* ── Gráfico ─────────────────────────────────────────────────────────────── */
.m10-chart-wrap { padding: 1rem; }
.m10-chart-title {
  font-size: .65rem; font-weight: 700; letter-spacing: .12em;
  color: var(--rdc-text-muted); margin-bottom: .6rem; text-align: center;
}
#m10-canvas { width: 100%; height: auto; display: block; border-radius: 6px; }

/* ── KPI cards ───────────────────────────────────────────────────────────── */
.m10-kpi-row { display: grid; grid-template-columns: repeat(3,1fr); gap: .75rem; }
.m10-kpi {
  padding: .85rem 1rem;
  display: flex; flex-direction: column; gap: .2rem;
  border-top: 3px solid rgba(var(--wash-rgb),.1);
  transition: border-color .3s;
}
.m10-kpi:first-child  { border-top-color: var(--status-warn); }
.m10-kpi-peak         { border-top-color: var(--rdc-orange); }
.m10-kpi-atual        { border-top-color: var(--rdc-orange); }
.m10-kpi-label { font-size: .6rem; font-weight: 700; letter-spacing: .1em; color: var(--rdc-text-muted); }
.m10-kpi-sub   { font-size: .62rem; color: var(--rdc-text-muted); }
.m10-kpi-val   { font-size: 1.3rem; font-weight: 900; color: var(--rdc-text-pure); margin-top: .1rem; }

/* ── Controles ───────────────────────────────────────────────────────────── */
.m10-controles-row { display: grid; grid-template-columns: 1fr 1.5fr 1.5fr; gap: .75rem; }
.m10-ctrl-group    { padding: .85rem 1rem; }
.m10-ctrl-label    { display: block; font-size: .6rem; font-weight: 700; letter-spacing: .1em; color: var(--rdc-text-muted); margin-bottom: .15rem; }
.m10-ctrl-hint     { font-size: .62rem; color: rgba(255,107,53,.7); margin-bottom: .4rem; }
.m10-select {
  width: 100%; background: var(--rdc-bg-input); border: 1px solid var(--rdc-border);
  color: var(--rdc-text-pure); font-size: .8rem; padding: .4rem .6rem;
  border-radius: var(--r-sm); outline: none; cursor: pointer;
}
.m10-select:focus { border-color: var(--rdc-orange); }
.m10-slider-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: .35rem; }
.m10-slider-min, .m10-slider-max { font-size: .62rem; color: var(--rdc-text-muted); }
.m10-slider-val { font-size: .72rem; font-weight: 700; color: var(--rdc-orange-txt); }
.m10-range {
  -webkit-appearance: none; appearance: none;
  width: 100%; height: 4px; border-radius: 2px;
  background: linear-gradient(to right, var(--rdc-orange) 0%, var(--rdc-border) 0%);
  outline: none; cursor: pointer; transition: background .15s;
}
.m10-range::-webkit-slider-thumb {
  -webkit-appearance: none; width: 14px; height: 14px;
  border-radius: 50%; background: var(--rdc-orange);
  border: 2px solid var(--rdc-bg-deep); cursor: pointer;
  box-shadow: var(--sh-sm);
}
.m10-range::-moz-range-thumb {
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--rdc-orange); border: 2px solid var(--rdc-bg-deep);
  cursor: pointer; box-shadow: var(--sh-sm);
}

/* ── Inputs auxiliares ───────────────────────────────────────────────────── */
.m10-inputs-row { display: grid; grid-template-columns: repeat(4,1fr); gap: .75rem; }
.m10-input-inline {}
.m10-badge-m1 {
  font-size: .55rem; padding: .1rem .4rem; border-radius: 8px;
  background: rgba(255,107,53,.12); color: var(--rdc-orange-txt);
  border: 1px solid rgba(255,107,53,.3); vertical-align: middle;
}
.m10-hint-inline { font-size: .62rem; color: var(--rdc-text-muted); }

/* ── Status bar ──────────────────────────────────────────────────────────── */
.m10-status-bar {
  display: flex; align-items: center; gap: 1rem;
  padding: .65rem 1rem; flex-wrap: wrap;
}
.m10-stat { display: flex; flex-direction: column; gap: 2px; min-width: 120px; flex: 1; }
.m10-stat-label { font-size: .58rem; font-weight: 600; letter-spacing: .07em; color: var(--rdc-text-muted); }
.m10-stat-val   { font-size: .8rem; font-weight: 700; color: var(--rdc-text-pure); }
.m10-origem-badge {
  display: inline-block; padding: .1rem .45rem; border-radius: 6px; font-size: .65rem;
  background: rgba(34,197,94,.1); color: var(--status-ok);
  border: 1px solid rgba(34,197,94,.3);
}

/* ── Tabela ──────────────────────────────────────────────────────────────── */
.m10-tabela-wrap  { padding: .85rem 1rem; }
.m10-tabela-title { font-size: .65rem; font-weight: 700; letter-spacing: .1em; color: var(--rdc-text-muted); margin-bottom: .6rem; }
.m10-tabela {
  width: 100%; border-collapse: collapse; font-size: .75rem;
}
.m10-tabela th {
  padding: .4rem .6rem; text-align: left;
  font-size: .6rem; font-weight: 700; letter-spacing: .08em;
  color: var(--rdc-text-muted); border-bottom: 1px solid var(--rdc-border);
}
.m10-tabela td {
  padding: .38rem .6rem; border-bottom: 1px solid rgba(var(--wash-rgb),.04);
  color: var(--rdc-text-light);
}
.m10-tabela td:first-child  { color: var(--rdc-text-muted); font-weight: 600; }
.m10-tabela td:nth-child(2) { color: var(--rdc-text-pure);  font-weight: 700; }
.m10-row-ativo td           { background: rgba(255,107,53,.08); color: var(--rdc-orange-txt) !important; }
.m10-fase-nota              { font-size: .68rem; color: var(--rdc-text-muted); }

/* ── Checkbox ────────────────────────────────────────────────────────────── */
.m10-chk-row    { padding: .4rem .2rem; }
.m10-chk-label  { display: flex; align-items: center; gap: .5rem; font-size: .72rem; color: var(--rdc-text-muted); cursor: pointer; }
.m10-chk-label input { accent-color: var(--rdc-orange); cursor: pointer; }

/* ── Nota técnica ────────────────────────────────────────────────────────── */
.m10-nota-tecnica { padding: .85rem 1rem; }
.m10-nota-title   { font-size: .68rem; font-weight: 700; color: var(--rdc-orange-txt); margin-bottom: .4rem; }
.m10-nota-tecnica p { font-size: .7rem; color: var(--rdc-text-muted); margin-bottom: .5rem; line-height: 1.5; }
.m10-fases-legenda { display: flex; flex-direction: column; gap: .25rem; margin-bottom: .5rem; }
.m10-fase-item  { display: flex; align-items: flex-start; gap: .4rem; font-size: .68rem; color: var(--rdc-text-muted); }
.m10-fase-dot   { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; margin-top: 3px; }
.m10-fase-range { font-weight: 700; color: var(--rdc-text-light); min-width: 90px; }
.m10-fase-texto { color: var(--rdc-text-muted); }
.m10-referencias { font-size: .66rem; color: var(--rdc-text-muted); border-top: 1px solid var(--rdc-border); padding-top: .4rem; margin-top: .35rem; line-height: 1.5; }
.m10-ref-tag    { font-size: .62rem; color: rgba(255,107,53,.6); margin-left: .25rem; }

.nav-admin-link {
  display: block; width: calc(100% - 1.5rem); margin: .5rem .75rem 0;
  padding: .4rem .5rem; font-size: .67rem; font-weight: 600;
  border: 1px solid var(--rdc-border); border-radius: 6px;
  background: transparent; color: var(--rdc-text-muted);
  cursor: pointer; transition: all .2s; letter-spacing: .04em;
  font-family: inherit; text-align: center; text-decoration: none;
  box-sizing: border-box;
}
.nav-admin-link:hover { border-color: var(--rdc-orange); color: var(--rdc-orange-txt); }

/* ── Módulo 5 — ISO 50001:2018 ───────────────────────────────────────────── */
/* Requisitos (Seção B) */
.m5-req-lista { display: flex; flex-direction: column; gap: .35rem; margin-bottom: 1rem; }
.m5-req-item {
  background: var(--rdc-bg-input); border: 1px solid var(--rdc-border);
  border-radius: var(--r-sm); padding: .5rem .75rem;
  transition: border-color .2s;
}
.m5-req-item:hover { border-color: var(--rdc-orange); }
.m5-req-label {
  display: flex; align-items: center; gap: .6rem; cursor: pointer;
  font-size: .82rem; font-weight: 600; color: var(--rdc-text-light);
}
.m5-req-chk { width: 14px; height: 14px; accent-color: var(--rdc-orange); cursor: pointer; flex-shrink: 0; }
.m5-req-num {
  background: var(--rdc-border); color: var(--rdc-text-muted);
  font-size: .65rem; font-weight: 700; padding: .1rem .35rem;
  border-radius: 3px; letter-spacing: .05em; flex-shrink: 0;
}
.m5-req-chk:checked ~ .m5-req-num { background: var(--rdc-orange); color: var(--rdc-text-pure); }
.m5-req-titulo { flex: 1; }
.m5-req-desc { display: block; font-size: .72rem; margin-top: .2rem; padding-left: 2rem; }
.m5-conformidade-resumo {
  display: flex; gap: 2rem; padding: .6rem 1rem;
  background: rgba(255,107,53,.08); border-radius: var(--r-sm);
  font-size: .8rem; color: var(--rdc-text-light);
}
.m5-conformidade-resumo strong { color: var(--rdc-orange-txt); }

/* Tabelas (Seções C e E) */
.m5-tabela {
  width: 100%; border-collapse: collapse; font-size: .78rem;
  color: var(--rdc-text-light);
}
.m5-tabela th {
  background: var(--rdc-bg-input); color: var(--rdc-text-muted);
  font-size: .65rem; font-weight: 700; letter-spacing: .08em;
  padding: .5rem .75rem; text-align: left; border-bottom: 1px solid var(--rdc-border);
}
.m5-tabela td {
  padding: .5rem .75rem; border-bottom: 1px solid rgba(30,42,68,.6);
  vertical-align: top;
}
.m5-tabela tr:last-child td { border-bottom: none; }
.m5-tabela tr:hover td { background: rgba(255,107,53,.04); }

/* Badges (status / prioridade) */
.m5-badge {
  display: inline-block; padding: .15rem .45rem;
  border-radius: 3px; font-size: .65rem; font-weight: 700; letter-spacing: .05em;
  background: var(--rdc-border); color: var(--rdc-text-muted);
}
.m5-badge-alerta { background: rgba(198,40,40,.2); color: var(--status-danger); }
.m5-badge-prio   { background: rgba(255,107,53,.2); color: var(--rdc-orange-txt); }

/* Oportunidades (Seção D) */
.m5-opp-lista { display: flex; flex-direction: column; gap: .6rem; }
.m5-opp-card {
  display: flex; gap: .75rem; align-items: flex-start;
  background: var(--rdc-bg-input); border: 1px solid var(--rdc-border);
  border-radius: var(--r-sm); padding: .65rem .85rem;
}
.m5-opp-num {
  width: 26px; height: 26px; flex-shrink: 0;
  background: var(--rdc-orange); color: var(--rdc-text-pure);
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-size: .7rem; font-weight: 900;
}
.m5-opp-body { flex: 1; display: flex; flex-direction: column; gap: .25rem; }
.m5-opp-titulo { font-size: .82rem; font-weight: 700; color: var(--rdc-text-pure); }
.m5-opp-metricas {
  display: flex; gap: 1.2rem; font-size: .75rem; color: var(--rdc-text-muted);
}
.m5-opp-metricas strong { color: var(--rdc-orange-txt); }

/* Botões de ação */
.m5-acoes-row { display: flex; gap: 1rem; margin-top: 1.5rem; align-items: center; }

.rp-card {
  background: var(--rdc-bg-card);
  border: 1px solid var(--rdc-border);
  border-radius: var(--r);
  padding: .75rem .85rem;
}
.rp-card-tit {
  font-size: .6rem; font-weight: 700; letter-spacing: .1em;
  color: var(--rdc-text-muted); text-transform: uppercase;
  margin-bottom: .5rem; border-bottom: 1px solid var(--rdc-border); padding-bottom: .35rem;
}
.rp-card-cols { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.rp-col-esq, .rp-col-dir { display: flex; flex-direction: column; gap: .3rem; }
.rp-eta-nom-val {
  font-size: 1.8rem; font-weight: 900; color: var(--rdc-cyan-txt); line-height: 1;
}
.rp-eta-real-val {
  font-size: 1.6rem; font-weight: 900; color: var(--rdc-orange-txt); line-height: 1;
}
.rp-desvio-val {
  font-size: 1.4rem; font-weight: 800; color: var(--status-danger); line-height: 1;
}
.rp-hint-sm { font-size: .62rem; color: var(--rdc-text-muted); margin-top: .15rem; }
.rp-ctx-tag {
  font-size: .64rem; color: var(--rdc-text-muted);
  background: rgba(var(--wash-rgb),.04);
  border-radius: 4px; padding: .15rem .4rem;
}
.rp-perdas-grid { display: flex; flex-direction: column; gap: .2rem; }
.rp-perda-item { display: flex; justify-content: space-between; align-items: center; font-size: .68rem; }
.rp-perda-item span { color: var(--rdc-text-muted); }
.rp-perda-item strong { color: var(--rdc-text-light); font-weight: 700; }
.rp-perda-dg strong { color: var(--status-warn); }
.rp-total-perdas { font-size: .68rem; color: var(--rdc-text-muted); margin-top: .25rem; }
.rp-total-perdas strong { color: var(--status-danger); font-weight: 800; }
.rp-bruta-item { display: flex; justify-content: space-between; font-size: .68rem; margin-bottom: .15rem; }
.rp-bruta-item span { color: var(--rdc-text-muted); }
.rp-bruta-item strong { color: var(--rdc-text-light); font-weight: 700; }
.rp-gap-val { color: var(--status-warn) !important; }
.rp-dir-badge {
  display: inline-block; font-size: .62rem; font-weight: 700;
  padding: .15rem .5rem; border-radius: 20px; margin-top: .35rem;
  background: rgba(var(--wash-rgb),.06); color: var(--rdc-text-muted); border: 1px solid var(--rdc-border);
}
.rp-dir-badge.ok { background: rgba(26,127,60,.2); color: var(--status-ok); border-color: var(--status-ok); }
.rp-dir-badge.nd { background: rgba(var(--wash-rgb),.04); color: var(--rdc-text-muted); }
.rp-classe-badge {
  display: block; font-size: 1rem; font-weight: 900; letter-spacing: .05em;
  color: var(--rdc-orange-txt); margin-bottom: .35rem;
}
.rp-classe-norma { font-size: .62rem; color: var(--rdc-text-muted); }
.rp-incert-mini { font-size: .65rem; color: var(--rdc-cyan-txt); margin-top: .35rem; }
.rp-custo-linha { display: flex; justify-content: space-between; font-size: .72rem; margin-bottom: .2rem; }
.rp-custo-linha span { color: var(--rdc-text-muted); }
.rp-custo-linha strong { color: var(--rdc-text-light); }
.rp-custo-total-linha {
  display: flex; justify-content: space-between; align-items: center;
  border-top: 1px solid var(--rdc-border); padding-top: .4rem; margin-top: .3rem;
  font-size: .72rem; font-weight: 700;
}
.rp-custo-total-linha span { color: var(--rdc-text-muted); }
.rp-custo-total-val { font-size: 1.1rem; font-weight: 900; color: var(--rdc-orange-txt); }
.rp-eco-val { font-size: 1.15rem; font-weight: 900; color: var(--status-ok); margin-bottom: .25rem; }
.rp-eco-detalhe { font-size: .62rem; color: var(--rdc-text-muted); }
.rp-enpi-val { font-size: 1.1rem; font-weight: 800; color: var(--rdc-cyan-txt); margin-bottom: .4rem; }
.rp-enpi-bar-wrap { margin-bottom: .4rem; }
.rp-enpi-bar-track { height: 5px; background: rgba(var(--wash-rgb),.08); border-radius: 3px; }
.rp-enpi-bar-fill { height: 5px; background: var(--rdc-cyan); border-radius: 3px; transition: width .4s; }
.rp-enpi-linhas { display: flex; flex-direction: column; gap: .2rem; font-size: .64rem; color: var(--rdc-text-muted); }
.rp-enpi-linhas strong { color: var(--rdc-text-light); }
.rp-iapws-tag { font-size: .62rem; color: rgba(0,210,255,.6); margin-top: .35rem; }
.conama-mini-grid { display: flex; flex-direction: column; gap: .35rem; }
.conama-mini-item { display: flex; align-items: center; gap: .4rem; font-size: .68rem; }
.conama-mini-item span:first-child { color: var(--rdc-text-muted); flex: 1; }
.conama-mini-item strong { color: var(--rdc-text-light); font-weight: 700; min-width: 55px; text-align: right; }
.conama-mini-badge {
  font-size: .6rem; font-weight: 700; padding: .1rem .35rem;
  border-radius: 10px; background: rgba(var(--wash-rgb),.06); color: var(--rdc-text-muted);
}
.rp-vpl-fg label { font-size: .68rem; color: var(--rdc-text-muted); margin-bottom: .25rem; display: block; }
.rp-vpl-inputs { display: flex; flex-direction: column; gap: .5rem; }
.rp-vpl-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }

/* ── Slider M2 ────────────────────────────────────────────────────── */
.m2-slider-wrap { display: flex; flex-direction: row; align-items: center; gap: .75rem; margin: .5rem 0; }
.m2-slider {
  flex: 1; height: 6px;
  -webkit-appearance: none; appearance: none;
  background: linear-gradient(to right, var(--rdc-orange) 0%, var(--rdc-orange) var(--val, 0%), rgba(var(--wash-rgb),.1) var(--val, 0%));
  border-radius: 3px; cursor: pointer; outline: none;
}
.m2-slider::-webkit-slider-thumb {
  -webkit-appearance: none; width: 18px; height: 18px;
  border-radius: 50%; background: var(--rdc-orange);
  border: 2px solid #fff; box-shadow: 0 0 6px rgba(255,107,53,.5); cursor: pointer;
}
.m2-slider::-moz-range-thumb {
  width: 18px; height: 18px; border-radius: 50%; background: var(--rdc-orange);
  border: 2px solid #fff; cursor: pointer;
}
.m2-slider-badge {
  flex-shrink: 0;
  background: var(--rdc-orange); color: #fff;
  font-size: .85rem; font-weight: 800;
  padding: .25rem .85rem; border-radius: 8px;
  min-width: 64px; text-align: center;
}

/* ── Origem Toggle ────────────────────────────────────────────────── */
.origem-row { display: flex; align-items: center; gap: .5rem; margin-top: .4rem; flex-wrap: wrap; }
.origem-label { font-size: .6rem; font-weight: 700; color: var(--rdc-text-muted); letter-spacing: .08em; }
.origem-btn {
  font-size: .65rem; font-weight: 600; padding: .2rem .65rem;
  border: 1px solid var(--rdc-border); border-radius: 20px;
  background: transparent; color: var(--rdc-text-muted);
  cursor: pointer; transition: all .2s; white-space: nowrap;
}
.origem-btn.ativo {
  background: rgba(0,210,255,.12); border-color: var(--rdc-cyan);
  color: var(--rdc-cyan-txt); font-weight: 700;
}
.origem-btn:hover { border-color: var(--rdc-cyan); color: var(--rdc-cyan-txt); }

/* ── Ctx M1 banner ────────────────────────────────────────────────── */
.ctx-banner {
  background: rgba(0,210,255,.06); border: 1px solid rgba(0,210,255,.15);
  border-radius: var(--r-sm); padding: .5rem .85rem;
  display: flex; align-items: center; gap: .6rem; flex-wrap: wrap;
}
.ctx-titulo { font-size: .62rem; font-weight: 700; color: var(--rdc-cyan-txt); letter-spacing: .1em; white-space: nowrap; }
.ctx-tags { font-size: .68rem; color: var(--rdc-text-muted); }

/* ── Condensado section ───────────────────────────────────────────── */
.cond-layout { display: grid; grid-template-columns: 1fr 1.2fr; gap: 1rem; align-items: start; }
.cond-slider-col, .cond-temp-col { display: flex; flex-direction: column; gap: .5rem; }
.cond-label { font-size: .68rem; font-weight: 700; color: var(--rdc-text-muted); letter-spacing: .08em; text-transform: uppercase; }

/* ── Água section ─────────────────────────────────────────────────── */
.agua-bloco { margin-bottom: .75rem; }
.agua-bloco-label {
  font-size: .62rem; font-weight: 700; color: var(--rdc-text-muted);
  letter-spacing: .1em; text-transform: uppercase; margin-bottom: .35rem;
}
.agua-eco-aviso {
  background: rgba(0,210,255,.08); border: 1px solid rgba(0,210,255,.2);
  border-radius: 6px; padding: .5rem .75rem;
  font-size: .7rem; color: var(--rdc-cyan-txt); margin-top: .4rem; line-height: 1.5;
}
.secao-sub { background: rgba(var(--wash-rgb),.03); border: 1px solid var(--rdc-border); border-radius: 6px; padding: .75rem; }
.secao-sub-hdr { font-size: .68rem; font-weight: 700; color: var(--rdc-cyan-txt); margin-bottom: .5rem; }
.ph-resultado-row { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .5rem; }
.ph-badge { font-size: .65rem; font-weight: 700; padding: .2rem .55rem; border-radius: 20px; background: rgba(var(--wash-rgb),.06); color: var(--rdc-text-muted); }
.agua-ciclos-row { font-size: .68rem; color: var(--rdc-text-muted); margin-top: .4rem; line-height: 1.6; }
.agua-ciclos-row strong { color: var(--rdc-text-light); }
.agua-efic-badge { display: inline-block; font-size: .62rem; font-weight: 700; padding: .1rem .4rem; border-radius: 10px; background: rgba(255,107,53,.15); color: var(--rdc-orange-txt); border: 1px solid rgba(255,107,53,.3); margin-left: .4rem; }
.dosagem-titulo { font-size: .62rem; font-weight: 700; color: var(--rdc-text-muted); letter-spacing: .1em; text-transform: uppercase; margin-top: .6rem; margin-bottom: .35rem; }
.dosagem-grid { display: flex; gap: .75rem; flex-wrap: wrap; }
.dosagem-item { display: flex; flex-direction: column; align-items: center; background: rgba(var(--wash-rgb),.04); border-radius: 6px; padding: .4rem .75rem; }
.dosagem-item strong { font-size: .85rem; font-weight: 800; color: var(--rdc-cyan-txt); }
.dosagem-item span { font-size: .6rem; color: var(--rdc-text-muted); margin-top: .1rem; }
.dosagem-impacto { display: flex; gap: .75rem; flex-wrap: wrap; margin-top: .5rem; }
.dosagem-imp-item { display: flex; flex-direction: column; align-items: center; background: rgba(var(--wash-rgb),.04); border-radius: 6px; padding: .35rem .65rem; }
.dosagem-imp-item strong { font-size: .8rem; font-weight: 800; color: var(--rdc-text-light); }
.dosagem-imp-item span { font-size: .6rem; color: var(--rdc-text-muted); }
.dosagem-imp-neg strong { color: var(--status-danger) !important; }
.m2-select {
  width: 100%; background: var(--rdc-bg-input); border: 1px solid var(--rdc-border);
  border-radius: var(--r-sm); padding: .45rem .65rem;
  color: var(--rdc-text-light); font-size: .78rem; cursor: pointer;
}
.m2-select:focus { outline: none; border-color: var(--rdc-orange); }

/* ── Fuligem ──────────────────────────────────────────────────────── */
.fuligem-wrap { display: flex; flex-direction: column; gap: .5rem; }
.fuligem-label { font-size: .68rem; font-weight: 700; color: var(--rdc-text-muted); text-transform: uppercase; letter-spacing: .08em; }
.fuligem-select { width: 100%; }
.fuligem-msg { font-size: .7rem; color: var(--rdc-text-muted); padding: .35rem .5rem; background: rgba(var(--wash-rgb),.04); border-radius: 6px; min-height: 28px; }

/* ── Temperatura (t_gases) ────────────────────────────────────────── */
.tgas-input-row { display: flex; align-items: flex-start; gap: .75rem; margin-bottom: .5rem; }
.tgas-input-wrap { flex: 1; }
.tgas-display-box { min-width: 80px; }
.tgas-val-grande { font-size: 1.6rem; font-weight: 900; color: var(--rdc-orange-txt); line-height: 1; }
.tgas-barra-wrap { margin: .4rem 0; }
.tgas-barra-track { height: 8px; background: rgba(var(--wash-rgb),.06); border-radius: 4px; }
.tgas-barra-fill { height: 8px; border-radius: 4px; background: linear-gradient(to right, var(--status-ok), var(--rdc-orange), var(--status-danger)); transition: width .4s; }
.tgas-alert { font-size: .7rem; color: var(--rdc-text-muted); padding: .3rem .5rem; border-radius: 4px; min-height: 26px; }
.tgas-alert.alerta-ok { background: rgba(26,127,60,.15); color: var(--status-ok); }
.tgas-alert.alerta-warn { background: rgba(234,179,8,.12); color: var(--status-warn); }
.tgas-alert.alerta-crit { background: rgba(239,68,68,.12); color: var(--status-danger); }
.tgas-sat-alerta { font-size: .68rem; color: var(--status-warn); background: rgba(234,179,8,.1); border-radius: 4px; padding: .25rem .5rem; margin-top: .25rem; }
.hidden { display: none !important; }

/* ── Ponto de Orvalho ─────────────────────────────────────────────── */
.orvalho-bloco { background: rgba(0,210,255,.05); border: 1px solid rgba(0,210,255,.15); border-radius: 6px; padding: .6rem .85rem; }
.orvalho-hdr { font-size: .65rem; font-weight: 700; color: var(--rdc-cyan-txt); margin-bottom: .5rem; }
.orvalho-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; }
.orvalho-item { display: flex; flex-direction: column; gap: .15rem; }
.orvalho-item span { font-size: .6rem; color: var(--rdc-text-muted); }
.orvalho-val { font-size: .9rem; font-weight: 800; color: var(--rdc-text-light); }
.orvalho-status-badge { font-size: .65rem; font-weight: 700; padding: .15rem .45rem; border-radius: 10px; background: rgba(var(--wash-rgb),.06); }
.orvalho-iapws { font-size: .65rem; color: var(--rdc-cyan-txt); }

/* ── Análise de Combustão / Fumaça ────────────────────────────────── */
.cor-fumaca-wrap { margin-bottom: .5rem; }
.cor-fumaca-label { font-size: .65rem; font-weight: 700; color: var(--rdc-text-muted); text-transform: uppercase; letter-spacing: .08em; margin-bottom: .5rem; display: block; }
.fuma-btns-row { display: flex; gap: .4rem; flex-wrap: wrap; }
.fuma-btn {
  display: flex; flex-direction: column; align-items: center; gap: .15rem;
  padding: .4rem .6rem; border-radius: 8px;
  border: 2px solid var(--rdc-border); background: rgba(var(--wash-rgb),.04);
  cursor: pointer; transition: all .2s; min-width: 110px;
}
.fuma-btn:hover { border-color: rgba(255,107,53,.5); }
.fuma-btn.fuma-ativa { border-color: var(--rdc-orange); background: rgba(255,107,53,.12); }
.fuma-emoji { font-size: 1.1rem; }
/* Amostra de cor da fumaça (escala Ringelmann) — substitui o emoji; borda
   para a branca e a cinza-clara não sumirem sobre o card. */
.fuma-amostra {
  display: block; width: 22px; height: 22px; border-radius: 50%;
  border: 1px solid rgba(var(--wash-rgb),.25); box-shadow: inset 0 0 0 1px rgba(0,0,0,.08);
}
.emissao-ic { display: inline-flex; flex: none; margin-top: 1px; }
.emissao-ok .emissao-ic { color: var(--status-ok); }
.emissao-alerta .emissao-ic { color: var(--status-warn); }
.fuma-nome { font-size: .68rem; font-weight: 700; color: var(--rdc-text-light); }
.fuma-vals { font-size: .6rem; color: var(--rdc-text-muted); }
.tem-analisador-row { margin-top: .6rem; display: flex; align-items: flex-start; gap: .5rem; }
.chk-wrap { display: flex; align-items: flex-start; gap: .5rem; cursor: pointer; }
.chk-txt { font-size: .7rem; font-weight: 700; color: var(--rdc-text-light); line-height: 1.4; }
.analisador-campo { transition: opacity .3s; }

/* ── Siegert Formula Box ──────────────────────────────────────────── */
.formula-siegert-box {
  background: rgba(0,210,255,.05); border: 1px solid rgba(0,210,255,.12);
  border-radius: 6px; padding: .55rem .85rem;
  display: flex; flex-direction: column; gap: .3rem;
}
.formula-tex { font-size: .7rem; color: var(--rdc-cyan-txt); font-style: italic; }
.formula-coefs { font-size: .65rem; color: var(--rdc-text-muted); }
.formula-result { font-size: .7rem; color: var(--rdc-text-light); }
.formula-result strong { font-size: .85rem; font-weight: 800; color: var(--rdc-orange-txt); }

/* ── CONAMA block ─────────────────────────────────────────────────── */
.conama-bloco { background: rgba(234,179,8,.06); border: 1px solid rgba(234,179,8,.2); border-radius: 6px; padding: .65rem .85rem; }
.conama-hdr { font-size: .65rem; font-weight: 700; color: var(--status-warn); margin-bottom: .5rem; }
.conama-items-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.conama-item { display: flex; flex-direction: column; gap: .15rem; }
.conama-item-lbl { font-size: .6rem; color: var(--rdc-text-muted); font-weight: 700; text-transform: uppercase; }
.conama-item-val { font-size: .85rem; font-weight: 800; color: var(--rdc-text-light); }
.conama-item-lim { font-size: .58rem; color: var(--rdc-text-muted); line-height: 1.4; }
.conama-item-status { font-size: .65rem; color: var(--rdc-text-muted); margin-top: .2rem; }

/* ── O2 / CO2 result badges ───────────────────────────────────────── */
.o2-status-badge {
  display: inline-block; font-size: .65rem; font-weight: 700;
  padding: .15rem .5rem; border-radius: 10px; margin-top: .25rem;
  background: rgba(var(--wash-rgb),.06); color: var(--rdc-text-muted);
}
.co2-resultado-bloco label { font-size: .7rem; color: var(--rdc-text-muted); font-weight: 700; display: block; margin-bottom: .3rem; }
.co2-resultado-row { display: flex; align-items: baseline; gap: .4rem; }
.co2-val { font-size: 1.1rem; font-weight: 900; color: var(--rdc-orange-txt); }
.co2-tipo { font-size: .68rem; color: var(--rdc-text-muted); }
.incert-mini-row { display: flex; gap: 1rem; margin-top: .35rem; flex-wrap: wrap; }
.incert-mini-item { display: flex; align-items: center; gap: .35rem; font-size: .68rem; }
.incert-mini-item span { color: var(--rdc-text-muted); }
.incert-mini-item input { width: 60px; }

/* ── Incerteza section ────────────────────────────────────────────── */
.incert-aviso { font-size: .68rem; color: var(--rdc-cyan-txt); background: rgba(0,210,255,.06); border-radius: 6px; padding: .35rem .65rem; margin-bottom: .5rem; }
.incert-resultado-row { margin-top: .75rem; display: flex; justify-content: center; }
.incert-u-box { text-align: center; background: rgba(0,210,255,.08); border: 1px solid rgba(0,210,255,.2); border-radius: 8px; padding: .6rem 1.2rem; }
.incert-u-val { font-size: 1.1rem; font-weight: 900; color: var(--rdc-cyan-txt); }
.incert-u-sub { font-size: .62rem; color: var(--rdc-text-muted); margin-top: .2rem; }
.incert-outra-txt {
  width: 100%; background: var(--rdc-bg-input); border: 1px solid var(--rdc-border);
  border-radius: 6px; padding: .4rem .6rem; color: var(--rdc-text-light);
  font-size: .72rem; resize: vertical; min-height: 50px; font-family: inherit;
}

/* ── Cinzas ───────────────────────────────────────────────────────── */
.cinzas-aviso { padding: .5rem .85rem; font-size: .7rem; color: var(--rdc-text-muted); background: rgba(var(--wash-rgb),.03); border-radius: 6px; }
.cinzas-aviso span { color: var(--status-warn); }

/* ── UF Operação / Perdas Ocultas ─────────────────────────────────── */
.secao-sub.uf-bloco { margin-top: .5rem; }
.perdas-ocultas-hdr { font-size: .65rem; font-weight: 700; color: var(--status-warn); margin-bottom: .5rem; }
.uf-select-wrap { margin-bottom: .5rem; }

/* ── Configuração Física / Descarga de Fundo ──────────────────────── */
.conf-fisica-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }

/* ── Resultado box sm (usado em vários módulos) ───────────────────── */
.resultado-box-sm {
  background: rgba(var(--wash-rgb),.04); border: 1px solid var(--rdc-border);
  border-radius: 6px; padding: .4rem .65rem; min-height: 36px;
  display: flex; align-items: center; gap: .4rem;
}
.resultado-val-sm { font-size: .85rem; font-weight: 700; color: var(--rdc-text-light); }

/* ── Seção sub-header ─────────────────────────────────────────────── */
.mt-secao { margin-top: .75rem; }
.span-3 { grid-column: span 3; }
.grid-4 { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; }  /* padronizado em 2 */

/* ── VPL right panel ──────────────────────────────────────────────── */
.rp-vpl-eta-box { display: flex; flex-direction: column; gap: .3rem; margin-top: .5rem; }
.rp-vpl-kpi { display: flex; justify-content: space-between; font-size: .68rem; }
.rp-vpl-kpi span { color: var(--rdc-text-muted); }
.rp-vpl-kpi strong { color: var(--rdc-text-light); }
.rp-eta-bruta-linha { font-size: .65rem; color: var(--rdc-text-muted); margin-top: .2rem; }
.rp-eta-bruta-linha span { color: var(--status-warn); font-weight: 700; }

/* ── Unidade badge sm ─────────────────────────────────────────────── */
.unidade-badge-sm {
  display: inline-block; font-size: .62rem; font-weight: 700;
  padding: .1rem .35rem; border-radius: 4px;
  background: rgba(var(--wash-rgb),.06); color: var(--rdc-text-muted); margin-left: .25rem;
}

/* ── O2 Siegert warning ───────────────────────────────────────────── */
.o2-siegert-aviso { font-size: .65rem; color: var(--status-warn); margin-top: .3rem; display: block; }

/* preview.html only — scoped via .preview-mode */
.preview-mode .m2-layout { grid-template-columns: 1fr !important; }
.preview-mode .m2-rpainel { display: none !important; }

@media (max-width: 1100px) {
  .orvalho-grid { grid-template-columns: repeat(2, 1fr); }
  .conama-items-row { grid-template-columns: 1fr 1fr; }
}

/* ── Hint inline ─────────────────────────────────────────────────── */
.hint-inline {
  font-size: .6rem; font-weight: 600; color: var(--rdc-text-muted);
  background: rgba(var(--wash-rgb),.05); border-radius: 4px; padding: .05rem .35rem;
  letter-spacing: .04em; margin-left: .3rem;
}

/* ── Section Header Banner ────────────────────────────────────────── */
.secao-header-banner {
  background: linear-gradient(135deg, rgba(255,107,53,.12), rgba(255,107,53,.05));
  border: 1px solid rgba(255,107,53,.25); border-radius: 6px;
  padding: .5rem .85rem; margin-bottom: .75rem;
  display: flex; flex-direction: column; gap: .15rem;
}
.secao-banner-txt { font-size: .72rem; font-weight: 800; color: var(--rdc-orange-txt); letter-spacing: .06em; }
.secao-banner-sub { font-size: .62rem; color: var(--rdc-text-muted); }

/* ── Section letter variants ──────────────────────────────────────── */
/* .cf-letra/.pc-letra/.df-letra/.ee-letra removidas junto com o bloco
   equivalente da linha ~2159 — ver SRS-UI-FORM-VISUAL-STANDARD-001 item 4.5.
   .h-letra fica: não tem uso em nenhum view.js hoje. */
.h-letra  { background: rgba(96,165,250,.15); color: var(--status-info); border-color: rgba(96,165,250,.3); }

/* ── CO₂ block (Perdas Ocultas) ───────────────────────────────────── */
.co2-bloco { margin-bottom: .75rem; }
.co2-label { font-size: .68rem; font-weight: 700; color: var(--rdc-text-muted); text-transform: uppercase; letter-spacing: .08em; margin-bottom: .4rem; }
.co2-auto-tag { font-size: .6rem; font-weight: 700; color: var(--rdc-cyan-txt); background: rgba(0,210,255,.1); border-radius: 4px; padding: .05rem .3rem; margin-left: .3rem; }
.co2-row { display: flex; align-items: flex-start; gap: .75rem; flex-wrap: wrap; }
.co2-input-fg { flex: 1; min-width: 100px; }
.co2-ref-bloco { background: rgba(0,210,255,.04); border: 1px solid rgba(0,210,255,.1); border-radius: 6px; padding: .5rem .75rem; margin-top: .5rem; }
.co2-ref-hdr { font-size: .62rem; font-weight: 700; color: var(--rdc-cyan-txt); margin-bottom: .35rem; }
.co2-ref-lista { display: flex; flex-direction: column; gap: .2rem; font-size: .65rem; color: var(--rdc-text-muted); line-height: 1.5; }
.co2-ref-lista strong { color: var(--rdc-text-light); }

/* ── Perdas Calc grid ─────────────────────────────────────────────── */
.perdas-calc-grid { display: flex; flex-direction: column; gap: .5rem; }
.perda-calc-item { background: rgba(var(--wash-rgb),.03); border: 1px solid var(--rdc-border); border-radius: 6px; padding: .5rem .75rem; }
.perda-q3 { border-left: 3px solid var(--status-warn); }
.perda-calc-lbl { font-size: .62rem; font-weight: 700; color: var(--rdc-text-muted); letter-spacing: .08em; text-transform: uppercase; margin-bottom: .25rem; }
.perda-calc-val { font-size: .95rem; font-weight: 800; color: var(--rdc-text-light); margin-bottom: .15rem; }
.perda-calc-sub { font-size: .65rem; color: var(--rdc-text-muted); }

/* ── Emissões grid ────────────────────────────────────────────────── */
.emissoes-grid { display: flex; flex-direction: column; gap: .35rem; }
.emissao-item { display: flex; align-items: flex-start; gap: .5rem; font-size: .7rem; padding: .35rem .5rem; background: rgba(var(--wash-rgb),.03); border-radius: 6px; }
.emissao-txt { color: var(--rdc-text-muted); line-height: 1.5; flex: 1; }
.emissao-co-chamine { border-left: 3px solid rgba(234,179,8,.5); }
.emissoes-grid .emissao-item strong { color: var(--rdc-text-light); }

/* ── BNDES banner ─────────────────────────────────────────────────── */
.bndes-banner {
  background: linear-gradient(135deg, rgba(26,127,60,.15), rgba(26,127,60,.08));
  border: 1px solid rgba(26,127,60,.35); border-radius: 8px;
  padding: .65rem .9rem; margin-top: .75rem;
}
.bndes-titulo { font-size: .78rem; font-weight: 800; color: var(--status-ok); margin-bottom: .2rem; }
.bndes-sub { font-size: .65rem; color: var(--rdc-text-muted); line-height: 1.5; }

/* ── Perda Auto box ───────────────────────────────────────────────── */
.perda-auto-box {
  background: rgba(var(--wash-rgb),.04); border: 1px solid var(--rdc-border);
  border-radius: 6px; padding: .45rem .75rem; min-height: 36px;
}
.perda-auto-val { font-size: .9rem; font-weight: 800; color: var(--rdc-text-light); display: block; }
.perda-auto-hint { font-size: .62rem; color: var(--rdc-text-muted); display: block; margin-top: .15rem; }
.span-2 { grid-column: span 2; }

/* ── Descarga de Fundo ────────────────────────────────────────────── */
.descarga-sub-hdr {
  font-size: .65rem; font-weight: 700; color: var(--rdc-cyan-txt);
  letter-spacing: .08em; text-transform: uppercase; margin: .6rem 0 .4rem;
  border-left: 3px solid var(--rdc-cyan); padding-left: .5rem;
}
.descarga-result-box {
  display: flex; align-items: flex-start; gap: .5rem;
  background: rgba(0,210,255,.05); border: 1px solid rgba(0,210,255,.15);
  border-radius: 6px; padding: .55rem .75rem; margin-top: .75rem;
}
.descarga-result-icon { font-size: .85rem; }
.descarga-formula-txt { font-size: .68rem; color: var(--rdc-cyan-txt); line-height: 1.5; }
.descarga-kpis { display: flex; gap: .75rem; flex-wrap: wrap; }
.descarga-kpi { flex: 1; min-width: 100px; background: rgba(var(--wash-rgb),.04); border: 1px solid var(--rdc-border); border-radius: 6px; padding: .5rem .75rem; text-align: center; }
.descarga-kpi-val { font-size: 1rem; font-weight: 800; color: var(--rdc-text-light); }
.descarga-kpi-lbl { font-size: .6rem; color: var(--rdc-text-muted); margin-top: .15rem; }
.descarga-kpi-base { color: var(--rdc-orange-txt) !important; }
.descarga-sugestao {
  font-size: .68rem; color: var(--rdc-text-muted); line-height: 1.6;
  background: rgba(var(--wash-rgb),.03); border-radius: 6px; padding: .5rem .75rem;
  margin-top: .75rem; border-left: 3px solid rgba(234,179,8,.4);
}
.descarga-sugestao strong { color: var(--status-warn); }

/* ── VPL Panel items ──────────────────────────────────────────────── */
.rp-vpl-grid { display: flex; flex-direction: column; gap: .35rem; margin-top: .5rem; }
.rp-vpl-item { display: flex; justify-content: space-between; align-items: center; font-size: .72rem; padding: .3rem 0; border-bottom: 1px solid rgba(var(--wash-rgb),.05); }
.rp-vpl-item span { color: var(--rdc-text-muted); }
.rp-vpl-item strong { color: var(--rdc-text-light); font-weight: 700; }
.rp-vpl-payback strong { color: var(--rdc-orange-txt) !important; font-size: .82rem; }
.rp-aace-nota { font-size: .58rem; color: rgba(148,163,184,.5); margin-top: .5rem; line-height: 1.4; }

/* ── Btn Gerar Cálculos ───────────────────────────────────────────── */
.btn-gerar-calculos {
  width: 100%; padding: .6rem 1rem; margin-top: .5rem;
  background: linear-gradient(135deg, var(--rdc-orange), #d44000);
  color: var(--rdc-text-pure); font-size: .8rem; font-weight: 800; letter-spacing: .08em;
  border: none; border-radius: var(--r); cursor: pointer;
  box-shadow: 0 4px 14px rgba(255,107,53,.35); transition: all .2s;
}
.btn-gerar-calculos:hover { background: linear-gradient(135deg, #ff7b30, var(--rdc-orange)); transform: translateY(-1px); }
.btn-gerar-calculos:active { transform: translateY(0); }

/* ── Comparação Caldeiras ─────────────────────────────────────────── */
.rp-card-comp .rp-comp-inputs { display: flex; flex-direction: column; gap: .5rem; margin-bottom: .5rem; }
.rp-comp-tabela { overflow-x: auto; }
.comp-table { width: 100%; border-collapse: collapse; font-size: .65rem; }
.comp-table th { background: rgba(var(--wash-rgb),.06); color: var(--rdc-text-muted); font-weight: 700; padding: .3rem .5rem; text-align: left; border-bottom: 1px solid var(--rdc-border); }
.comp-table td { padding: .3rem .5rem; color: var(--rdc-text-light); border-bottom: 1px solid rgba(var(--wash-rgb),.04); }
.comp-col-opt { color: var(--rdc-cyan-txt) !important; }
.comp-aguarde { text-align: center; color: var(--rdc-text-muted); font-style: italic; padding: .75rem !important; }

/* ══════════════════════════════════════════════════════════════════════
   M2 — EQUIPAMENTOS AUXILIARES
   ══════════════════════════════════════════════════════════════════════ */
.equip-intro {
  font-size: .68rem; color: var(--rdc-text-muted); font-style: italic;
  background: rgba(var(--wash-rgb),.03); border-radius: 6px; padding: .4rem .75rem;
  margin-bottom: .65rem; line-height: 1.5;
}
.equip-item {
  display: flex; align-items: flex-start; gap: .75rem;
  background: rgba(var(--wash-rgb),.03); border: 1px solid var(--rdc-border);
  border-radius: 8px; padding: .65rem .85rem; margin-bottom: .45rem;
  transition: border-color .2s;
}
.equip-item:hover { border-color: rgba(255,107,53,.3); }
.equip-item.ativo { border-color: rgba(255,107,53,.5); background: rgba(255,107,53,.06); }
.equip-chk { flex-shrink: 0; width: 16px; height: 16px; margin-top: 2px; cursor: pointer; accent-color: var(--rdc-orange); }
.equip-body { flex: 1; min-width: 0; }
.equip-nome-row { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-bottom: .2rem; }
.equip-nome { font-size: .72rem; font-weight: 800; color: var(--rdc-text-light); letter-spacing: .04em; text-transform: uppercase; }
.efic-badge {
  font-size: .62rem; font-weight: 800; padding: .1rem .45rem; border-radius: 10px;
  background: rgba(255,107,53,.2); color: var(--rdc-orange-txt); border: 1px solid rgba(255,107,53,.4);
}
.efic-badge.cyan { background: rgba(0,210,255,.15); color: var(--rdc-cyan-txt); border-color: rgba(0,210,255,.35); }
.efic-badge.green { background: rgba(34,197,94,.2); color: var(--status-ok); border-color: rgba(34,197,94,.4); }
.equip-desc { font-size: .67rem; color: var(--rdc-text-muted); line-height: 1.45; margin-bottom: .25rem; }
.equip-hint {
  font-size: .62rem; color: rgba(148,163,184,.7); line-height: 1.4;
  background: rgba(var(--wash-rgb),.02); border-left: 2px solid rgba(234,179,8,.3);
  padding: .2rem .5rem; border-radius: 0 4px 4px 0; font-style: italic;
}
.equip-ganho-bar {
  margin-top: .65rem; background: rgba(var(--wash-rgb),.04);
  border: 1px solid var(--rdc-border); border-radius: 6px;
  padding: .5rem .85rem; display: flex; align-items: center; gap: .75rem;
}
.equip-ganho-label { font-size: .68rem; color: var(--rdc-text-muted); }
.equip-ganho-val { font-size: 1rem; font-weight: 900; color: var(--status-ok); margin-left: auto; }
.equip-ganho-track { flex: 1; height: 6px; background: rgba(var(--wash-rgb),.08); border-radius: 3px; }
.equip-ganho-fill { height: 6px; background: var(--status-ok); border-radius: 3px; transition: width .4s; min-width: 2px; }

/* ══════════════════════════════════════════════════════════════════════
   M2 — INSPEÇÃO VISUAL DE CAMPO
   ══════════════════════════════════════════════════════════════════════ */
.insp-descricao {
  font-size: .68rem; color: var(--rdc-text-muted); line-height: 1.5;
  background: rgba(var(--wash-rgb),.03); border-radius: 6px; padding: .4rem .75rem;
  margin-bottom: .75rem;
}
.insp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.insp-bloco {
  background: rgba(var(--wash-rgb),.03); border: 1px solid var(--rdc-border);
  border-radius: 8px; padding: .7rem .85rem;
}
.insp-bloco-hdr {
  font-size: .65rem; font-weight: 800; color: var(--rdc-orange-txt);
  letter-spacing: .06em; margin-bottom: .5rem; padding-bottom: .35rem;
  border-bottom: 1px solid var(--rdc-border); line-height: 1.4;
}
.insp-bloco-hdr.purga { color: var(--status-danger); }
.insp-result-sel-wrap { margin-bottom: .5rem; }
.insp-sel-label { font-size: .6rem; font-weight: 700; color: var(--rdc-text-muted); text-transform: uppercase; letter-spacing: .08em; margin-bottom: .3rem; display: block; }
.insp-tiragem-wrap { margin-top: .5rem; }
.insp-tiragem-hdr { font-size: .65rem; font-weight: 700; color: var(--rdc-text-muted); margin-bottom: .4rem; }
.insp-tiragem-hdr strong { color: var(--rdc-orange-txt); }
.insp-slider-scale { display: flex; justify-content: space-between; font-size: .58rem; color: rgba(148,163,184,.6); margin-top: .15rem; }
.insp-purga-chk-row { display: flex; align-items: flex-start; gap: .5rem; padding: .5rem 0; }
.insp-purga-nome { font-size: .72rem; font-weight: 800; color: var(--rdc-text-light); text-transform: uppercase; letter-spacing: .04em; margin-bottom: .2rem; }
.insp-purga-desc { font-size: .65rem; color: var(--rdc-text-muted); line-height: 1.45; margin-bottom: .3rem; }
.insp-purga-penal { font-size: .65rem; color: var(--status-danger); font-weight: 700; margin-bottom: .4rem; }
.insp-modo-badge {
  display: inline-block; font-size: .65rem; font-weight: 800;
  padding: .2rem .65rem; border-radius: 20px;
  background: rgba(34,197,94,.15); color: var(--status-ok); border: 1px solid rgba(34,197,94,.3);
}
.insp-modo-badge.alerta { background: rgba(255,107,107,.15); color: var(--status-danger); border-color: rgba(255,107,107,.3); }
.insp-modo-desc { font-size: .62rem; color: var(--rdc-text-muted); margin-top: .2rem; }
.insp-modelo3 { margin-top: .75rem; }
.insp-modelo3-hdr { font-size: .65rem; font-weight: 800; color: var(--rdc-text-muted); letter-spacing: .06em; margin-bottom: .3rem; }
.insp-modelo3-nota { font-size: .62rem; color: rgba(148,163,184,.6); font-style: italic; margin-bottom: .5rem; line-height: 1.4; }
.insp-modelo3-movidos { font-size: .65rem; color: var(--rdc-text-muted); background: rgba(var(--wash-rgb),.03); border-radius: 6px; padding: .4rem .65rem; margin-bottom: .5rem; line-height: 1.5; }
.insp-visual-lbl { font-size: .62rem; font-weight: 700; color: var(--rdc-text-muted); text-transform: uppercase; letter-spacing: .08em; margin-bottom: .35rem; }
.insp-visual-box {
  background: rgba(var(--wash-rgb),.04); border: 1px solid var(--rdc-border);
  border-radius: 6px; padding: .5rem .75rem; min-height: 38px;
}
.insp-visual-val { font-size: .85rem; font-weight: 800; color: var(--rdc-orange-txt); }
.insp-visual-detalhe { font-size: .62rem; color: var(--rdc-text-muted); margin-top: .2rem; line-height: 1.4; }
.insp-anomalia-ok {
  display: flex; align-items: center; gap: .4rem; font-size: .7rem; font-weight: 700;
  color: var(--status-ok); background: rgba(34,197,94,.1); border: 1px solid rgba(34,197,94,.25);
  border-radius: 6px; padding: .4rem .75rem; margin-top: .5rem;
}

/* ══════════════════════════════════════════════════════════════════════
   M2 — ACESSÓRIOS & INSTRUMENTAÇÃO
   ══════════════════════════════════════════════════════════════════════ */
.acess-intro {
  font-size: .68rem; color: var(--rdc-text-muted); font-style: italic;
  background: rgba(var(--wash-rgb),.03); border-radius: 6px; padding: .4rem .75rem;
  margin-bottom: .65rem; line-height: 1.5;
}
.acess-grupo { margin-bottom: .65rem; }
.acess-grupo-hdr {
  font-size: .6rem; font-weight: 800; letter-spacing: .12em; color: var(--rdc-text-muted);
  text-transform: uppercase; border-bottom: 1px solid var(--rdc-border);
  padding-bottom: .3rem; margin-bottom: .45rem;
}
.acess-item {
  display: flex; align-items: flex-start; gap: .6rem;
  padding: .45rem .65rem; border-radius: 6px;
  background: rgba(var(--wash-rgb),.03); border: 1px solid var(--rdc-border);
  margin-bottom: .3rem; transition: border-color .2s;
}
.acess-item:hover { border-color: rgba(255,107,53,.3); }
.acess-item.ativo { border-color: rgba(255,107,53,.4); background: rgba(255,107,53,.05); }
.acess-chk { flex-shrink: 0; margin-top: 2px; accent-color: var(--rdc-orange); }
.acess-body { flex: 1; min-width: 0; }
.acess-nome { font-size: .7rem; font-weight: 800; color: var(--rdc-text-light); text-transform: uppercase; letter-spacing: .04em; margin-bottom: .1rem; }
.acess-desc { font-size: .63rem; color: var(--rdc-text-muted); line-height: 1.4; }
.acess-aviso { font-size: .62rem; color: var(--status-warn); font-style: italic; margin-top: .2rem; }
.acess-req { font-size: .62rem; color: var(--rdc-cyan-txt); font-style: italic; margin-top: .2rem; }
.acess-med-radio { display: flex; gap: .5rem; margin-top: .35rem; flex-wrap: wrap; }
.acess-radio-btn {
  display: flex; align-items: center; gap: .35rem; font-size: .65rem;
  cursor: pointer; padding: .2rem .5rem; border-radius: 20px;
  border: 1px solid var(--rdc-border); color: var(--rdc-text-muted);
  background: transparent; transition: all .2s;
}
.acess-radio-btn.ativo {
  border-color: var(--rdc-cyan); color: var(--rdc-cyan-txt);
  background: rgba(0,210,255,.1); font-weight: 700;
}

@media (max-width: 900px) {
  .insp-grid { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════════════════
   PAINEL KPI GLOBAL — FIXO À DIREITA — TODOS OS MÓDULOS
   ══════════════════════════════════════════════════════════════════════ */
.kpi-panel-global {
  position: fixed;
  top: var(--header-h);
  bottom: var(--footer-h);
  right: 0;
  width: var(--kpi-w);
  background: var(--rdc-fundo-website);
  border-left: 2px solid var(--rdc-border);
  display: flex;
  flex-direction: column;
  gap: .4rem;
  padding: .65rem .7rem;
  overflow-y: auto;
  z-index: 50;
  scrollbar-width: thin;
  scrollbar-color: var(--rdc-border) transparent;
}
.kpi-panel-global::-webkit-scrollbar { width: 4px; }
.kpi-panel-global::-webkit-scrollbar-track { background: transparent; }
.kpi-panel-global::-webkit-scrollbar-thumb { background: var(--rdc-border); border-radius: 2px; }

/* KPI Cards */
.kpi-g-card {
  background: var(--rdc-bg-card);
  border: 1px solid var(--rdc-border);
  border-radius: var(--r-sm);
  padding: .55rem .7rem;
}
.kpi-g-lbl {
  display: flex; align-items: center; gap: .35rem;
  font-size: .58rem; font-weight: 700; letter-spacing: .1em;
  color: var(--rdc-text-muted); text-transform: uppercase; margin-bottom: .3rem;
}
/* Laranja só no ícone: identifica o KPI sem competir com o valor, que já
   tem cor própria por significado (desvio em vermelho, real em laranja). */
.kpi-g-lbl .ic, .kl-comp-titulo .ic { color: var(--rdc-orange-txt); }
.kpi-g-val-nom  { font-size: 2.4rem; font-weight: 900; color: var(--rdc-cyan-txt); line-height: 1; }
.kpi-g-val-dev  { font-size: 2rem;   font-weight: 900; color: var(--status-danger); line-height: 1; }
.kpi-g-val-real { font-size: 2rem;   font-weight: 900; color: var(--rdc-orange-txt); line-height: 1; }
.kpi-g-sub { font-size: .6rem; color: var(--rdc-text-muted); margin-top: .2rem; line-height: 1.4; }

/* Classe Card */
.kpi-g-classe-card { border-left: 3px solid var(--rdc-orange); }
.kpi-g-classe-card.classe-a { border-left-color: var(--status-ok); }
.kpi-g-classe-card.classe-b { border-left-color: var(--status-ok); }
.kpi-g-classe-card.classe-c { border-left-color: var(--status-warn); }
.kpi-g-classe-card.classe-d { border-left-color: var(--rdc-orange); }
.kpi-g-classe-card.classe-e { border-left-color: var(--status-danger); }
.kpi-g-classe-nome { font-size: .95rem; font-weight: 900; color: var(--rdc-orange-txt); letter-spacing: .06em; }
.kpi-g-classe-norma { font-size: .58rem; color: var(--rdc-text-muted); margin-top: .1rem; }
.kpi-g-ide-row {
  font-size: .63rem; color: var(--rdc-text-muted); margin-top: .35rem;
  background: rgba(var(--wash-rgb),.04); border-radius: 4px; padding: .2rem .45rem; line-height: 1.4;
}
.kpi-g-ide-row strong { color: var(--status-warn); }

/* Custo de Vapor */
.kpi-g-custo-hdr { font-size: .6rem; font-weight: 800; color: var(--rdc-text-muted); letter-spacing: .1em; text-transform: uppercase; margin-bottom: .4rem; }
.kpi-g-custo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .25rem .5rem; margin-bottom: .45rem; }
.kpi-g-custo-item { display: flex; flex-direction: column; gap: .05rem; }
.kpi-g-custo-item span { font-size: .58rem; color: var(--rdc-text-muted); }
.kpi-g-custo-item strong { font-size: .72rem; font-weight: 700; color: var(--rdc-text-light); }
.kpi-g-custo-total-hdr {
  background: var(--rdc-fundo-website); border-top: 1px solid var(--rdc-border); border-bottom: 1px solid var(--rdc-border);
  margin: .35rem -.7rem; padding: .3rem .7rem;
  font-size: .6rem; font-weight: 800; color: var(--rdc-text-muted); letter-spacing: .08em;
}
.kpi-g-custo-total-val { font-size: 1.35rem; font-weight: 900; color: var(--rdc-orange-txt); margin: .3rem 0 .1rem; }
.kpi-g-custo-total-sub { font-size: .55rem; color: rgba(148,163,184,.5); line-height: 1.4; }

/* Economia */
.kpi-g-eco-val { font-size: 1.2rem; font-weight: 900; color: var(--status-ok); }
.kpi-g-eco-sub { font-size: .6rem; color: var(--rdc-text-muted); margin-top: .2rem; line-height: 1.45; }
.kpi-g-eco-sub strong { color: var(--rdc-text-light); }
.kpi-g-eco-manut { display: flex; align-items: center; gap: .3rem; font-size: .6rem; color: var(--status-ok); margin-top: .35rem; }

/* Bloco restrito a admin (presets). Sem o !important, o `display` das classes
   .preset-bar/.kpi-preset-bar vence o [hidden] do navegador e o bloco aparece
   para qualquer usuário. */
[data-so-admin][hidden] { display: none !important; }

/* Preset bar (kpi-panel-global) — visível em todos os módulos, só para admin */
.kpi-preset-bar {
  padding: .3rem .5rem .25rem;
  border-top: 1px solid rgba(var(--wash-rgb),.06);
  border-bottom: 1px solid rgba(var(--wash-rgb),.06);
  display: block;
}
.kpi-preset-label {
  font-size: .55rem; font-weight: 700; letter-spacing: .08em;
  color: var(--rdc-text-muted); text-transform: uppercase; margin-bottom: .25rem;
}
.kpi-preset-btns { display: flex; gap: .2rem; }
.kpi-preset-btn {
  flex: 1; font-size: .58rem; font-weight: 700; padding: .28rem .1rem;
  background: rgba(var(--wash-rgb),.05); border: 1px solid rgba(var(--wash-rgb),.1);
  border-radius: .2rem; color: var(--rdc-text-muted); cursor: pointer;
  font-family: inherit; text-transform: uppercase; letter-spacing: .04em;
  transition: background .15s, color .15s, border-color .15s;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.kpi-preset-btn:hover { background: rgba(255,107,53,.18); border-color: rgba(255,107,53,.45); color: var(--rdc-orange-txt); }
.kpi-preset-btn.ativo { background: rgba(255,107,53,.25); border-color: var(--rdc-orange); color: var(--rdc-text-pure); }

/* GERAR CÁLCULOS btn */
.btn-gerar-global {
  width: 100%; padding: .55rem .75rem; margin: .1rem 0;
  background: linear-gradient(135deg, var(--rdc-orange), #b83a00);
  color: var(--rdc-text-pure); font-size: .8rem; font-weight: 800; letter-spacing: .08em;
  border: none; border-radius: var(--r-sm); cursor: pointer;
  box-shadow: 0 3px 12px rgba(255,107,53,.4); transition: all .2s; flex-shrink: 0;
}
.btn-gerar-global:hover { background: linear-gradient(135deg, #ff7030, var(--rdc-orange)); transform: translateY(-1px); }
.btn-gerar-global:active { transform: translateY(0); }

/* ICI Row */
.kpi-g-ici-row {
  display: flex; align-items: flex-start; gap: .4rem; font-size: .62rem;
  color: var(--rdc-text-muted); background: rgba(var(--wash-rgb),.03);
  border-radius: 4px; padding: .35rem .5rem;
}
.kpi-g-ici-bar-wrap { height: 4px; background: rgba(var(--wash-rgb),.06); border-radius: 2px; margin-top: .25rem; }
.kpi-g-ici-bar-fill { height: 4px; background: var(--rdc-orange); border-radius: 2px; transition: width .4s; }
.kpi-g-ici-pct { font-size: .72rem; font-weight: 800; color: var(--rdc-orange-txt); margin-left: auto; white-space: nowrap; }
.kpi-g-ici-desc { font-size: .58rem; color: rgba(148,163,184,.5); margin-top: .2rem; line-height: 1.35; }

/* Action buttons */
.kpi-g-actions { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: .3rem; }
.kpi-g-act-btn {
  padding: .35rem .25rem; font-size: .6rem; font-weight: 700;
  background: rgba(var(--wash-rgb),.05); border: 1px solid var(--rdc-border);
  border-radius: 4px; color: var(--rdc-text-muted); cursor: pointer;
  transition: all .2s; text-align: center; display: flex; flex-direction: column;
  align-items: center; gap: .15rem;
}
.kpi-g-act-btn:hover { border-color: var(--rdc-orange); color: var(--rdc-text-light); }
.kpi-g-act-icone { font-size: .85rem; }
.kpi-g-comparar-btn {
  width: 100%; padding: .4rem; font-size: .65rem; font-weight: 700;
  background: rgba(var(--wash-rgb),.04); border: 1px solid var(--rdc-border);
  border-radius: 4px; color: var(--rdc-text-muted); cursor: pointer; transition: all .2s;
}
.kpi-g-comparar-btn:hover { border-color: var(--rdc-cyan); color: var(--rdc-cyan-txt); }
.kpi-g-comparar-btn.kl-comp-ativo {
  border-color: var(--rdc-cyan); color: var(--rdc-cyan-txt);
  background: rgba(34,211,238,.06);
}

/* ── Painel Comparador Lateral ───────────────────────────────────────────── */
.kl-comp-painel {
  margin-top: .5rem; padding: .6rem .65rem;
  background: rgba(var(--wash-rgb),.02);
  border: 1px solid var(--rdc-border); border-radius: .35rem;
}
.kl-comp-titulo {
  display: flex; align-items: center; gap: .35rem;
  font-size: .65rem; font-weight: 800; color: var(--rdc-orange-txt);
  text-transform: uppercase; letter-spacing: .04em; margin-bottom: .2rem;
}
.kl-comp-hint {
  font-size: .55rem; color: var(--rdc-text-muted); margin-bottom: .5rem; line-height: 1.4;
}

/* ── Seção C — Slider de T_gases ─────────────────────────────────────────── */
.cond-tgas-wrap { margin-bottom: .9rem; }
.cond-slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  border-radius: 3px;
  background: linear-gradient(to right,
    var(--rdc-orange) 0%,
    var(--rdc-orange) var(--slider-pct, 40%),
    rgba(var(--wash-rgb),.15) var(--slider-pct, 40%));
  outline: none;
  cursor: pointer;
  margin: .6rem 0 .4rem;
}
.cond-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--rdc-orange);
  border: 2px solid #fff;
  box-shadow: 0 0 6px rgba(255,107,53,.55);
  cursor: pointer;
}
.cond-slider::-moz-range-thumb {
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--rdc-orange);
  border: 2px solid #fff;
  cursor: pointer;
}
.cond-tgas-badge-row { display: flex; margin: .25rem 0 .4rem; }
.cond-tgas-badge {
  display: inline-block;
  background: var(--rdc-orange);
  color: #fff;
  font-size: .85rem;
  font-weight: 800;
  padding: .25rem .85rem;
  border-radius: 8px;
  min-width: 64px;
  text-align: center;
}
.tgas-alert {
  font-size: .72rem;
  padding: .35rem .6rem;
  border-radius: 5px;
  margin-top: .3rem;
  min-height: 1.6rem;
}
.tgas-alert.alerta {
  background: rgba(234,179,8,.12);
  border: 1px solid rgba(234,179,8,.45);
  color: var(--status-warn);
}
.tgas-alert.ok {
  background: rgba(34,197,94,.08);
  border: 1px solid rgba(34,197,94,.3);
  color: var(--status-ok);
}

/* ── Seção M — Medidores de Campo (sub-blocos) ───────────────────────────── */
.med-bloco {
  border: 1px solid rgba(var(--wash-rgb),.08);
  border-left: 3px solid var(--rdc-orange);
  border-radius: 6px;
  margin-bottom: 1rem;
  overflow: hidden;
}
.med-bloco-hdr {
  background: rgba(var(--wash-rgb),.06);
  color: var(--rdc-text-base);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  padding: .55rem .85rem;
  border-bottom: 1px solid rgba(var(--wash-rgb),.07);
}
.med-bloco-body { padding: .8rem; }

/* ── Helpers de label ────────────────────────────────────────────────────── */
.label-sub   { font-size: .65rem; color: var(--rdc-text-muted); margin-left: .3rem; font-weight: 400; }
.opcional-tag { font-size: .62rem; color: var(--rdc-text-muted); margin-left: .25rem; font-style: italic; }
.hint-link   { font-size: .68rem; color: var(--rdc-cyan-txt); margin-top: .2rem; display: block; }

/* ── SEÇÃO C — Configuração Física + Perdas Calculadas: bloco único ─────── */
#secao-conf-fisica {
  border-bottom: none !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
#secao-perdas-calc {
  border-top: none !important;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  margin-top: 0 !important;
}
.perdas-sub-hdr {
  background: rgba(255,107,53,.12);
  border-top: 1px solid rgba(255,107,53,.3);
  color: var(--rdc-text-light);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .07em;
  padding: .55rem 1rem;
}

/* ═══════════════════════════════════════════════════════════════════════
   MÓDULO 4 — Análise de Custo por Tipo de Combustível
   ═══════════════════════════════════════════════════════════════════════ */

.m4-info-box {
  background: rgba(0,210,255,.07);
  border: 1px solid rgba(0,210,255,.25);
  border-radius: 6px;
  padding: .7rem 1rem;
  font-size: .72rem;
  color: var(--rdc-cyan-txt);
  line-height: 1.5;
}
.m4-info-box strong { color: var(--rdc-text-pure); }

.m4-precos-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: .75rem;
}

.m4-comparacao-area {
  background: rgba(var(--wash-rgb),.02);
  border: 1px solid var(--rdc-border);
  border-radius: 6px;
  min-height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.m4-comparacao-placeholder {
  font-size: .72rem;
  color: var(--rdc-text-muted);
}

.m4-rodape-hint {
  font-size: .62rem;
  color: var(--rdc-text-muted);
  line-height: 1.55;
}

/* ═══════════════════════════════════════════════════════════════════════
   MÓDULO 5 — ISO 50001 / Confronto Benchmark
   ═══════════════════════════════════════════════════════════════════════ */

.m5-card {
  background: var(--rdc-bg-card);
  border: 1px solid var(--rdc-border);
  border-left: 3px solid var(--rdc-orange);
  border-radius: 8px;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.m5-card-header {
  font-size: .68rem;
  font-weight: 800;
  color: var(--rdc-text-muted);
  letter-spacing: .12em;
  text-transform: uppercase;
  padding-bottom: .4rem;
  border-bottom: 1px solid var(--rdc-border);
}
.m5-val-big {
  font-size: 2.4rem;
  font-weight: 900;
  line-height: 1;
  text-align: center;
}
.m5-val-unit {
  font-size: .68rem;
  color: var(--rdc-text-muted);
  text-align: center;
}
.m5-bar-wrap { margin: .3rem 0; }
.m5-bar-track {
  height: 8px;
  background: rgba(var(--wash-rgb),.06);
  border-radius: 4px;
  position: relative;
}
.m5-bar-fill {
  height: 100%;
  border-radius: 4px;
  transition: width .5s ease;
}
.m5-bar-red    { background: var(--status-danger); }
.m5-bar-orange { background: var(--rdc-orange); }
.m5-bar-marker {
  position: absolute;
  right: 0;
  top: -3px;
  width: 2px;
  height: 14px;
  background: rgba(var(--wash-rgb),.3);
  border-radius: 1px;
}
.m5-bar-marker-bench {
  position: absolute;
  top: -3px;
  width: 2px;
  height: 14px;
  background: var(--status-danger);
  border-radius: 1px;
}
.m5-delta {
  font-size: .72rem;
  font-weight: 700;
  text-align: center;
}
.m5-params {
  font-size: .6rem;
  color: var(--rdc-text-muted);
  text-align: center;
  line-height: 1.5;
}
.m5-kg-ton {
  font-size: .68rem;
  color: var(--rdc-text-muted);
  text-align: center;
  font-weight: 700;
}
.m5-benchmark-box {
  background: rgba(var(--wash-rgb),.03);
  border: 1px solid var(--rdc-border);
  border-radius: 6px;
  padding: .75rem 1rem;
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  font-size: .72rem;
  color: var(--rdc-text-light);
  margin-top: .5rem;
}
.m5-benchmark-box strong { color: var(--rdc-text-pure); font-size: .78rem; }

/* ═══════════════════════════════════════════════════════════════════════
   MÓDULO 6 — Conformidade Ambiental CONAMA 382/06
   ═══════════════════════════════════════════════════════════════════════ */

.m6c-info-bar {
  background: rgba(var(--wash-rgb),.03);
  border: 1px solid var(--rdc-border);
  border-radius: 6px;
  padding: .6rem 1rem;
  font-size: .68rem;
  color: var(--rdc-text-muted);
  margin-bottom: .75rem;
}

.m6c-secao {
  background: var(--rdc-bg-card);
  border: 1px solid var(--rdc-border);
  border-radius: 8px;
  padding: 1rem;
  margin-bottom: .75rem;
}
.m6c-secao-titulo {
  font-size: .62rem;
  font-weight: 800;
  color: var(--rdc-text-muted);
  letter-spacing: .1em;
  text-transform: uppercase;
  margin-bottom: .75rem;
}
.m6c-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
}
.m6c-fg { display: flex; flex-direction: column; gap: .3rem; }
.m6c-fg-label {
  font-size: .62rem;
  font-weight: 700;
  color: var(--rdc-text-muted);
  letter-spacing: .07em;
  text-transform: uppercase;
}
.m6c-fg-hint { font-size: .6rem; color: var(--rdc-text-muted); line-height: 1.4; }
.m6c-input {
  background: var(--rdc-bg-input);
  border: 1px solid var(--rdc-border);
  border-radius: 5px;
  color: var(--rdc-text-pure);
  font-size: .8rem;
  padding: .45rem .7rem;
  width: 100%;
  box-sizing: border-box;
}
.m6c-input:focus { outline: none; border-color: var(--rdc-cyan); }
.m6c-opc  { color: var(--rdc-text-muted); font-weight: 400; }
.m6c-obrig { color: var(--rdc-orange-txt); }

.m6c-co2-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-bottom: .75rem;
}
.m6c-co2-card {
  background: var(--rdc-bg-input);
  border: 1px solid var(--rdc-border);
  border-radius: 8px;
  padding: 1.2rem 1rem;
  text-align: center;
}
.m6c-co2-lbl {
  font-size: .6rem;
  font-weight: 700;
  color: var(--rdc-text-muted);
  letter-spacing: .1em;
  text-transform: uppercase;
  margin-bottom: .4rem;
}
.m6c-co2-val {
  font-size: 2rem;
  font-weight: 900;
  color: var(--status-ok);
  line-height: 1;
}
.m6c-co2-unit {
  font-size: .65rem;
  color: var(--rdc-text-muted);
  margin-top: .3rem;
}

.m6c-formula-box {
  background: rgba(34,197,94,.07);
  border: 1px solid rgba(34,197,94,.2);
  border-radius: 6px;
  padding: .6rem .9rem;
  font-size: .67rem;
  color: var(--status-ok);
  line-height: 1.5;
}
.m6c-formula-box strong { color: var(--rdc-text-pure); }

.m6c-retrofit-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1rem;
  align-items: start;
}
.m6c-retrofit-fg { display: flex; flex-direction: column; gap: .3rem; }
.m6c-input-wide {
  background: var(--rdc-bg-input);
  border: 1px solid var(--rdc-border);
  border-radius: 5px;
  color: var(--rdc-text-pure);
  font-size: .8rem;
  padding: .45rem .7rem;
  width: 100%;
  box-sizing: border-box;
}
.m6c-input-wide:focus { outline: none; border-color: var(--rdc-cyan); }

.m6c-retrofit-cards {
  display: flex;
  gap: .5rem;
}
.m6c-mini-card {
  background: var(--rdc-bg-input);
  border: 1px solid var(--rdc-border);
  border-radius: 6px;
  padding: .6rem .75rem;
  text-align: center;
  min-width: 90px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .25rem;
}
.m6c-mini-lbl { font-size: .58rem; color: var(--rdc-text-muted); line-height: 1.3; }
.m6c-mini-bar { width: 32px; height: 3px; border-radius: 2px; }
.m6c-mini-val { font-size: .85rem; font-weight: 800; color: var(--rdc-text-pure); }
.m6c-mini-unit { font-size: .58rem; color: var(--rdc-text-muted); }

.m6c-tabela {
  width: 100%;
  border-collapse: collapse;
  font-size: .72rem;
  margin-bottom: .75rem;
}
.m6c-tabela thead tr {
  background: rgba(34,197,94,.12);
}
.m6c-tabela th {
  text-align: left;
  padding: .5rem .75rem;
  font-size: .62rem;
  font-weight: 800;
  color: var(--status-ok);
  letter-spacing: .05em;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(34,197,94,.2);
}
.m6c-tabela td {
  padding: .5rem .75rem;
  color: var(--rdc-text-light);
  border-bottom: 1px solid var(--rdc-border);
}
.m6c-ok     { color: var(--status-ok); font-weight: 700; }
.m6c-critico { color: var(--status-danger); font-weight: 700; }

.m6c-status-bar {
  border-radius: 6px;
  padding: .7rem 1rem;
  text-align: center;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .05em;
}
.m6c-status-ok   { background: rgba(34,197,94,.1); border: 1px solid rgba(34,197,94,.3); color: var(--status-ok); }
.m6c-status-erro { background: rgba(255,107,107,.1); border: 1px solid rgba(255,107,107,.3); color: var(--status-danger); }

.m6c-textarea {
  width: 100%;
  box-sizing: border-box;
  background: var(--rdc-bg-input);
  border: 1px solid var(--rdc-border);
  border-radius: 6px;
  color: var(--rdc-text-muted);
  font-family: monospace;
  font-size: .68rem;
  padding: .75rem;
  line-height: 1.6;
  resize: none;
  margin-bottom: .6rem;
}
.m6c-btn-bndes {
  background: var(--rdc-cyan);
  border: none;
  border-radius: 6px;
  color: var(--rdc-bg-deep);
  cursor: pointer;
  font-size: .72rem;
  font-weight: 800;
  padding: .55rem 1rem;
  transition: opacity .2s;
}
.m6c-btn-bndes:hover { opacity: .85; }

/* ══════════════════════════════════════════════════════════════════════════
   M9 — GESTÃO DE RELATÓRIOS E INTEGRIDADE
   ══════════════════════════════════════════════════════════════════════════ */

/* Metadados */
.meta-ids-row { display: flex; gap: .75rem; flex-wrap: wrap; margin-top: .75rem; padding: .6rem .8rem; background: rgba(var(--recesso-rgb),.2); border-radius: var(--r-sm); }
.meta-id-item { display: flex; flex-direction: column; gap: .15rem; }
.meta-id-lbl  { font-size: .58rem; font-weight: 700; color: var(--rdc-text-muted); text-transform: uppercase; letter-spacing: .05em; }
.meta-id-val  { font-size: .78rem; font-weight: 700; color: var(--rdc-cyan-txt); font-family: monospace; }

/* RAG Score */
.rag-painel { display: flex; gap: 1.2rem; align-items: flex-start; margin-top: .75rem; }
.rag-semaforo-wrap { display: flex; flex-direction: column; align-items: center; gap: .3rem; min-width: 110px; padding: .8rem; background: var(--panel-recesso); border-radius: var(--r-md); }
.rag-semaforo-titulo { font-size: .58rem; font-weight: 700; color: var(--rdc-text-muted); letter-spacing: .05em; }
.rag-semaforo { font-size: 2rem; line-height: 1; }
.rag-score-val { font-size: 1.4rem; font-weight: 900; color: var(--rdc-text-pure); }
.rag-score-sub { font-size: .6rem; color: var(--rdc-text-muted); }
.rag-detalhe { flex: 1; display: flex; flex-direction: column; gap: .4rem; }
.rag-detalhe-item { display: flex; justify-content: space-between; align-items: baseline; font-size: .72rem; border-bottom: 1px solid rgba(var(--wash-rgb),.04); padding-bottom: .25rem; }
.rag-detalhe-item span { color: var(--rdc-text-muted); }
.rag-detalhe-item strong { color: var(--rdc-text-light); font-weight: 700; }
.rag-rec strong { color: var(--rdc-orange-txt) !important; }
.rag-scores-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .4rem; margin-top: .3rem; }
.rag-sub-item { display: flex; flex-direction: column; gap: .1rem; font-size: .65rem; padding: .35rem .45rem; background: rgba(var(--recesso-rgb),.2); border-radius: 4px; }
.rag-sub-item span { color: var(--rdc-text-muted); }
.rag-sub-item strong { color: var(--rdc-text-pure); font-weight: 800; }

/* Letras de seção M9 */
.meta-letra, .rag-letra, .vr-letra, .end-letra, .cert-letra, .hash-letra, .audit-letra, .rel-letra { font-size: 1.1rem; }

/* Vida Residual */
.vr-resultado-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: .6rem; }
.vr-kpi { background: var(--rdc-bg-card); border: 1px solid var(--rdc-border); border-radius: var(--r-sm); padding: .65rem .75rem; display: flex; flex-direction: column; gap: .2rem; }
.vr-kpi-val { font-size: 1.05rem; font-weight: 900; color: var(--rdc-cyan-txt); }
.vr-kpi-lbl { font-size: .6rem; color: var(--rdc-text-muted); font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.vr-badge { font-size: .78rem; font-weight: 800; padding: .2rem .5rem; border-radius: 4px; background: rgba(34,197,94,.15); color: var(--status-ok); }
.vr-formula-box { margin-top: .75rem; padding: .55rem .8rem; background: rgba(var(--recesso-rgb),.2); border-left: 2px solid var(--rdc-cyan); border-radius: 0 4px 4px 0; display: flex; flex-wrap: wrap; gap: .4rem .75rem; align-items: center; }
.vr-formula-lbl { font-size: .62rem; font-weight: 700; color: var(--rdc-text-muted); }
.vr-formula { font-size: .72rem; color: var(--rdc-text-light); font-family: monospace; }
.vr-norma { font-size: .6rem; color: var(--rdc-text-muted); }

/* END */
.end-aviso { background: rgba(255,107,53,.1); border: 1px solid rgba(255,107,53,.3); border-radius: var(--r-sm); padding: .6rem .85rem; font-size: .72rem; color: var(--rdc-text-light); margin-bottom: .75rem; }
.btn-add-end { background: rgba(34,197,94,.12); border: 1px solid rgba(34,197,94,.3); color: var(--status-ok); border-radius: var(--r-sm); padding: .45rem .9rem; font-size: .72rem; font-weight: 700; cursor: pointer; margin-top: .5rem; transition: background .2s; }
.btn-add-end:hover { background: rgba(34,197,94,.22); }

/* Certificações */
.cert-alertas-painel { margin-top: .75rem; padding: .6rem .8rem; background: rgba(var(--recesso-rgb),.2); border-radius: var(--r-sm); font-size: .72rem; }
.cert-ok { color: var(--rdc-text-muted); font-style: italic; }

/* Hash SHA-256 */
.hash-display-wrap { background: rgba(var(--recesso-rgb),.3); border: 1px solid var(--rdc-border); border-radius: var(--r-sm); padding: .75rem .9rem; margin-bottom: .75rem; }
.hash-label { font-size: .58rem; font-weight: 700; color: var(--rdc-text-muted); letter-spacing: .06em; text-transform: uppercase; margin-bottom: .35rem; }
.hash-val { font-family: monospace; font-size: .7rem; color: var(--rdc-cyan-txt); word-break: break-all; line-height: 1.5; }
.hash-short-row { display: flex; gap: .5rem; align-items: center; margin-top: .4rem; }
.hash-short-lbl { font-size: .6rem; color: var(--rdc-text-muted); }
.hash-short-val { font-family: monospace; font-size: .72rem; color: var(--rdc-text-pure); font-weight: 700; }
.qr-wrap { display: flex; justify-content: center; margin: .75rem 0; }
.qr-placeholder { display: flex; flex-direction: column; align-items: center; gap: .3rem; padding: 1rem 1.5rem; background: rgba(var(--recesso-rgb),.2); border: 1px dashed var(--rdc-border); border-radius: var(--r-sm); }
.qr-icon { font-size: 2.5rem; opacity: .3; }
.qr-txt { font-size: .72rem; color: var(--rdc-text-muted); }
.qr-sub { font-size: .6rem; color: var(--rdc-text-muted); opacity: .7; }

/* Validação e Emissão */
.validacao-titulo { font-size: .62rem; font-weight: 800; color: var(--rdc-text-muted); text-transform: uppercase; letter-spacing: .06em; margin: .75rem 0 .4rem; }
.validacao-lista { margin: 0; padding-left: 1.2rem; display: flex; flex-direction: column; gap: .25rem; }
.validacao-lista li { font-size: .72rem; color: var(--rdc-text-light); }
.emissao-row { display: flex; align-items: center; gap: .9rem; margin-top: .75rem; }
.btn-emitir { background: linear-gradient(135deg, var(--rdc-orange), var(--rdc-red)); border: none; color: var(--rdc-text-pure); font-size: .78rem; font-weight: 800; padding: .65rem 1.4rem; border-radius: var(--r-sm); cursor: pointer; transition: opacity .2s; }
.btn-emitir:disabled { opacity: .4; cursor: not-allowed; }
.btn-emitir:not(:disabled):hover { opacity: .85; }
.emissao-hint { font-size: .65rem; color: var(--rdc-text-muted); line-height: 1.5; }

/* Audit Trail */
.audit-table { width: 100%; border-collapse: collapse; font-size: .7rem; }
.audit-table th { font-size: .6rem; font-weight: 700; color: var(--rdc-text-muted); text-transform: uppercase; letter-spacing: .04em; padding: .4rem .6rem; border-bottom: 1px solid var(--rdc-border); text-align: left; }
.audit-table td { padding: .4rem .6rem; border-bottom: 1px solid rgba(var(--wash-rgb),.04); color: var(--rdc-text-light); }
.audit-vazio { color: var(--rdc-text-muted) !important; font-style: italic; text-align: center; }
.audit-nota { margin-top: .6rem; font-size: .62rem; color: var(--rdc-text-muted); padding: .5rem .7rem; background: rgba(var(--recesso-rgb),.2); border-radius: 4px; }

/* Relatório — seções incluídas */
.rel-secoes-lista { margin-bottom: .75rem; }
.rel-secoes-titulo { font-size: .6rem; font-weight: 700; color: var(--rdc-text-muted); text-transform: uppercase; letter-spacing: .05em; margin-bottom: .4rem; }
.rel-secao-item { font-size: .72rem; color: var(--rdc-text-light); margin-bottom: .2rem; list-style: none; }
.relatorio-cards-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .85rem; }
.btn-preview { background: rgba(0,212,255,.1); border: 1px solid rgba(0,212,255,.3); color: var(--rdc-cyan-txt); border-radius: var(--r-sm); padding: .35rem .7rem; font-size: .68rem; font-weight: 700; cursor: pointer; transition: background .2s; }
.btn-preview:hover { background: rgba(0,212,255,.2); }

/* M9 Painel direito — RAG, Vida Residual, Hash, Emissão */
.rp-rag-semaforo { font-size: 1.8rem; text-align: center; margin: .2rem 0; }
.rp-rag-val  { font-size: 1.3rem; font-weight: 900; color: var(--rdc-text-pure); text-align: center; }
.rp-rag-desc { font-size: .65rem; color: var(--rdc-text-muted); text-align: center; }
.rp-vr-val   { font-size: 1.15rem; font-weight: 900; color: var(--rdc-cyan-txt); }
.rp-vr-status { font-size: .65rem; font-weight: 700; margin-top: .15rem; }
.rp-vr-hint  { font-size: .58rem; color: var(--rdc-text-muted); margin-top: .1rem; }
.rp-cert-grid { display: flex; flex-direction: column; gap: .3rem; }
.rp-cert-item { font-size: .65rem; color: var(--rdc-text-light); display: flex; gap: .4rem; align-items: center; }
.rp-hash-val  { font-family: monospace; font-size: .62rem; color: var(--rdc-cyan-txt); word-break: break-all; line-height: 1.4; }
.rp-hash-hint { font-size: .58rem; color: var(--rdc-text-muted); margin-top: .2rem; }
.rp-emissao-status { font-size: .78rem; font-weight: 800; color: var(--rdc-text-light); }
.rp-emissao-id { font-size: .62rem; font-family: monospace; color: var(--rdc-cyan-txt); margin-top: .2rem; }

/* info-msg (M6 e outros) */
.info-msg { background: rgba(0,212,255,.08); border: 1px solid rgba(0,212,255,.2); border-radius: var(--r-sm); padding: .5rem .75rem; font-size: .72rem; color: var(--rdc-cyan-txt); }

/* ══════════════════════════════════════════════════════════════════════════
   M3 — OTIMIZAÇÃO E PAYBACK
   ══════════════════════════════════════════════════════════════════════════ */
/* Os seis cartoes do M3 dividiam o Bloco D com a tabela comparativa desde que
   ela foi criada, e o indicador da intervencao em edicao — que e o numero que o
   auditor le primeiro — ficou do mesmo tamanho de uma linha de tabela. Valor
   maior e respiro maior devolvem a hierarquia: cartao e leitura de relance,
   tabela e comparacao. Classes usadas so pelo M3. */
.resultado-card  { background: var(--rdc-bg-card); border: 1px solid var(--rdc-border); border-radius: var(--r-sm); padding: 1rem 1.15rem; display: flex; flex-direction: column; gap: .3rem; }
.resultado-label { font-size: .64rem; font-weight: 700; color: var(--rdc-text-muted); text-transform: uppercase; letter-spacing: .04em; }
.resultado-valor { font-size: 1.55rem; font-weight: 900; color: var(--rdc-cyan-txt); line-height: 1.15; }

/* Separa a faixa de cartoes da faixa da tabela dentro do mesmo bloco D. */
#secao-resultados .secao-body + .secao-body { border-top: 1px solid var(--rdc-border); padding-top: 1rem; }

/* ══════════════════════════════════════════════════════════════════════════
   M4 — ANÁLISE MULTI-COMBUSTÍVEL
   ══════════════════════════════════════════════════════════════════════════ */
.modulo-container { width: 100%; padding: 1.5rem; }
.m4-painel        { display: flex; flex-direction: column; gap: .75rem; }
.m4-precos-grid   { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap: .6rem; }
.m4-comparacao-area        { margin-top: .75rem; }
.m4-comparacao-placeholder { padding: 1.5rem; text-align: center; color: var(--rdc-text-muted); font-size: .75rem; background: rgba(var(--recesso-rgb),.15); border-radius: var(--r-sm); border: 1px dashed var(--rdc-border); }
.m4-info-box      { background: rgba(0,212,255,.07); border: 1px solid rgba(0,212,255,.2); border-radius: var(--r-sm); padding: .55rem .8rem; font-size: .72rem; color: var(--rdc-cyan-txt); }
.m4-rodape-hint   { font-size: .62rem; color: var(--rdc-text-muted); margin-top: .5rem; text-align: right; }

/* ══════════════════════════════════════════════════════════════════════════
   M5 — ISO 50001:2018
   ══════════════════════════════════════════════════════════════════════════ */
.m5-toggle-wrap { display: flex; align-items: center; gap: .5rem; cursor: pointer; font-size: .78rem; color: var(--rdc-text-light); user-select: none; }

/* ══════════════════════════════════════════════════════════════════════════
   M7 — DISTRIBUIÇÃO DE VAPOR
   ══════════════════════════════════════════════════════════════════════════ */
.field-help { font-size: .62rem; color: var(--rdc-text-muted); margin-top: .2rem; line-height: 1.4; }
/* Era `display:flex; flex-direction:column` — uma coluna a forca, e vinha no fim
   do arquivo, vencendo tudo. Com o padrao de 2 colunas ela so precisa do gap. */
.secao-body.grid-1 { gap: .6rem; }

/* ══════════════════════════════════════════════════════════════════════════
   M10 — CICLO DE VIDA DO ATIVO
   ══════════════════════════════════════════════════════════════════════════ */
.form-group   { display: flex; flex-direction: column; gap: .3rem; }
.form-control { background: var(--rdc-bg-input); border: 1px solid var(--rdc-border); border-radius: var(--r-sm); color: var(--rdc-text-pure); font-size: .82rem; padding: .45rem .65rem; width: 100%; transition: border-color .15s; }
.form-control:focus { outline: none; border-color: var(--rdc-cyan); }

/* ── Utilitários compartilhados (M3, M7, M8) ────────────────────────────── */
/* M3: grid span e textos auxiliares */
.fg.span-2    { grid-column: span 2; }
.display-sub  { font-size: .78rem; color: var(--rdc-text-muted); font-style: italic; }
.hint-center  { text-align: center; }

/* M7 / M8: valor calculado exibido como campo read-only */
.display-info { background: rgba(var(--recesso-rgb),.25); border: 1px solid var(--rdc-border); border-radius: var(--r-sm); padding: .4rem .65rem; font-size: .82rem; font-weight: 700; color: var(--rdc-cyan-txt); min-height: 2rem; display: flex; align-items: center; }

/* M8: input alternativo (select / checkbox dentro de fg) */
.input-field  { background: var(--rdc-bg-input); border: 1px solid var(--rdc-border); border-radius: var(--r-sm); color: var(--rdc-text-pure); font-size: .82rem; padding: .4rem .6rem; width: 100%; transition: border-color .15s; }
.input-field:focus { outline: none; border-color: var(--rdc-cyan); }

/* ── M1: containers de entrada ───────────────────────────────────────────── */
/* toggle-group: row de botões toggle (tipo caldeira, combustível, etc.) */
.toggle-group { display: flex; flex-wrap: wrap; gap: .35rem; }
/* input-group: input + select/unidade lado a lado */
.input-group  { display: flex; gap: .4rem; align-items: stretch; }
.input-group input  { flex: 1; min-width: 0; }
.input-group select { flex-shrink: 0; background: var(--rdc-bg-input); border: 1px solid var(--rdc-border); border-radius: var(--r-sm); color: var(--rdc-text-pure); font-size: .82rem; padding: .4rem .5rem; }

/* ── M5: variantes de card de comparação ────────────────────────────────── */
.m5-card-atual  { border-left: 3px solid rgba(248,113,113,.5); }
.m5-card-bench  { border-left: 3px solid rgba(0,210,255,.5); }

/* ── M9: variantes de rp-card no painel de integridade ─────────────────── */
.rp-card-rag    { background: rgba(var(--wash-rgb),.025); }
.rp-card-vr     { background: rgba(0,210,255,.04); }
.rp-card-cert   { background: rgba(0,90,200,.04); }
.rp-card-hash   { background: rgba(var(--recesso-rgb),.18); }
.rp-card-emissao{ background: rgba(34,197,94,.04); }

/* ── M2: classes ausentes ─────────────────────────────────────────────────── */
/* orvalho-status-wrap: variante do orvalho-item que exibe badge de status */
.orvalho-status-wrap { display: flex; flex-direction: column; gap: .15rem; }
/* .purga-letra / .qa-letra removidas — mesmo achado do .cf-letra/.pc-letra/
   .df-letra/.ee-letra/.fuligem-letra (SRS-UI-FORM-VISUAL-STANDARD-001 item
   4.5). Seções L e M usam `.secao-letra` único. */
/* rp-aviso-massa: aviso inline no painel direito M2 (oculto por padrão) */
.rp-aviso-massa { font-size: .65rem; color: var(--rdc-orange-txt); background: rgba(255,107,53,.08); border: 1px solid rgba(255,107,53,.25); border-radius: var(--r-sm); padding: .3rem .55rem; line-height: 1.4; margin-bottom: .35rem; }

/* Tela de login removida daqui — a única do sistema é login-portal.html
   (estilo em styles-auth.css). Ver CLAUDE.md item 2 e auth.js. */
.toggle-senha {
  position: absolute; right: 0.75rem; top: 50%; transform: translateY(-50%);
  background: none; border: none; cursor: pointer; font-size: 1.1rem;
  padding: 0.5rem; opacity: 0.7; transition: opacity 0.2s;
}
.toggle-senha:hover { opacity: 1; }
.fg input[type=password] { padding-right: 2.5rem; }

/* ── M1/F — Fotos da Caldeira ──────────────────────────────────────────────
   Rotulo e arquivo lado a lado, botao alinhado pela base dos campos. */
.foto-caldeira-add {
  display: flex; gap: .75rem; align-items: flex-end; flex-wrap: wrap;
}
.foto-caldeira-add .fg { flex: 1 1 220px; min-width: 0; }
.foto-caldeira-add .btn-action { margin-top: 0; flex: 0 0 auto; }

/* Tabela de fotos anexadas. */
.fc-tabela {
  width: 100%; border-collapse: collapse; margin-top: .9rem; font-size: .82rem;
}
.fc-tabela th {
  text-align: left; padding: .5rem .6rem;
  font-size: .65rem; font-weight: 700; letter-spacing: .7px; text-transform: uppercase;
  color: var(--rdc-text-muted); border-bottom: 1px solid rgba(var(--wash-rgb),.12);
}
.fc-tabela td {
  padding: .5rem .6rem; border-bottom: 1px solid rgba(var(--wash-rgb),.06);
  vertical-align: middle; color: var(--rdc-text-pure);
}
.fc-tabela tr:last-child td { border-bottom: none; }
.fc-td-mini   { width: 64px; }
.fc-td-data   { white-space: nowrap; color: var(--rdc-text-muted); }
.fc-td-acoes  { white-space: nowrap; text-align: right; }
.fc-td-rotulo { word-break: break-word; }

.fc-mini {
  width: 52px; height: 52px; object-fit: cover; display: block;
  border-radius: var(--r-sm); border: 1px solid rgba(var(--wash-rgb),.12);
}

.fc-acao {
  background: transparent; color: var(--rdc-text-pure);
  border: 1px solid rgba(var(--wash-rgb),.18); border-radius: var(--r-sm);
  padding: .3rem .6rem; margin-left: .3rem; cursor: pointer;
  font-size: .74rem; font-family: inherit;
}
.fc-acao:hover  { border-color: var(--rdc-orange); color: var(--rdc-orange-txt); }
/* Excluir nao tem desfazer: fica em vermelho so no hover, para nao competir
   com as outras duas acoes na leitura da linha. */
.fc-acao-perigo:hover { border-color: var(--rdc-red); color: var(--rdc-red); }

/* ── M3 · tabela comparativa de intervenções (bloco D) ──────────────────────
   Mesma linguagem visual de .tabela-problemas-graves; o que muda é a coluna
   numérica com tabular-nums, sem a qual as casas decimais de VPL e payback
   não alinham entre linhas e a comparação — que é o propósito da tabela —
   fica difícil de ler de relance. */
/* .66rem e a MESMA escala do <th> da tabela e dos rotulos do app. Estava
   .82rem e o titulo saltava aos olhos no meio de uma tela onde nada mais
   passa de .7rem — a tela inteira parecia ter duas fontes. */
.subtitulo-bloco {
  color: var(--rdc-text-light); font-size: .66rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em; margin: 0 0 .6rem;
}

/* A nota da carteira usava .hint, mas o tamanho do app vem de `.fg .hint`
   (.62rem) e este paragrafo nao vive dentro de um .fg: herdava .8rem e
   aparecia maior que o texto dos campos logo acima. */
.nota-carteira {
  font-size: .62rem; line-height: 1.5; color: var(--rdc-text-muted);
  margin: .7rem 0 0; max-width: 78ch;
}

/* A tabela tem 9 colunas e não cabe em tela estreita: rola dentro do próprio
   container, senão empurra o corpo da página para o lado. */
.tabela-scroll { overflow-x: auto; }

.tabela-carteira { width: 100%; border-collapse: collapse; font-size: .8rem; }
.tabela-carteira th, .tabela-carteira td {
  padding: .5rem .55rem; text-align: left;
  border-bottom: 1px solid var(--rdc-border); white-space: nowrap;
}
.tabela-carteira th {
  color: var(--rdc-text-muted); font-weight: 700;
  text-transform: uppercase; font-size: .66rem;
}
.tabela-carteira .num { text-align: right; font-variant-numeric: tabular-nums; }
.tabela-carteira .col-rank { color: var(--rdc-orange-txt); font-weight: 700; width: 2.5rem; }
.tabela-carteira tfoot td { border-top: 2px solid var(--rdc-border); border-bottom: none; }
.tabela-carteira .linha-em-edicao { background: rgba(255,107,53,.08); }

.btn-mini {
  background: none; border: 1px solid var(--rdc-border); border-radius: 4px;
  color: var(--rdc-text-light); font-size: .7rem; padding: .22rem .5rem;
  cursor: pointer; margin-right: .3rem;
}
.btn-mini:hover { border-color: var(--rdc-orange); color: var(--rdc-orange-txt); }
.btn-mini-danger:hover { border-color: var(--status-danger, #c62828); color: var(--status-danger, #c62828); }

/* ── Campo travado ─────────────────────────────────────────────────────────
   .campo-de-origem: o dono é outro módulo (espelho-origem.js, M6) ou é a
   identidade da caldeira já gravada (M1). O cadeado fica na dica abaixo do
   campo, com a origem exata para onde ir.
   .campo-bloqueado: bloco que só existe para o Laudo Técnico (M2
   A/B/C/G/H/K/U, M1 F/G) — PRODUTO-COMERCIAL-001: na auditoria VISUAL esses
   campos ficam visíveis e travados, e o selo no cabeçalho do bloco diz onde
   são liberados.
   Os dois precisam parecer diferentes de um campo editável: sem essa pista o
   auditor clica, nada acontece, e conclui que a tela travou. */
.campo-de-origem,
.campo-de-origem:focus,
.campo-bloqueado,
.campo-bloqueado:focus {
  cursor: not-allowed;
  caret-color: transparent;
  box-shadow: none;
}
/* Campo de TEXTO travado: mesmo fundo e mesmo texto do editável (PO, 24/09) —
   a padronização vale para todo campo. A pista de "travado" é a borda
   tracejada, o cursor e o cadeado na dica, não um segundo fundo. opacity: 1
   porque o Chrome apaga <select disabled> para .7 por conta própria, e o
   espelho de origem trava select com `disabled`. */
:is(input:not([type=checkbox]):not([type=radio]):not([type=range]), select, textarea).campo-de-origem,
:is(input:not([type=checkbox]):not([type=radio]):not([type=range]), select, textarea).campo-bloqueado {
  background: var(--rdc-bg-input);
  color: var(--campo-txt);
  border-color: var(--rdc-border);
  border-style: dashed;
  opacity: 1;
}
/* Checkbox, radio, range e botão não têm fundo nem texto a padronizar, e a
   borda tracejada não aparece neles: a opacidade é a única pista de trava. */
:is(input[type=checkbox], input[type=radio], input[type=range], button).campo-bloqueado {
  opacity: .72;
}

/* Sem escurecer o corpo inteiro: os campos travados já se distinguem sozinhos,
   e o esmaecimento geral fazia o campo liberado dentro do bloco (carga_atual_pct)
   parecer travado também. */
.campo-liberado,
.campo-liberado:focus {
  border-color: var(--rdc-orange);
  box-shadow: 0 0 0 2px rgba(242, 90, 10, .18);
}

/* ── Pop-up de alerta/erro (regra do PO, 2026-09-16) ────────────────────────
   Todo alerta ou erro aparece aqui, com a mensagem inteira e um botão que leva
   ao campo. Substitui o toast de 8s que mostrava só a primeira pendência.

   O pop-up ficou escuro no tema claro até 23/09 por um motivo que não se vê
   lendo a regra: ela pedia `var(--rdc-bg-panel, #111d2b)` e `var(--rdc-text,
   ...)`, e NENHUM dos dois tokens existe no projeto — o fallback cravado era
   o que sempre valia, nos dois temas. Por isso aqui não há mais fallback: com
   token inexistente a regra agora falha à vista, em vez de renderizar escuro
   em silêncio. */
.aviso-fundo {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  background: rgba(2, 8, 20, .72);
}

.aviso-caixa {
  width: min(560px, 100%);
  max-height: 80vh;
  overflow-y: auto;
  padding: 1.25rem 1.4rem;
  border-radius: 10px;
  background: var(--rdc-superficie-modal);
  border: 1px solid var(--rdc-border);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .55);
}

.aviso-caixa.aviso-erro   { border-color: rgba(220, 38, 38, .55); }
.aviso-caixa.aviso-alerta { border-color: rgba(245, 158, 11, .55); }

.aviso-tit { margin: 0 0 .7rem; font-size: .95rem; }
.aviso-erro   .aviso-tit { color: var(--status-danger-tit); }
.aviso-alerta .aviso-tit { color: var(--status-warn-tit); }

.aviso-lista {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  line-height: 1.65;
  color: var(--rdc-text-base);
}

.aviso-lista li + li { margin-top: .5rem; }
.aviso-lista li::marker { color: var(--rdc-orange-txt); }

/* Atalho por pendência: diz QUAL campo (módulo · id) e leva até ele. */
.aviso-ir-campo {
  padding: 0 .35rem;
  font: inherit;
  font-size: .72rem;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  color: var(--rdc-orange-txt);
  background: transparent;
  border: 1px solid var(--rdc-orange);
  border-radius: 4px;
}
.aviso-ir-campo:hover { filter: brightness(1.12); }

.aviso-acoes {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: 1.1rem;
}

.aviso-btn {
  padding: .45rem 1rem;
  font-size: .75rem;
  font-weight: 700;
  border-radius: 5px;
  cursor: pointer;
  color: var(--rdc-text-base);
  background: transparent;
  border: 1px solid var(--rdc-border);
}

.aviso-btn-primario {
  color: #fff;
  background: var(--rdc-orange);
  border-color: var(--rdc-orange);
}

.aviso-btn:hover { filter: brightness(1.12); }

/* ── Pop-up de cálculo bloqueado (M2) ───────────────────────────────────────
   A mensagem é longa e o banner fica no topo do Live Preview: quem rola a tela
   para procurar o campo perde o texto no meio da leitura. O pop-up mostra o
   motivo inteiro, sem corte e sem rolagem escondida. */
.m2-modal-fundo {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  background: rgba(2, 8, 20, .72);
}

.m2-modal-caixa {
  width: min(560px, 100%);
  max-height: 80vh;
  overflow-y: auto;
  padding: 1.25rem 1.4rem;
  border-radius: 10px;
  background: var(--rdc-superficie-modal);
  border: 1px solid rgba(220, 38, 38, .55);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .55);
}

.m2-modal-tit {
  margin: 0 0 .6rem;
  font-size: .95rem;
  color: var(--status-danger-tit);
}

.m2-modal-texto {
  margin: 0;
  font-size: .82rem;
  line-height: 1.65;
  color: var(--rdc-text-base);
  white-space: pre-line;   /* respeita quebras do motivo, sem cortar texto */
}

.m2-modal-acoes {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: 1.1rem;
}

.m2-modal-btn {
  padding: .45rem 1rem;
  font-size: .75rem;
  font-weight: 700;
  border-radius: 5px;
  cursor: pointer;
  color: var(--rdc-text-base);
  background: transparent;
  border: 1px solid var(--rdc-border);
}

.m2-modal-btn-primario {
  color: #fff;
  background: var(--rdc-orange);
  border-color: var(--rdc-orange);
}

.m2-modal-btn:hover { filter: brightness(1.12); }

/* Campo que falta preencher: pisca até receber valor. O PO pediu "cursor
   piscando no campo" — a borda pulsa junto com o foco, para achar o campo mesmo
   quem chegou pelo pop-up e rolou a tela. */
@keyframes m2-pulso-pendente {
  0%, 100% { box-shadow: 0 0 0 0 rgba(242, 90, 10, .65); border-color: var(--rdc-orange); }
  50%      { box-shadow: 0 0 0 5px rgba(242, 90, 10, 0); border-color: #ffb27a; }
}

.campo-pendente {
  animation: m2-pulso-pendente 1.25s ease-in-out infinite;
  border-color: var(--rdc-orange) !important;
}

@media (prefers-reduced-motion: reduce) {
  .campo-pendente { animation: none; box-shadow: 0 0 0 3px rgba(242, 90, 10, .5); }
}

.m2-ir-para-campo {
  margin-top: .6rem;
  padding: .35rem .8rem;
  font-size: .7rem;
  font-weight: 700;
  color: #fff;
  background: var(--rdc-orange);
  border: 0;
  border-radius: 4px;
  cursor: pointer;
}

.m2-ir-para-campo:hover { filter: brightness(1.1); }

.dica-campo-liberado {
  color: var(--rdc-orange-txt);
  font-weight: 600;
}

.selo-so-instrumentada {
  margin-left: auto;
  align-self: center;
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 999px;
  white-space: nowrap;
  color: var(--rdc-text-muted);
  background: var(--rdc-bg-deep);
  border: 1px solid var(--rdc-border);
}

/* ── M9 · linhas de alerta de certificação ──────────────────────────────────
   `.cert-row` e suas quatro colunas NÃO tinham regra nenhuma: os <span> caíam
   como inline sem separação e a tela imprimia
   "Válvula de Segurança2026-09-11Expirada há 1dExpirada".
   Grid de 4 colunas em vez de espaços no HTML — assim a data e o prazo
   alinham entre as linhas, que é o que permite ler a lista de relance. */
.cert-row {
  display: grid;
  grid-template-columns: minmax(9rem, 1.6fr) 6.5rem 1fr 5.5rem;
  gap: .75rem;
  align-items: center;
  padding: .4rem .6rem;
  border-bottom: 1px solid var(--rdc-border);
  font-size: .72rem;
}
.cert-row:last-child { border-bottom: none; }
.cert-item  { color: var(--rdc-text-light); font-weight: 600; }
.cert-venc,
.cert-dias  { color: var(--rdc-text-muted); font-variant-numeric: tabular-nums; }
.cert-badge {
  justify-self: end; text-align: center; font-size: .62rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .03em;
  padding: .15rem .45rem; border-radius: 10px; border: 1px solid currentColor;
}
.cert-expirada .cert-badge { color: var(--status-danger, #c62828); }
.cert-vencendo .cert-badge { color: var(--rdc-orange-txt); }
.cert-valida   .cert-badge { color: var(--status-ok, #2e7d32); }
.cert-expirada .cert-dias  { color: var(--status-danger, #c62828); font-weight: 700; }
.cert-ok { color: var(--rdc-text-muted); font-size: .72rem; padding: .4rem .6rem; }

/* Numa tela estreita as 4 colunas não cabem — empilha em 2 em vez de estourar. */
@media (max-width: 1400px) {
  .cert-row { grid-template-columns: 1fr auto; row-gap: .2rem; }
  .cert-badge { grid-row: 1; grid-column: 2; }
}

/* =========================================================================
   HEADER DO APP (shared/appHeader.js) — Início/Auditorias/Suporte/Painel
   Admin/Usuário/Sair em ícone. Movido de home.html pra cá em 2026-09-22:
   era a única tela com este header rico, as outras 12 de pós-login (ver
   comentário no topo de appHeader.js) ficaram pra trás com "← Voltar à
   Home". Um componente + uma folha de estilo só evita repetir esse
   descompasso a cada ajuste futuro de ícone/cor.
   ========================================================================= */
.hm-header {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  flex-wrap: wrap;
  /* Token e não #0D1527: a barra veio da main, que não tem tema claro/escuro,
     e a cor cravada deixaria o cabeçalho escuro em toda tela clara. */
  /* Vertical quase zero: a logo de 76px ocupa a altura toda sozinha. Com o
     .9rem de antes a barra passaria de 80 para 106px — e na auditoria
     (index.html) ela é fixa e o layout desce exatamente --header-h: 80px;
     barra mais alta que isso cobre o topo da sidebar e do formulário. */
  padding: .1rem 1.25rem; background: var(--rdc-bg-header); border-bottom: 1px solid var(--rdc-border);
  /* atendimento.html usa body{display:flex;flex-direction:column;height:100vh}
     pro chat rolar só na área de mensagens — sem isto o header (que virou
     item flex desse container) encolheria junto quando a lista de mensagens
     crescesse. Inerte nas outras telas, cujo body não é flex container. */
  flex-shrink: 0;
}
.hm-header-brand {
  display: flex; align-items: center; gap: .75rem;
  /* Logo alinhada à borda esquerda da coluna de conteúdo (max-width 1200px
     na maioria das telas) em vez de colada na borda da janela (PO, 23/09).
     max(0px, ...) porque abaixo de 1200px a coluna já ocupa a largura toda
     e o recuo ficaria negativo. */
  margin-left: max(0px, calc((100vw - 1200px) / 2));
}
/* LogoManager.getSystemLogo() devolve um <img style="width:100%;..."> — sem
   container de altura fixa (mesmo mecanismo de .header-logo-wrap acima,
   usado por index.html), o width:100% não tem em relação a quê resolver
   dentro do flex e a logo renderiza no tamanho nativo do PNG, estourando o
   header. */
#hm-logo-container { display: flex; align-items: center; height: 76px; flex-shrink: 0; }
#hm-logo-container img { height: auto; max-height: 76px; width: auto; object-fit: contain; display: block; }
/* Sem h1/p ao lado da logo: a marca combinada já traz "Audithec Thermal Pro"
   e a descrição escritos dentro da arte, e o texto repetia os dois ao lado da
   imagem que os diz (PO, 23/09). */
.hm-header-nav { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; }

/* Botões em formato de ícone (pedido do PO, 2026-09-22) — antes eram
   links/botões de texto (Auditorias/Suporte/Sair) ou um pill com rótulo
   (Painel Admin). `title`/`aria-label` no próprio elemento fazem o papel do
   rótulo que saiu do texto — sem eles o botão vira um quadrado mudo pra
   leitor de tela.

   Sem contorno e sem fundo em repouso (PO, 24/09). Antes cada botão era uma
   caixa com borda, e três fugiam dela (Perfil em círculo laranja, Admin
   laranja fixo, Foco em pill com texto) — a barra parecia montada com peças
   de jogos diferentes. Agora TODOS usam esta classe e só dois estados pintam:
   hover (fundo neutro) e "tela atual" (laranja). Laranja em repouso em
   qualquer botão volta a fazer ele parecer selecionado em toda tela. */
.hm-icon-btn {
  position: relative;
  display: flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; padding: 0; border-radius: 8px; flex-shrink: 0;
  background: transparent; border: 0;
  color: var(--rdc-text-light); text-decoration: none; cursor: pointer;
  font-family: inherit;
  transition: color .15s ease, background .15s ease;
}
.hm-icon-btn svg { display: block; flex-shrink: 0; }
/* --wash-rgb inverte com o tema (bloco TEMA): branco translúcido sobre fundo
   escuro, escuro translúcido sobre fundo claro. Cravado em rgba(255,255,255)
   o hover sumia na barra clara. */
.hm-icon-btn:hover { background: rgba(var(--wash-rgb),.08); color: var(--rdc-orange-txt); }
/* Sem borda, o anel de foco é a única pista de onde está o teclado — não
   pode depender do outline padrão, que alguns navegadores omitem em <a>. */
.hm-icon-btn:focus-visible { outline: 2px solid var(--rdc-orange); outline-offset: 2px; }
/* Ícone da tela corrente — o traço embaixo repete a pista da cor para quem
   não distingue o laranja do fundo (daltonismo, tela lavada de sol). */
.hm-icon-btn-active { background: rgba(255,107,53,.14); color: var(--rdc-orange-txt); }
.hm-icon-btn-active::after {
  content: ""; position: absolute; left: 11px; right: 11px; bottom: -1px;
  height: 2px; border-radius: 2px; background: var(--rdc-orange);
}
/* Legenda fixa embaixo do ícone (pedido do PO, 2026-09-22: só tooltip no
   hover não bastava) — `aria-hidden` porque o nome já está no title/
   aria-label do botão; repetir pro leitor de tela seria redundante. */
.hm-icon-group { display: flex; flex-direction: column; align-items: center; gap: 3px; }
/* O grupo do Admin nasce `hidden` e appHeader.js só o revela para role='admin'.
   Sem esta regra o `display: flex` acima vence o [hidden] do navegador (regra
   de autor sempre ganha da do user-agent) e TODO usuário via o ícone Admin —
   inclusive o auditor comum, que ao clicar caía em telas de "sem acesso". */
.hm-icon-group[hidden] { display: none; }
.hm-icon-label { font-size: .58rem; color: var(--rdc-text-muted); line-height: 1; white-space: nowrap; }

/* Sair encerra a sessão: o hover em vermelho avisa antes do clique. */
.hm-btn-sair-header:hover { color: #e05555; background: rgba(198,40,40,.12); }

/* Modo Foco (index.html) ligado: além do laranja de "ativo", um ponto no
   canto — o Foco não é uma tela, e só o laranja o confundiria com "você está
   aqui" nas outras. */
.hm-foco-ponto {
  position: absolute; top: 4px; right: 4px; width: 7px; height: 7px;
  border-radius: 50%; background: var(--rdc-orange);
}
.hm-foco-ponto[hidden] { display: none; }

/* "Admin" — só pra role='admin' (appHeader.js revela). Mesmo padrão de
   dropdown do grupo ⚙️ Configurações em shared/nav.js, mas aqui é header,
   não sidebar, então vira menu suspenso em vez de lista fixa. */
.hm-painel-admin { position: relative; }
/* O grupo também é .hm-icon-group (legenda "Admin" embaixo do ícone), e o
   `display: flex` daquela regra vence o [hidden] do user-agent pelo mesmo
   motivo do menu abaixo. Sem esta linha o ícone Admin aparecia para
   role='user' em toda tela que não carrega audithec-thermal-pro.css (a Home
   inclusive) — appHeader.js nunca o revelava, ele só nunca esteve oculto. */
.hm-painel-admin[hidden] { display: none; }
/* O ▾ fica DENTRO da caixa de 38px, no canto: ao lado do escudo ele
   espremia o ícone e deixava o Admin mais largo que os vizinhos. */
.hm-painel-admin-seta {
  position: absolute; right: 3px; bottom: 3px; font-size: 8px; line-height: 1; opacity: .7;
}
.hm-painel-admin-btn[aria-expanded="true"] { background: rgba(var(--wash-rgb),.08); color: var(--rdc-orange-txt); }
.hm-painel-admin-menu {
  position: absolute; top: calc(100% + .4rem); right: 0; min-width: 220px; z-index: 20;
  background: var(--rdc-bg-card); border: 1px solid var(--rdc-border); border-radius: 10px;
  padding: .4rem; display: flex; flex-direction: column; gap: .1rem;
  box-shadow: 0 8px 24px rgba(0,0,0,.35);
}
/* Sem isto, o `hidden` que appHeader.js alterna em _abrir()/_fechar() não
   tem efeito nenhum: o `display: flex` acima tem a mesma especificidade do
   [hidden] padrão do navegador, e uma regra de autor sempre vence a do
   user-agent — o menu ficava aberto pra sempre assim que abria uma vez. */
.hm-painel-admin-menu[hidden] { display: none; }
.hm-painel-admin-grupo {
  font-size: .58rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--rdc-text-muted); padding: .45rem .6rem .25rem;
}
.hm-painel-admin-menu a + .hm-painel-admin-grupo {
  margin-top: .3rem; border-top: 1px solid var(--rdc-border); padding-top: .6rem;
}
.hm-painel-admin-menu a {
  display: flex; align-items: center; gap: .6rem;
  color: var(--rdc-text-light); text-decoration: none; font-size: .8rem;
  padding: .45rem .6rem; border-radius: 6px;
}
.hm-painel-admin-menu a svg { flex: none; color: var(--rdc-text-muted); }
.hm-painel-admin-menu a:hover,
.hm-painel-admin-menu a:focus-visible { background: rgba(255,107,53,.12); color: var(--rdc-orange-txt); outline: none; }
.hm-painel-admin-menu a:hover svg,
.hm-painel-admin-menu a:focus-visible svg { color: var(--rdc-orange-txt); }

/* ── CHAT DE SUPORTE FLUTUANTE (shared/chatSuporte.js) ──────────────────────
   z-index 900: acima do header/rodapé fixos (100), ABAIXO dos modais (1000+) —
   o aviso de sessão expirada precisa cobrir o chat, não o contrário. */
.cs-raiz {
  position: fixed; right: 20px; bottom: 20px; z-index: 900;
  display: flex; flex-direction: column; align-items: flex-end; gap: 12px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  /* A caixa da raiz é maior que o botão (no celular, ocupa a largura toda);
     sem isto a área vazia dela engoliria o clique no que está atrás. */
  pointer-events: none;
}
.cs-raiz > * { pointer-events: auto; }
.cs-raiz.cs-acima-rodape { bottom: calc(var(--footer-h, 56px) + 16px); }
/* Tela da auditoria: o painel KPI é fixo à direita e o "GERAR CÁLCULOS" fica
   na base dele — no canto de sempre, o botão do chat caía em cima do botão
   (B17). O chat passa para a borda esquerda do painel; no Modo Foco o painel
   recolhe para largura zero, e o canto volta a ficar livre. */
.cs-raiz.cs-fora-do-kpi { right: calc(var(--kpi-w, 280px) + 20px); }
body.modo-foco .cs-raiz.cs-fora-do-kpi { right: 20px; }

.cs-fab {
  position: relative; width: 56px; height: 56px; border-radius: 50%;
  border: none; background: var(--rdc-orange); color: #fff; cursor: pointer;
  display: grid; place-items: center;
  box-shadow: 0 6px 20px rgba(0,0,0,.35), 0 0 0 3px rgba(255,107,53,.18);
  transition: transform .15s, background .15s;
}
.cs-fab:hover { background: var(--rdc-orange-dp); transform: translateY(-2px); }
.cs-fab:focus-visible { outline: 3px solid var(--rdc-cyan); outline-offset: 3px; }
.cs-fab.cs-fab-aberto { background: var(--rdc-orange-dp); }
.cs-fab-ponto {
  position: absolute; top: 2px; right: 2px; width: 14px; height: 14px; border-radius: 50%;
  background: var(--rdc-cyan); border: 2px solid var(--rdc-bg-deep);
}

.cs-painel {
  width: 360px; height: min(520px, calc(100vh - 140px));
  display: flex; flex-direction: column;
  background: var(--rdc-superficie-modal); color: var(--rdc-text-pure);
  border: 1px solid var(--rdc-border); border-radius: 14px; overflow: hidden;
  box-shadow: 0 16px 40px rgba(0,0,0,.4);
}
.cs-painel[hidden] { display: none; }
.cs-acima-rodape .cs-painel { height: min(520px, calc(100vh - 140px - var(--footer-h, 56px))); }

.cs-cabecalho {
  display: flex; align-items: center; gap: .4rem;
  padding: .8rem .8rem .8rem 1rem; border-bottom: 1px solid var(--rdc-border);
}
.cs-cabecalho-texto { flex: 1; min-width: 0; }
.cs-cabecalho h2 { margin: 0; font-size: .92rem; font-weight: 700; }
.cs-sub { margin: .1rem 0 0; font-size: .72rem; color: var(--rdc-text-muted); }
.cs-icone-btn {
  flex: none; width: 30px; height: 30px; border-radius: 8px; border: none;
  background: transparent; color: var(--rdc-text-muted); cursor: pointer;
  display: grid; place-items: center;
}
.cs-icone-btn:hover, .cs-icone-btn:focus-visible { background: rgba(255,107,53,.12); color: var(--rdc-orange-txt); outline: none; }

.cs-badge { flex: none; padding: .12rem .5rem; border-radius: 999px; font-size: .6rem; font-weight: 700; white-space: nowrap; }
.cs-badge-aberta { background: rgba(255,107,53,.2); color: var(--rdc-orange-txt); }
.cs-badge-em_atendimento { background: rgba(26,127,60,.18); color: #7be0a0; }
.cs-badge-fechada { background: rgba(148,163,184,.2); color: var(--rdc-text-muted); }
/* O verde claro do tema escuro some sobre fundo branco. */
:root[data-theme="light"] .cs-badge-em_atendimento { color: var(--rdc-green); }
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .cs-badge-em_atendimento { color: var(--rdc-green); }
}

.cs-mensagens { flex: 1; overflow-y: auto; padding: .9rem 1rem; display: flex; flex-direction: column; gap: .45rem; }
.cs-vazio { margin: auto; text-align: center; color: var(--rdc-text-muted); font-size: .82rem; line-height: 1.6; max-width: 260px; }
.cs-msg { max-width: 82%; padding: .5rem .7rem; border-radius: 10px; font-size: .82rem; line-height: 1.5; overflow-wrap: anywhere; white-space: pre-wrap; }
.cs-msg-minha { align-self: flex-end; background: rgba(255,107,53,.16); border: 1px solid rgba(255,107,53,.4); border-top-right-radius: 2px; }
.cs-msg-atendente { align-self: flex-start; background: rgba(148,163,184,.08); border: 1px solid var(--rdc-border); border-top-left-radius: 2px; }
.cs-msg-hora { display: block; margin-top: .2rem; font-size: .6rem; color: var(--rdc-text-muted); white-space: normal; }

.cs-erro { margin: 0; padding: .45rem 1rem; font-size: .74rem; color: #ff8a80; border-top: 1px solid var(--rdc-border); }
.cs-erro[hidden] { display: none; }

.cs-compositor { flex: none; display: flex; gap: .5rem; padding: .7rem .8rem; border-top: 1px solid var(--rdc-border); }
.cs-compositor textarea {
  flex: 1; resize: none; min-height: 2.3rem; max-height: 6rem; padding: .5rem .65rem;
  border-radius: 8px; border: 1px solid var(--rdc-border); background: var(--rdc-bg-input);
  color: var(--rdc-text-pure); font-family: inherit; font-size: .82rem;
}
.cs-compositor textarea:focus { outline: none; border-color: var(--rdc-orange); }
.cs-enviar {
  flex: none; background: var(--rdc-orange); color: #fff; border: none; border-radius: 8px;
  padding: 0 1rem; font-weight: 700; font-size: .8rem; cursor: pointer; font-family: inherit;
}
.cs-enviar:hover:not(:disabled) { background: var(--rdc-orange-dp); }
.cs-enviar:disabled { opacity: .5; cursor: not-allowed; }
.cs-tela-cheia { display: block; text-align: center; padding: 0 0 .6rem; font-size: .7rem; color: var(--rdc-text-muted); text-decoration: none; }
.cs-tela-cheia:hover { color: var(--rdc-orange-txt); text-decoration: underline; }

@media (max-width: 480px) {
  .cs-raiz { right: 16px; bottom: 16px; left: 16px; }
  .cs-painel { width: 100%; }
}
@media print { .cs-raiz { display: none !important; } }