/* =====================================================================
   PADRÃO VISUAL PCNET · FORMA E COMPORTAMENTO

   A camada que faltava. Até 2026-08-21 o padrão cobria COR, LETRA e MARCA —
   e era isso que estava igual no parque. Forma e comportamento não estavam,
   e a medição mostrou o tamanho:

     cantos próprios, por plugin     7 a 31 valores distintos
     sombras próprias                até 38 num plugin só
     velocidades de animação         até 16 num plugin só
     marcação de foco por teclado    ZERO em cinco plugins
     alvo de toque no celular        ZERO em dois plugins
     "não há nada aqui"              SETE nomes diferentes

   Nada disto se vê num print de tela cheia. Vê-se ao navegar por Tab, ao
   tocar com o dedo, ao abrir uma lista vazia — e é por isso que passou.

   Depende de pcnet-tokens.css. Não é cópia da skill: é deste plugin, e por
   isso pode crescer.
   ===================================================================== */

:root {
  /* --- ANEL DE FOCO ---------------------------------------------------
     Quem navega por teclado precisa VER onde está. Cinco plugins do parque
     não marcavam nada: a pessoa aperta Tab e o foco anda invisível pela
     tela. `outline` e não `box-shadow` de propósito — outline não é cortado
     por `overflow: hidden`, que é o caso de todo card com canto arredondado.
     O offset separa o anel da borda do próprio elemento. */
  --pk-ring:        3px solid var(--pk-green-dark);
  --pk-ring-offset: 2px;

  /* ESPESSURA casada com o portal (3px), COR não: o portal usa o verde cheio
     (#8CC63F), que contra branco dá 1,81:1 — abaixo dos 3:1 que um elemento
     gráfico precisa para ser percebido. O --pk-green-dark dá 3,75:1 e é o
     token de traço do padrão, feito para isto. A espessura é o que se vê de
     longe e casa; a cor é o que precisa passar na medição.
     ⚠️ O portal continua com o verde cheio no anel dele — mexer nisso é
     decisão do dono, não efeito colateral de uma rodada de plugin. */

  /* --- ALVO DE TOQUE ---------------------------------------------------
     44px é o mínimo para o dedo acertar sem erro. Vale para técnico em campo
     e para cliente no celular — os dois usam este parque. Aplicado só em
     `pointer: coarse`, para não inchar a interface de quem usa mouse. */
  --pk-tap: 44px;

  /* --- DENSIDADE, EM TRÊS NÍVEIS NOMEADOS ------------------------------
     Um espaçamento só seria errado, e a medição mostra por quê: tabela usa
     6px/12px, formulário 12px/18px, kanban .8rem/.9rem — e cada um está
     certo para a sua função. Uma tabela com o respiro de formulário mostra
     metade das linhas na mesma altura de tela.

     O que se padroniza não é o VALOR, é o VOCABULÁRIO: três níveis, com
     nome, e cada tela escolhe o seu. */
  --pk-pad-densa:  6px 12px;    /* linha de tabela, chip, item de lista */
  --pk-pad:        10px 16px;   /* o caso comum */
  --pk-pad-conf:   14px 20px;   /* campo de formulário, cabeçalho de card */

  /* --- MOVIMENTO -------------------------------------------------------
     Três velocidades bastam, e já existem em pcnet-tokens.css como
     --pk-ease-fast / --pk-ease / --pk-ease-slow. Aqui só se nomeia o que
     elas significam, porque "16 durações diferentes" nasce de cada regra
     escolher a sua sem critério:
       fast  reação direta ao toque (cor de hover, foco)
       ease  movimento que a pessoa acompanha (abrir, deslizar)
       slow  o que acontece sozinho, sem clique (entrada de tela) */
}

/* =====================================================================
   1. FOCO POR TECLADO — o que não se vê até precisar

   :focus-visible e não :focus: o segundo desenha o anel também no clique de
   mouse, o que polui a tela e faz o time desligar a regra inteira. O
   :focus-visible só aparece quando o navegador entende que a navegação é por
   teclado, que é exatamente quando o anel importa.
   ===================================================================== */
.pk-app a:focus-visible,
.pk-app button:focus-visible,
.pk-app [role="button"]:focus-visible,
.pk-app input:focus-visible,
.pk-app select:focus-visible,
.pk-app textarea:focus-visible,
.pk-app [tabindex]:focus-visible {
  outline: var(--pk-ring);
  outline-offset: var(--pk-ring-offset);
}
/* 🔴 NÃO declarar `border-radius` aqui, e isto não é esquecimento — foi medido
   em 2026-08-26. A regra acima vale (0,2,1) e esta folha carrega DEPOIS dos
   componentes, então um raio declarado no foco vence o raio de repouso de toda
   peça alcançada: botão 12px -> 10px, campo 12px -> 10px, card 16px -> 10px, e
   a pílula de 9999px virava um retângulo de 10px ao receber Tab. Era a única
   regra do parque em que a FORMA dependia do ESTADO. O `outline` é desenhado
   por fora e acompanha o raio do próprio elemento — não precisa saber qual é. */

/* =====================================================================
   2. ALVO DE TOQUE — só onde o ponteiro é grosso (dedo)
   ===================================================================== */
@media (pointer: coarse) {
  .pk-app a,
  .pk-app button,
  .pk-app [role="button"],
  .pk-app input:not([type="hidden"]),
  .pk-app select {
    min-height: var(--pk-tap);
  }
  /* Link dentro de parágrafo NÃO vira bloco de 44px: isso quebraria o texto
     corrido. A regra acima alcança o link de navegação, que é o que se toca. */
  .pk-app p a,
  .pk-app li a,
  .pk-app td a { min-height: 0; }

  /* Quatro alvos que o portal eleva (portal.css:785-787) e que a cópia para cá
     deixou para trás. Três são <a> ou <button> e a regra acima já os apanha; o
     `.pk-combo__opt` é <div> e escapa dos dois — por isso tem linha própria.
     Sem ela, a opção de um combobox continua com 10px 12px no celular. */
  .pk-app .pk-combo__opt { min-height: var(--pk-tap); }
  .pk-app .pk-chip       { min-height: var(--pk-tap); padding: 10px 16px; }
}

/* =====================================================================
   3. MOVIMENTO — respeitar quem pediu para parar

   `prefers-reduced-motion` não é preferência estética: é acessibilidade para
   quem tem enjoo de movimento (vestibular). Seis plugins do parque ignoravam.
   Zera-se a duração em vez de remover a transição, para nenhum estado ficar
   preso a meio caminho.
   ===================================================================== */
@media (prefers-reduced-motion: reduce) {
  .pk-app *,
  .pk-app *::before,
  .pk-app *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* =====================================================================
   4. ESTADO VAZIO, CARREGANDO E ERRO — um vocabulário, não sete

   O parque tinha `.krimbo-empty`, `.lsb-empty`, `.fp-empty`, `.lsd-dev-empty`,
   `.empty-state`, `.crm-empty` e `.fp-empty-state` — sete jeitos de dizer a
   mesma coisa, cada um desenhado diferente. É a tela que a pessoa mais vê
   quando algo dá errado, e a que menos recebe atenção.
   ===================================================================== */
.pk-vazio {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--pk-sp-2);
  padding: 48px 24px;
  text-align: center;
  color: var(--pk-ink-2);
}
.pk-vazio__icone {
  width: 44px; height: 44px;
  color: var(--pk-ink-3);
  opacity: .75;
}
.pk-vazio__titulo {
  font-size: var(--pk-text-lg);
  font-weight: 600;
  color: var(--pk-ink);
}
/* A frase que diz O QUE FAZER, e não só que está vazio. "Nenhum resultado"
   informa; "Nenhum resultado — tente outro período" resolve. */
.pk-vazio__dica { font-size: var(--pk-text-sm); color: var(--pk-ink-2); max-width: 46ch; }

.pk-carregando {
  display: inline-flex; align-items: center; gap: var(--pk-sp-2);
  color: var(--pk-ink-2); font-size: var(--pk-text-sm);
}
.pk-carregando::before {
  content: ""; width: 14px; height: 14px; flex: none;
  border: 2px solid var(--pk-border);
  border-top-color: var(--pk-green-dark);
  border-radius: 50%;
  animation: pk-girar .7s linear infinite;
}
@keyframes pk-girar { to { transform: rotate(360deg); } }

/* =====================================================================
   5. A FORMA DO BOTÃO — o que faz parecer da mesma família

   Escrita em 2026-08-26, depois da medição que mostrou 16 nomes de classe
   para "botão" no parque, 87 valores de `padding` e 9 usos do `.pk-btn`
   oficial fora deste plugin. O padrão existia e ninguém o usava, porque a
   peça oficial cimentava FORMA e COR juntas: quem tinha um botão vermelho
   não conseguia usá-la sem sobrescrever, e sobrescrever é como se cria
   retalho.

   Aqui a forma é da casa e a cor é de quem usa. Migrar um botão deixa de
   ser "escolher um modelo" e vira SUBTRAÇÃO: apaga-se o que é forma da
   regra local e deixa-se o `background`/`color`, que era o legítimo.

   🔴 O QUE ESTA CAMADA NÃO IMPÕE, E POR QUÊ — foi medido antes de escrever.
   `padding`, `min-height` e `font-size` variam LEGITIMAMENTE por tamanho:
   `.fp-btn--sm` existe e está certo. E impor não é possível sem estragá-lo,
   porque `.pk-app .fp-btn` vale (0,2,0) e vence `.fp-btn--sm` (0,1,0) — o
   botão pequeno viraria grande em toda tela do parque, sem aviso.

   O que sobra é justamente o que NÃO varia com o tamanho, e é o que faz o
   olho reconhecer a família: o canto, a letra, o peso e o gesto. Um botão
   pequeno e um grande da mesma casa parecem irmãos por causa disto, não do
   padding. Densidade continua sendo vocabulário (--pk-pad-*), não imposição.

   O resto — os paddings e alturas que divergem sem motivo — é trabalho do
   dedo-duro na aba Decidir: ele aponta, alguém decide, e vira card.
   ===================================================================== */

.pk-app .pk-btn,
.pk-app .btn,
.pk-app .fp-btn,
.pk-app .lsd-btn,
.pk-app .crm-btn,
.pk-app .dc-btn,
.pk-app .fw-btn,
.pk-app .wd-btn-lego,
.pk-app .filter-btn,
.pk-app .period-btn,
.pk-app .perf-filter-btn,
.pk-app .bk-back-button,
.pk-app .bk-term-filter-btn,
.pk-app .nav-btn,
.pk-app .refresh-btn,
.pk-app .back-btn,
.pk-app .back-button,
.pk-app .close-btn,
.pk-app .copy-btn,
.pk-app .lsd-copy-btn,
.pk-app .clear-btn,
.pk-app .download-btn,
.pk-app .fp-pub-btn,
.pk-app .krimbo-nav-acao,
/* 2026-09-23 (g6-familia-12), um a um, lendo o markup: são a PEÇA — <button>
   ou <a> com rótulo/ícone —, não o contêiner nem o ícone dentro dela.
   krimbo-act (board/queue: "mover", "reenviar"), krimbo-proj-edit (o lápis do
   projeto), lsd-row-action (ações da linha de dispositivo), lsb-linkaction
   (ações do cabeçalho dos Backups). Todos já eram inline-flex centrado; o que
   muda é o canto (10 → 12px), o peso (600 → 700) e o gesto.
   ⚠️ FICARAM DE FORA, de propósito: lsd-view-btn e fp-viewtoggle__btn são
   SEGMENTOS de um alternador (o canto é do contêiner, com overflow hidden —
   canto no segmento arredondaria a emenda do meio); fp-help-toggle e
   btn-expand são círculos de propósito. */
.pk-app .krimbo-act,
.pk-app .krimbo-proj-edit,
.pk-app .lsd-row-action,
.pk-app .lsb-linkaction {
  /* O canto. Um só valor, e é o que mais se vê de longe. */
  border-radius: var(--pk-radius-sm);

  /* A letra. Sem isto o plugin herda o Inter do Tabler e a tela inteira
     muda de voz — depois da cor, é a quebra de identidade mais visível. */
  font-family: var(--pk-font);
  font-weight: 700;
  letter-spacing: .3px;

  /* O arranjo. `gap` só tem efeito quando há ícone ao lado do rótulo; num
     botão de texto puro não custa nada. */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--pk-sp-2);

  cursor: pointer;

  /* 🔴 `all` de propósito, e a razão é uma regressão medida neste plugin.
     A lista explícita que estava no .pk-btn (`background, box-shadow,
     transform`) não cobria `color` nem `border-color` — e o modificador
     `--ghost` muda as duas no hover. Resultado: a borda do ghost saltava de
     cor enquanto a do .pk-iconbtn deslizava, no mesmo arquivo. Trocar `all`
     por lista é uma otimização real, mas ela transforma uma regra uniforme
     por construção em N regras que dependem de alguém lembrar de todas. Aqui
     o botão não anima layout, então `all` não tem o custo que a otimização
     evitava. É o que o portal sempre fez (portal.css:594). */
  transition: all var(--pk-ease);
}

/* 🔴 O BOTÃO QUE É O PRÓPRIO ÍCONE (2026-09-23). O core monta o "i" ao lado dos
   dropdowns como `<span class="fas btn btn-outline-secondary fa-info fa-fw">`
   (src/Html.php:3407): a fonte do glifo vem de `.fas` (0,1,0), e a regra acima
   (0,2,0) trocava por Outfit — o \f129 saía numa fonte sem aquele glifo e
   aparecia um quadradinho vazio (fp-estoque, selects de Modelo e Fabricante).
   Aqui a família e o peso do Font Awesome voltam só para botão que É ícone;
   canto, arranjo e gesto da casa continuam valendo para ele.
   Seletor COMPOSTO (`.btn.fas`) de propósito: o dedo-duro do Blueprint
   (Conformidade::imposicao) só lê `.pk-app .<uma classe>`, e isto é exceção
   de fonte, não forma nova de família. */
.pk-app .btn.fas,
.pk-app .btn.fa-solid {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  letter-spacing: normal;
}
.pk-app .btn.far,
.pk-app .btn.fa-regular {
  font-family: "Font Awesome 6 Free";
  font-weight: 400;
  letter-spacing: normal;
}
.pk-app .btn.fab,
.pk-app .btn.fa-brands {
  font-family: "Font Awesome 6 Brands";
  font-weight: 400;
  letter-spacing: normal;
}
.pk-app .btn.fa {
  font-family: var(--fa-style-family, "Font Awesome 6 Free");
  font-weight: var(--fa-style, 900);
  letter-spacing: normal;
}

/* O estado desligado é forma, não cor: ele diz "não clique", e precisa
   dizer igual em toda tela. Faltava em 14 dos 16 nomes de botão. */
.pk-app .pk-btn[disabled],  .pk-app .btn[disabled],
.pk-app .fp-btn[disabled],  .pk-app .lsd-btn[disabled],
.pk-app .crm-btn[disabled], .pk-app .dc-btn[disabled],
.pk-app [class*="btn"][disabled],
.pk-app [class*="btn"][aria-disabled="true"] {
  opacity: .6;
  cursor: not-allowed;
  transform: none;
}

/* =====================================================================
   6. AS OUTRAS FAMÍLIAS — mesma regra, mesma contenção

   Escritas em 2026-08-26, depois do botão e pelo mesmo critério: impõe-se o
   que NÃO varia com o tamanho nem com a intenção — o canto e a letra —, e
   deixa-se de fora o que varia por motivo legítimo.

   🔴 DUAS COISAS QUE NÃO SE IMPÕE AQUI, e cada uma quebraria algo:

     `padding` e `font-size` — variam por densidade. Um campo de filtro é mais
        compacto que um campo de formulário, e os dois estão certos.

     `border-width`/`border-style` SOZINHOS — declarar `1px solid` sem cor faz
        a borda herdar `currentColor`, ou seja, a cor do TEXTO. Um card que hoje
        não tem borda ganharia uma borda escura. Onde a borda é imposta (o
        CARTÃO, abaixo), ela vai inteira, com a cor: `1px solid --pk-hairline`.

   ⚠️ ERAM TRÊS até 2026-09-24. A terceira dizia que `box-shadow` em card não
   se impõe, porque "elevação é eixo legítimo de variação" (decisão de 26/08).
   O dono decidiu o contrário, olhando as telas lado a lado: VIDRO DO PORTAL EM
   TODOS OS CARTÕES, inclusive os pequenos de quadro e Kanban — fundo
   `--pk-glass`, desfoque, fio de 1px, sombra de repouso e flutuação no hover.
   A medição que embasou a decisão (g6-familia-03): de 251 cartões do parque,
   167 eram papel branco opaco e 172 tinham a sombra rasa de 1–3px; o material
   do portal aparecia em 23. Era a diferença que mais separava plugin de portal.
   O bloco CARD, abaixo, é onde isso passou a valer.

   ⚠️ AS LISTAS SÃO CURADAS À MÃO, e isso é deliberado. A extração automática
   dos nomes que divergem devolve `form-group` e `filter-input-wrapper` (que são
   CONTÊINERES de campo), `card-icon` e `menu-card-icon` (o ícone DENTRO do
   card), `nav-link`, `lsb-alert-items` (plural: a lista, não o item) e `lbl`/
   `val` (genéricos demais para tocar). A heurística do analisador chama de
   botão o que tem `cursor:pointer + raio + padding`, e de card o que tem
   `raio + padding + fundo` — o que apanha o invólucro junto com a peça.
   Injetar forma de campo num contêiner de campo muda layout sem aviso.
   ===================================================================== */

/* --- CAMPO ----------------------------------------------------------
   `.pk-field`, `.form-group` e os `*-wrapper` ficam FORA: são o invólucro
   (`flex-direction: column`), não o campo. */
.pk-app .pk-input,
.pk-app .pk-textarea,
.pk-app .pk-select,
.pk-app .form-control,
.pk-app .form-select,
.pk-app .form-input,
.pk-app .filter-input,
.pk-app .lsd-input,
.pk-app .fp-input,
.pk-app .dc-input,
.pk-app .crm-input,
.pk-app .bk-input,
.pk-app .wd-input,
/* 2026-09-23 (g6-familia-08): campos de plugin que declaram canto próprio
   (10px) e saíam com os 4px do core — lidos no markup, todos <input>/<select>/
   <textarea> e nenhum invólucro. A densidade (padding, corpo) fica com eles. */
.pk-app .crm-select,
.pk-app .crm-textarea,
.pk-app .lsd-wty-date,
.pk-app .lsd-wty-src,
.pk-app .lsd-reports__select,
.pk-app .lsd-reports__input-num,
.pk-app .lsd-dev-field__input,
.pk-app .lsd-config-input,
.pk-app .date-input-native {
  border-radius: var(--pk-radius-sm);
  font-family: var(--pk-font);
  transition: all var(--pk-ease);
}

/* 🔴 O CANTO, DE NOVO E COM `!important`, PARA QUEM O CORE ROUBA.
   Medido em 2026-09-09: `css/legacy/includes/_inputs.scss:34` alcança todo
   `<input>` que NÃO tenha `.form-control`, com dez `:not()` encadeados —
   especificidade **(0,10,1)** contra os (0,2,0) da regra acima — e impõe
   `border-radius: 4px`. A forma da casa nunca chegava a campo de plugin sem
   `.form-control`, e são 66 campos assim no parque.
   Descobri aplicando: no `agendapcnet`, apagada a regra local, o `.filter-input`
   não foi para os 12px da casa — foi para os **4px do Tabler**. Alinhar campo
   por subtração produzia o contrário do que o padrão pede.
   Vencer por especificidade exigiria onze classes no seletor; `!important` com o
   arquivo e a linha do core escritos ao lado é o que esta casa já faz para o
   tema escuro, e o que o CLAUDE.md do servidor prescreve para esta classe.

   ⚠️ `.form-control` e `.form-select` FICAM DE FORA desta regra, de propósito:
   o core os exclui nos `:not()`, então não precisam — e forçá-los quebraria o
   `input-group`, cujos cantos são assimétricos por desenho (medido: `6px 0 0 6px`
   num campo de busca com botão colado). Imposição só onde há roubo. */
.pk-app .form-input,
.pk-app .filter-input,
.pk-app .lsd-input,
.pk-app .fp-input,
.pk-app .dc-input,
.pk-app .crm-input,
.pk-app .bk-input,
.pk-app .wd-input,
.pk-app .pk-input,
.pk-app .pk-textarea,
.pk-app .pk-select,
.pk-app .crm-select,
.pk-app .crm-textarea,
.pk-app .lsd-wty-date,
.pk-app .lsd-wty-src,
.pk-app .lsd-reports__select,
.pk-app .lsd-reports__input-num,
.pk-app .lsd-dev-field__input,
.pk-app .lsd-config-input,
.pk-app .date-input-native {
  border-radius: var(--pk-radius-sm) !important;
}

/* --- SELO -----------------------------------------------------------
   O selo é pílula por definição — é o que o distingue de um retângulo com
   fundo. Peso e espaçamento entram porque selo é texto curto em caixa
   pequena: sem eles, deixa de ser legível como rótulo. */
.pk-app .pk-badge,
.pk-app .pk-status,
.pk-app .status-badge,
.pk-app .sla-badge,
.pk-app .perf-badge,
.pk-app .admin-badge,
.pk-app .group-badge,
.pk-app .change-badge,
.pk-app .cf-item-status,
.pk-app .fp-pub-pill,
.pk-app .lsd-filter-pill,
.pk-app .perf-kpi-pill,
/* 2026-09-23 (g6-familia-05), um a um no markup: todos <span> de texto curto.
   FICARAM DE FORA: fp-notif-pill (é um <label> com checkbox — um alternador,
   não um rótulo) e fw-kpi-pill (é um KPI com rótulo e número dentro; peso de
   selo no contêiner engrossaria o rótulo). A .company-badge do painel de TV
   continua fora (a TV da agenda não tem exceção de peça; a única do
   agendapcnet é de TEMA — corrigido em 2026-09-28).
   ⚠️ E `crm-badge` foi tentado e SAIU, medido na prévia: no kanban do CRM a
   etiqueta "Retorno p/ feedback: Atrasado N dias" é `nowrap` e já ocupa a
   largura toda do cartão; com 700 e o espaçamento da casa ela passa da coluna,
   o cartão alarga 15px além da lista e 2.236 elementos mudam de tamanho. Entra
   quando o crmpcnet deixar a etiqueta quebrar linha (tarefa local). */
.pk-app .krimbo-badge,
.pk-app .fp-chip,
.pk-app .fp-badge,
.pk-app .fp-rec-chip,
.pk-app .fp-invchip,
.pk-app .fp-fonte-badge,
.pk-app .lsd-wty-badge,
.pk-app .lsd-status-badge,
.pk-app .lsd-dev-badge,
.pk-app .lsd-sec-badge,
.pk-app .dias-badge,
.pk-app .prio-badge,
.pk-app .range-badge,
.pk-app .count-badge,
.pk-app .dc-chip,
.pk-app .vehicle-badge,
.pk-app .cvss-pill {
  border-radius: var(--pk-radius-pill);
  font-family: var(--pk-font);
  font-weight: 700;
  letter-spacing: .3px;
  transition: all var(--pk-ease);
}

/* --- ALERTA ---------------------------------------------------------
   `lsb-alert-items` (plural) é a LISTA e fica de fora; `bk-alert-count` é um
   contador, não um alerta. */
.pk-app .pk-alert,
.pk-app .fp-alert,
.pk-app .fp-spec-alerta,
.pk-app .lsd-alert,
.pk-app .lsb-alert-item,
.pk-app .crm-toast {
  border-radius: var(--pk-radius);
  font-family: var(--pk-font);
}

/* --- CARD -----------------------------------------------------------
   Raio grande (16px), que é o que distingue card de botão à distância — e,
   desde 2026-09-24, o MATERIAL do portal: vidro, fio e sombra de repouso.

   🔴 A DECISÃO DO DONO (2026-09-24): "vidro do portal em TODOS os cartões",
   inclusive os pequenos de quadro e Kanban. Os valores são os do `.fw-card` /
   `.fw-panel` do portal (portal.css:460 e :414) e os do `.pk-card` deste host:
   `--pk-glass` (.72), desfoque `blur(16px) saturate(1.3)`, fio de 1px
   `--pk-hairline`, `--pk-shadow-rest`; no hover, `--pk-glass-2` (.85),
   `--pk-hairline-hover` e `--pk-shadow-float`. Os tokens mudam com o tema, então
   a mesma regra serve ao escuro (vidro musgo, sombra preta).

   🎨 O VIDRO ACEITA COR — `--pk-card-tom` (ajuste do dono no mesmo dia: "os
   cards de dashboard têm que ser coloridos, como era no lansentinelbackups —
   efeito de vidro, mas com cor"). É o princípio do botão (`--pk-btn-bg/-fg`)
   aplicado ao cartão: a FORMA é da casa, a COR é de quem usa. O plugin põe
   `--pk-card-tom: var(--pk-danger)` (ou outra cor da casa) no cartão ou no
   modificador dele, e a camada tinge o vidro:
     fundo  color-mix(tom  --pk-card-tom-forca, --pk-glass)     (-2 no hover)
     fio    color-mix(tom  35%,                  --pk-hairline) (45% no hover)
   Sem `--pk-card-tom` o `var()` cai no próprio vidro, e misturar o vidro com
   ele mesmo devolve o vidro — o cartão neutro sai idêntico ao de hoje.
   ⚠️ A FORÇA NÃO É 18%, e foi medida (WCAG, vidro composto sobre a página):
   com 18% de `--pk-danger` no claro, a Tinta Fraca (#646c7d) cai a 3,85:1 e a
   Tinta Média a 4,24:1 — texto de meta e rótulo reprovando dentro do KPI.
   `--pk-card-tom-forca` é 8% no claro (pior caso: Tinta Fraca 4,51:1 sobre
   perigo) e 12% no escuro (pior caso: 4,60:1 sobre o verde da marca), com as
   cores cheias da casa. Um cartão cuja letra miúda seja só Tinta ou `-ink` pode
   subir a força por conta própria: a 18% o `-ink` pior fica em 4,64:1 no claro.

   ⚠️ O que NÃO entra, e é o mesmo limite do botão: `padding`, altura e corpo
   de letra — o cartão continua do tamanho que a tela desenhou (o erro de
   2026-09-01 foi trocar o tamanho junto com a aparência). Também não entra
   `transition`: impor uma lista mataria o `transform` de hover que vários
   cartões animam (lsd-stat-card, dc-kpi, fp-kpi); a lista de cada plugin fica.

   🔴 O DESFOQUE É LITERAL, nunca `var()`: o WebKit (todo iPhone, inclusive
   Chrome e Firefox no iOS) descarta a propriedade inteira quando há `var()`
   dentro de `backdrop-filter` — e sem o prefixo `-webkit-` o Safari anterior
   ao 18 também não desenha. (`var()` dentro de `color-mix()` não tem esse
   problema: a armadilha é de `filter`/`backdrop-filter`/`mask`.)

   ⚠️ QUEM TEM ESPECIFICIDADE MAIOR CONTINUA COM O SEU: `.dpc-app .kpi-card`,
   `.wd-app .kpi-card`, `.dfw-app .host-card` e o `.location-card` do
   agendapcnet (0,4,0) vencem esta regra no fundo, na borda e na sombra — deles
   chega só o desfoque, que sobre fundo opaco não se vê. A subtração é tarefa de
   cada plugin, e a casa já supre o que eles apagarem.

   ⚠️ E A FAIXA LATERAL SAI JUNTO onde a regra do plugin é (0,1,0): o `border`
   daqui iguala os quatro lados em 1px (decisão 2 do dono: prioridade e estado
   vão na pastilha, com palavra e cor — krimbo, lsb e CRM já têm a pastilha).
   Onde a cor da faixa vem de `style=""` ou de modificador (0,2,0) carregado
   depois, sobra um fio de 1px daquela cor até o plugin limpar. */
:root {
  --pk-card-tom-forca: 8%;   /* @param · claro; o escuro redefine (pcnetui-tema-escuro.css) */
  /* sombra do cartão em grade cheia (ver "SOMBRA CURTA EM GRADE CHEIA") */
  --pk-shadow-grade:       0 4px 12px rgba(16, 38, 6, .14);
  --pk-shadow-grade-float: 0 10px 22px rgba(16, 38, 6, .22);
}
.pk-app .pk-card,
.pk-app .pk-panel,
.pk-app .card,
.pk-app .menu-card,
.pk-app .chart-card,
.pk-app .fp-stack-card,
.pk-app .fp-card,
.pk-app .dc-card,
.pk-app .crm-card,
.pk-app .lsd-card,
.pk-app .krimbo-card,
.pk-app .fp-evid-card,
.pk-app .breakdown-card,
/* 2026-09-23 (g6-familia-12), um a um no markup: <section>/<article>/<div>
   que é o próprio cartão, nunca o -header/-body dele.
   ⚠️ `ranking-card` ficou de fora: em metrics/index.php ele é o INVÓLUCRO do
   ranking dentro de um .chart-card (sem fundo nem borda), e só em
   report_performance.php é cartão — nome com dois papéis não entra.
   2026-09-24 (decisão 1 do dono), um a um no markup — o elemento que É o
   cartão, nunca o -body/-title/-icon nem a grade em volta:
   crm-kanban-card <div> do Kanban · krimbo-proj <a> de projeto · krimbo-stat
   (ui.class.php:417) · lsd-device-card (visão em grade) · lsd-dl-card <a> do
   "Baixar agente" · lsd-dev-summary-card (resumo da ficha) · location-card (o
   `.card` do agendapcnet) · mpc-card (já era vidro; entra a sombra) · dc-kpi e
   fp-kpi <a> de número (a cor deles está só no ícone — ganham tom se o plugin
   quiser) · ltz-card e ltz-kpi · data-card do Wazuh · table-card, report-card
   e report-form-card do dashboardpcnet · host-card do firewall.
   FICARAM DE FORA em 2026-09-24: `config-card`, `technician-card`/`client-card`,
   `lsd-dev-section--card` e `crm-stat` — os motivos de então (folha morta, TV
   como exceção, CSS sem markup) caíram em 2026-09-28, ver abaixo.
   2026-09-28 (Onda B: decisão 1 do dono, "vidro do portal em TODOS os
   cartões", e o KPI colorido de 24–25/09), um a um no markup vivo — o
   elemento que É o cartão ou o painel, nunca o -body/-head/-icon nem a grade:
   crm-stat <div> de número (TEM markup: front/dashboard.php, report.php,
   migrate.php e inc/prospect.class.php — o "CSS morto" de 24/09 estava
   errado) · fw-timeline-section, fw-classified-item e fw-modal__period-card
   (os dois últimos montados pelo dashboard.js dentro da .dfw-app) ·
   config-card (a dfw-config.css é ligada desde 2026-09-23: era órfã, não
   morta) · fw-menu-card (já tinha o vidro no bloco do card de menu; ganha
   canto, letra e a sombra de grade) · report-header, insights-section e
   table-section dos relatórios do dpc (o <header> é o painel de topo da tela,
   não o -header de um cartão) · kpi-summary (a faixa É o cartão; os kpi-item
   dentro só têm divisória) · cf-item · fp-summary__cell (cada célula tem
   fundo e fio próprios) · fp-section, fp-timeline, fp-filterbar,
   fp-solic-card, fp-rec-card, fp-notif-canal e fp-nav (<article> de cartão,
   apesar do nome) · timeline-item e no-history-content do histórico da
   agenda (o core usa `.timeline-item` na timeline do chamado, mas nenhuma
   `.pk-app` a envolve — conferido) · location-section, tech-card e
   client-card do painel de TV (a exceção declarada dele é só de TEMA, `.ap-tv`
   abre escuro; não de cartão) · lsd-entity-banner, lsd-filters,
   lsd-device-row, lsd-pagination, lsd-dev-status-strip, lsd-config-section e
   os blocos de relatório lsd-reports__tab (o <a> em ladrilho: ícone, título,
   subtítulo — o `.is-active` do plugin, mesmo peso e carregado depois,
   continua pintando a ativa), __panel, __chart e __table-block · e, como
   CARTÃO DE NÚMERO (ver "MAIS COR" abaixo), fw-kpi-pill, perf-kpi-pill,
   fp-notif-tile, fp-fattile e lsd-reports__kpi.
   RECUSADOS em 2026-09-28: `main-dashboard` (agendapcnet/history.php — é a
   moldura da tela inteira, com cabeçalho, navegação, filtros e a lista
   dentro; o hover da casa acenderia a página toda) e `lsd-upd-kpi` (não
   existe em markup nenhum: os números de updates.php são <div> anônimos da
   `.lsd-upd-grid`, dentro de `.lsd-card.lsd-upd-card`, que já é vidro).
   Seguem de fora: `technician-card` (só no js/panel.js) e
   `lsd-dev-section--card` (não pedidos nesta rodada).
   ⚠️ Modificador de estado em (0,1,0) PERDE para esta regra: a cor dele tem
   de virar `--pk-card-tom` no plugin (`.lsd-device-row-online/-offline/
   -unknown`, `.fp-nav--erro`, `.ltz-kpi--atraso`, `.lsd-reports__kpi--*`). */
.pk-app .crm-kanban-card,
.pk-app .krimbo-proj,
.pk-app .krimbo-stat,
.pk-app .lsd-device-card,
.pk-app .lsd-dl-card,
.pk-app .lsd-dev-summary-card,
.pk-app .location-card,
.pk-app .mpc-card,
.pk-app .dc-kpi,
.pk-app .fp-kpi,
.pk-app .ltz-card,
.pk-app .ltz-kpi,
.pk-app .data-card,
.pk-app .table-card,
.pk-app .report-card,
.pk-app .report-form-card,
.pk-app .host-card,
/* 2026-09-28 (Onda B) — ver o comentário acima. */
.pk-app .crm-stat,
.pk-app .fw-timeline-section,
.pk-app .config-card,
.pk-app .fw-modal__period-card,
.pk-app .fw-classified-item,
.pk-app .fw-menu-card,
.pk-app .report-header,
.pk-app .insights-section,
.pk-app .table-section,
.pk-app .kpi-summary,
.pk-app .cf-item,
.pk-app .fp-summary__cell,
.pk-app .fp-section,
.pk-app .fp-timeline,
.pk-app .fp-filterbar,
.pk-app .fp-solic-card,
.pk-app .fp-rec-card,
.pk-app .fp-notif-canal,
.pk-app .fp-nav,
.pk-app .timeline-item,
.pk-app .no-history-content,
.pk-app .location-section,
.pk-app .tech-card,
.pk-app .client-card,
.pk-app .lsd-entity-banner,
.pk-app .lsd-filters,
.pk-app .lsd-device-row,
.pk-app .lsd-pagination,
.pk-app .lsd-dev-status-strip,
.pk-app .lsd-reports__tab,
.pk-app .lsd-reports__panel,
.pk-app .lsd-reports__chart,
.pk-app .lsd-reports__table-block,
.pk-app .lsd-config-section,
.pk-app .fw-kpi-pill,
.pk-app .perf-kpi-pill,
.pk-app .fp-notif-tile,
.pk-app .fp-fattile,
.pk-app .lsd-reports__kpi {
  border-radius: var(--pk-radius);
  font-family: var(--pk-font);
  background: color-mix(in srgb, var(--pk-card-tom, var(--pk-glass)) var(--pk-card-tom-forca, 8%), var(--pk-glass));
  -webkit-backdrop-filter: blur(16px) saturate(1.3);
          backdrop-filter: blur(16px) saturate(1.3);
  border: 1px solid color-mix(in srgb, var(--pk-card-tom, var(--pk-hairline)) 35%, var(--pk-hairline));
  box-shadow: var(--pk-shadow-rest);
}

/* OS CARTÕES DE NÚMERO QUE JÁ TÊM COR — a casa PREENCHE, não apaga.
   Ajuste do dono (2026-09-24): o KPI de dashboard continua colorido. Estes
   cinco pintam hoje o próprio fundo por estado (degradê azul/verde/vermelho do
   Inventário, bloco colorido dos Backups, `.kpi-card`/`.stat-card`/`.ins-kpi`
   dos painéis), e o vidro neutro imposto em (0,2,0) apagaria essa cor em quem
   a declara em (0,1,0) — `.lsd-stat-total` sairia branco.
   Por isso a SUPERFÍCIE deles vai em (0,1,0) — `:where(.pk-app)` zera o peso da
   caixa —, o mesmo peso da regra do plugin, que carrega depois e vence: enquanto
   o plugin pinta, fica a cor dele; quando ele apagar o próprio fundo e passar a
   dizer a cor por `--pk-card-tom`, a casa entrega o vidro tingido. A FORMA
   (canto e letra) segue em (0,2,0), como sempre foi para `kpi-card`/`stat-card`. */
.pk-app .kpi-card,
.pk-app .stat-card,
.pk-app .lsd-stat-card,
.pk-app .lsb-kpi,
.pk-app .ins-kpi {
  border-radius: var(--pk-radius);
  font-family: var(--pk-font);
}
:where(.pk-app) .kpi-card,
:where(.pk-app) .stat-card,
:where(.pk-app) .lsd-stat-card,
:where(.pk-app) .lsb-kpi,
:where(.pk-app) .ins-kpi {
  background: color-mix(in srgb, var(--pk-card-tom, var(--pk-glass)) var(--pk-card-tom-forca, 8%), var(--pk-glass));
  -webkit-backdrop-filter: blur(16px) saturate(1.3);
          backdrop-filter: blur(16px) saturate(1.3);
  border: 1px solid color-mix(in srgb, var(--pk-card-tom, var(--pk-hairline)) 35%, var(--pk-hairline));
  box-shadow: var(--pk-shadow-rest);
}

/* O HOVER, EM DOIS PESOS — e a diferença é o que evita o cartão "virar" outro
   ao passar o mouse.
   Fundo e fio vão em (0,2,0) — `:where()` zera o peso do nome, um nome por
   `:where()` para o analisador do Blueprint, que divide seletor na vírgula —,
   o MESMO peso da regra de repouso acima: ganham dela por ordem, mas perdem
   para o plugin que ainda pinta o cartão com regra (0,2,0) carregada depois
   (`.wd-app .data-card`, `.dfw-app .host-card`). Com (0,3,0) aquele cartão
   ficava opaco em repouso e vidro no hover.
   A sombra vai em (0,3,0), de propósito: os cartões (0,1,0) trazem um hover
   próprio (0,2,0) com a sombra rasa de antes (`--pk-shadow-md/-lg`), e com o
   mesmo peso ele venceria por ordem — o cartão AFUNDARIA ao receber o mouse,
   saindo dos 16px de repouso para 2–10px.
   Os cinco cartões de número coloridos têm o hover inteiro em (0,1,0), pelo
   mesmo motivo do repouso deles: a casa só preenche o que o plugin deixar.
   `@media (hover: hover)`: no toque o `:hover` gruda (iOS) e o cartão ficaria
   preso no estado de flutuação — é o que o `.pk-card` já trata e o portal
   também (portal.css:793). */
@media (hover: hover) {
  .pk-app :where(.pk-card):hover,
  .pk-app :where(.pk-panel):hover,
  .pk-app :where(.card):hover,
  .pk-app :where(.menu-card):hover,
  .pk-app :where(.chart-card):hover,
  .pk-app :where(.fp-stack-card):hover,
  .pk-app :where(.fp-card):hover,
  .pk-app :where(.dc-card):hover,
  .pk-app :where(.crm-card):hover,
  .pk-app :where(.lsd-card):hover,
  .pk-app :where(.krimbo-card):hover,
  .pk-app :where(.fp-evid-card):hover,
  .pk-app :where(.breakdown-card):hover,
  .pk-app :where(.crm-kanban-card):hover,
  .pk-app :where(.krimbo-proj):hover,
  .pk-app :where(.krimbo-stat):hover,
  .pk-app :where(.lsd-device-card):hover,
  .pk-app :where(.lsd-dl-card):hover,
  .pk-app :where(.lsd-dev-summary-card):hover,
  .pk-app :where(.location-card):hover,
  .pk-app :where(.mpc-card):hover,
  .pk-app :where(.dc-kpi):hover,
  .pk-app :where(.fp-kpi):hover,
  .pk-app :where(.ltz-card):hover,
  .pk-app :where(.ltz-kpi):hover,
  .pk-app :where(.data-card):hover,
  .pk-app :where(.table-card):hover,
  .pk-app :where(.report-card):hover,
  .pk-app :where(.report-form-card):hover,
  .pk-app :where(.host-card):hover,
  .pk-app :where(.crm-stat):hover,
  .pk-app :where(.fw-timeline-section):hover,
  .pk-app :where(.config-card):hover,
  .pk-app :where(.fw-modal__period-card):hover,
  .pk-app :where(.fw-classified-item):hover,
  .pk-app :where(.fw-menu-card):hover,
  .pk-app :where(.report-header):hover,
  .pk-app :where(.insights-section):hover,
  .pk-app :where(.table-section):hover,
  .pk-app :where(.kpi-summary):hover,
  .pk-app :where(.cf-item):hover,
  .pk-app :where(.fp-summary__cell):hover,
  .pk-app :where(.fp-section):hover,
  .pk-app :where(.fp-timeline):hover,
  .pk-app :where(.fp-filterbar):hover,
  .pk-app :where(.fp-solic-card):hover,
  .pk-app :where(.fp-rec-card):hover,
  .pk-app :where(.fp-notif-canal):hover,
  .pk-app :where(.fp-nav):hover,
  .pk-app :where(.timeline-item):hover,
  .pk-app :where(.no-history-content):hover,
  .pk-app :where(.location-section):hover,
  .pk-app :where(.tech-card):hover,
  .pk-app :where(.client-card):hover,
  .pk-app :where(.lsd-entity-banner):hover,
  .pk-app :where(.lsd-filters):hover,
  .pk-app :where(.lsd-device-row):hover,
  .pk-app :where(.lsd-pagination):hover,
  .pk-app :where(.lsd-dev-status-strip):hover,
  .pk-app :where(.lsd-reports__tab):hover,
  .pk-app :where(.lsd-reports__panel):hover,
  .pk-app :where(.lsd-reports__chart):hover,
  .pk-app :where(.lsd-reports__table-block):hover,
  .pk-app :where(.lsd-config-section):hover,
  .pk-app :where(.fw-kpi-pill):hover,
  .pk-app :where(.perf-kpi-pill):hover,
  .pk-app :where(.fp-notif-tile):hover,
  .pk-app :where(.fp-fattile):hover,
  .pk-app :where(.lsd-reports__kpi):hover {
    background: color-mix(in srgb, var(--pk-card-tom, var(--pk-glass-2)) var(--pk-card-tom-forca, 8%), var(--pk-glass-2));
    border-color: color-mix(in srgb, var(--pk-card-tom, var(--pk-hairline-hover)) 45%, var(--pk-hairline-hover));
  }
  .pk-app .pk-card:hover,
  .pk-app .pk-panel:hover,
  .pk-app .card:hover,
  .pk-app .menu-card:hover,
  .pk-app .chart-card:hover,
  .pk-app .fp-stack-card:hover,
  .pk-app .fp-card:hover,
  .pk-app .dc-card:hover,
  .pk-app .crm-card:hover,
  .pk-app .lsd-card:hover,
  .pk-app .krimbo-card:hover,
  .pk-app .fp-evid-card:hover,
  .pk-app .breakdown-card:hover,
  .pk-app .crm-kanban-card:hover,
  .pk-app .krimbo-proj:hover,
  .pk-app .krimbo-stat:hover,
  .pk-app .lsd-device-card:hover,
  .pk-app .lsd-dl-card:hover,
  .pk-app .lsd-dev-summary-card:hover,
  .pk-app .location-card:hover,
  .pk-app .mpc-card:hover,
  .pk-app .dc-kpi:hover,
  .pk-app .fp-kpi:hover,
  .pk-app .ltz-card:hover,
  .pk-app .ltz-kpi:hover,
  .pk-app .data-card:hover,
  .pk-app .table-card:hover,
  .pk-app .report-card:hover,
  .pk-app .report-form-card:hover,
  .pk-app .host-card:hover,
  .pk-app .crm-stat:hover,
  .pk-app .fw-timeline-section:hover,
  .pk-app .config-card:hover,
  .pk-app .fw-modal__period-card:hover,
  .pk-app .fw-classified-item:hover,
  .pk-app .fw-menu-card:hover,
  .pk-app .report-header:hover,
  .pk-app .insights-section:hover,
  .pk-app .table-section:hover,
  .pk-app .kpi-summary:hover,
  .pk-app .cf-item:hover,
  .pk-app .fp-summary__cell:hover,
  .pk-app .fp-section:hover,
  .pk-app .fp-timeline:hover,
  .pk-app .fp-filterbar:hover,
  .pk-app .fp-solic-card:hover,
  .pk-app .fp-rec-card:hover,
  .pk-app .fp-notif-canal:hover,
  .pk-app .fp-nav:hover,
  .pk-app .timeline-item:hover,
  .pk-app .no-history-content:hover,
  .pk-app .location-section:hover,
  .pk-app .tech-card:hover,
  .pk-app .client-card:hover,
  .pk-app .lsd-entity-banner:hover,
  .pk-app .lsd-filters:hover,
  .pk-app .lsd-device-row:hover,
  .pk-app .lsd-pagination:hover,
  .pk-app .lsd-dev-status-strip:hover,
  .pk-app .lsd-reports__tab:hover,
  .pk-app .lsd-reports__panel:hover,
  .pk-app .lsd-reports__chart:hover,
  .pk-app .lsd-reports__table-block:hover,
  .pk-app .lsd-config-section:hover,
  .pk-app .fw-kpi-pill:hover,
  .pk-app .perf-kpi-pill:hover,
  .pk-app .fp-notif-tile:hover,
  .pk-app .fp-fattile:hover,
  .pk-app .lsd-reports__kpi:hover {
    box-shadow: var(--pk-shadow-float);
  }
  :where(.pk-app .kpi-card):hover,
  :where(.pk-app .stat-card):hover,
  :where(.pk-app .lsd-stat-card):hover,
  :where(.pk-app .lsb-kpi):hover,
  :where(.pk-app .ins-kpi):hover {
    background: color-mix(in srgb, var(--pk-card-tom, var(--pk-glass-2)) var(--pk-card-tom-forca, 8%), var(--pk-glass-2));
    border-color: color-mix(in srgb, var(--pk-card-tom, var(--pk-hairline-hover)) 45%, var(--pk-hairline-hover));
    box-shadow: var(--pk-shadow-float);
  }
}

/* SOMBRA CURTA EM GRADE CHEIA — decisão do dono (2026-09-25).
   A sombra de repouso do portal (0 16px 34px) foi desenhada para dois cartões
   grandes sobre a malha. Numa grade cheia ela se soma entre as fileiras e vira
   uma névoa cinza (quadro de projetos do krimbo, Kanban do CRM), e dentro de
   coluna que rola ela é cortada nas laterais. Aqui o cartão continua vidro —
   só a sombra encurta. "Grade cheia" é:
     - o cartão de quadro/Kanban, sempre (fica numa coluna que rola);
     - qualquer cartão da família com 6 ou mais irmãos DA FAMÍLIA (a "quantity
       query": `:nth-last-child(n+6 of <família>)` pega o primeiro de um grupo de
       ≥6 e `~` pega os seguintes). Três cartões lado a lado continuam com a
       sombra do portal. Até 2026-09-28 a conta era de TODOS os filhos: no
       firewall, 4 KPIs + o botão Histórico + o filtro de Clientes davam 6, e os
       4 KPIs saíam com a sombra de grade.
   Peso: com o `of <família>`, a regra da grade é (0,4,0) no primeiro e (0,5,0)
   nos seguintes (o hover soma um) — vence o bloco acima por especificidade; a do quadro/Kanban é (0,2,0)/(0,3,0), igual à
   dele, e vence por vir depois. Os cartões de número entram logo abaixo, com
   o peso baixo que a superfície deles já tem. */
.pk-app :is(.pk-card, .pk-panel, .card, .menu-card, .chart-card, .fp-stack-card, .fp-card, .dc-card, .crm-card, .lsd-card, .krimbo-card, .fp-evid-card, .breakdown-card, .crm-kanban-card, .krimbo-proj, .krimbo-stat, .lsd-device-card, .lsd-dl-card, .lsd-dev-summary-card, .location-card, .mpc-card, .dc-kpi, .fp-kpi, .ltz-card, .ltz-kpi, .data-card, .table-card, .report-card, .report-form-card, .host-card, .crm-stat, .fw-timeline-section, .config-card, .fw-modal__period-card, .fw-classified-item, .fw-menu-card, .report-header, .insights-section, .table-section, .kpi-summary, .cf-item, .fp-summary__cell, .fp-section, .fp-timeline, .fp-filterbar, .fp-solic-card, .fp-rec-card, .fp-notif-canal, .fp-nav, .timeline-item, .no-history-content, .location-section, .tech-card, .client-card, .lsd-entity-banner, .lsd-filters, .lsd-device-row, .lsd-pagination, .lsd-dev-status-strip, .lsd-reports__tab, .lsd-reports__panel, .lsd-reports__chart, .lsd-reports__table-block, .lsd-config-section, .fw-kpi-pill, .perf-kpi-pill, .fp-notif-tile, .fp-fattile, .lsd-reports__kpi):nth-last-child(n+6 of .pk-card, .pk-panel, .card, .menu-card, .chart-card, .fp-stack-card, .fp-card, .dc-card, .crm-card, .lsd-card, .krimbo-card, .fp-evid-card, .breakdown-card, .crm-kanban-card, .krimbo-proj, .krimbo-stat, .lsd-device-card, .lsd-dl-card, .lsd-dev-summary-card, .location-card, .mpc-card, .dc-kpi, .fp-kpi, .ltz-card, .ltz-kpi, .data-card, .table-card, .report-card, .report-form-card, .host-card, .crm-stat, .fw-timeline-section, .config-card, .fw-modal__period-card, .fw-classified-item, .fw-menu-card, .report-header, .insights-section, .table-section, .kpi-summary, .cf-item, .fp-summary__cell, .fp-section, .fp-timeline, .fp-filterbar, .fp-solic-card, .fp-rec-card, .fp-notif-canal, .fp-nav, .timeline-item, .no-history-content, .location-section, .tech-card, .client-card, .lsd-entity-banner, .lsd-filters, .lsd-device-row, .lsd-pagination, .lsd-dev-status-strip, .lsd-reports__tab, .lsd-reports__panel, .lsd-reports__chart, .lsd-reports__table-block, .lsd-config-section, .fw-kpi-pill, .perf-kpi-pill, .fp-notif-tile, .fp-fattile, .lsd-reports__kpi),
.pk-app :is(.pk-card, .pk-panel, .card, .menu-card, .chart-card, .fp-stack-card, .fp-card, .dc-card, .crm-card, .lsd-card, .krimbo-card, .fp-evid-card, .breakdown-card, .crm-kanban-card, .krimbo-proj, .krimbo-stat, .lsd-device-card, .lsd-dl-card, .lsd-dev-summary-card, .location-card, .mpc-card, .dc-kpi, .fp-kpi, .ltz-card, .ltz-kpi, .data-card, .table-card, .report-card, .report-form-card, .host-card, .crm-stat, .fw-timeline-section, .config-card, .fw-modal__period-card, .fw-classified-item, .fw-menu-card, .report-header, .insights-section, .table-section, .kpi-summary, .cf-item, .fp-summary__cell, .fp-section, .fp-timeline, .fp-filterbar, .fp-solic-card, .fp-rec-card, .fp-notif-canal, .fp-nav, .timeline-item, .no-history-content, .location-section, .tech-card, .client-card, .lsd-entity-banner, .lsd-filters, .lsd-device-row, .lsd-pagination, .lsd-dev-status-strip, .lsd-reports__tab, .lsd-reports__panel, .lsd-reports__chart, .lsd-reports__table-block, .lsd-config-section, .fw-kpi-pill, .perf-kpi-pill, .fp-notif-tile, .fp-fattile, .lsd-reports__kpi):nth-last-child(n+6 of .pk-card, .pk-panel, .card, .menu-card, .chart-card, .fp-stack-card, .fp-card, .dc-card, .crm-card, .lsd-card, .krimbo-card, .fp-evid-card, .breakdown-card, .crm-kanban-card, .krimbo-proj, .krimbo-stat, .lsd-device-card, .lsd-dl-card, .lsd-dev-summary-card, .location-card, .mpc-card, .dc-kpi, .fp-kpi, .ltz-card, .ltz-kpi, .data-card, .table-card, .report-card, .report-form-card, .host-card, .crm-stat, .fw-timeline-section, .config-card, .fw-modal__period-card, .fw-classified-item, .fw-menu-card, .report-header, .insights-section, .table-section, .kpi-summary, .cf-item, .fp-summary__cell, .fp-section, .fp-timeline, .fp-filterbar, .fp-solic-card, .fp-rec-card, .fp-notif-canal, .fp-nav, .timeline-item, .no-history-content, .location-section, .tech-card, .client-card, .lsd-entity-banner, .lsd-filters, .lsd-device-row, .lsd-pagination, .lsd-dev-status-strip, .lsd-reports__tab, .lsd-reports__panel, .lsd-reports__chart, .lsd-reports__table-block, .lsd-config-section, .fw-kpi-pill, .perf-kpi-pill, .fp-notif-tile, .fp-fattile, .lsd-reports__kpi) ~ :is(.pk-card, .pk-panel, .card, .menu-card, .chart-card, .fp-stack-card, .fp-card, .dc-card, .crm-card, .lsd-card, .krimbo-card, .fp-evid-card, .breakdown-card, .crm-kanban-card, .krimbo-proj, .krimbo-stat, .lsd-device-card, .lsd-dl-card, .lsd-dev-summary-card, .location-card, .mpc-card, .dc-kpi, .fp-kpi, .ltz-card, .ltz-kpi, .data-card, .table-card, .report-card, .report-form-card, .host-card, .crm-stat, .fw-timeline-section, .config-card, .fw-modal__period-card, .fw-classified-item, .fw-menu-card, .report-header, .insights-section, .table-section, .kpi-summary, .cf-item, .fp-summary__cell, .fp-section, .fp-timeline, .fp-filterbar, .fp-solic-card, .fp-rec-card, .fp-notif-canal, .fp-nav, .timeline-item, .no-history-content, .location-section, .tech-card, .client-card, .lsd-entity-banner, .lsd-filters, .lsd-device-row, .lsd-pagination, .lsd-dev-status-strip, .lsd-reports__tab, .lsd-reports__panel, .lsd-reports__chart, .lsd-reports__table-block, .lsd-config-section, .fw-kpi-pill, .perf-kpi-pill, .fp-notif-tile, .fp-fattile, .lsd-reports__kpi),
.pk-app :is(.krimbo-card, .crm-kanban-card) {
  box-shadow: var(--pk-shadow-grade);
}
/* Os cartões de número também, quando a linha deles vira grade (6 ou mais:
   os seis KPIs do Backup em duas fileiras tinham a mesma névoa). Em
   `:where(.pk-app)`, como o resto da superfície deles. */
:where(.pk-app) :is(.kpi-card, .stat-card, .lsd-stat-card, .lsb-kpi, .ins-kpi):nth-last-child(n+6 of .kpi-card, .stat-card, .lsd-stat-card, .lsb-kpi, .ins-kpi),
:where(.pk-app) :is(.kpi-card, .stat-card, .lsd-stat-card, .lsb-kpi, .ins-kpi):nth-last-child(n+6 of .kpi-card, .stat-card, .lsd-stat-card, .lsb-kpi, .ins-kpi) ~ :is(.kpi-card, .stat-card, .lsd-stat-card, .lsb-kpi, .ins-kpi) {
  box-shadow: var(--pk-shadow-grade);
}
@media (hover: hover) {
  .pk-app :is(.pk-card, .pk-panel, .card, .menu-card, .chart-card, .fp-stack-card, .fp-card, .dc-card, .crm-card, .lsd-card, .krimbo-card, .fp-evid-card, .breakdown-card, .crm-kanban-card, .krimbo-proj, .krimbo-stat, .lsd-device-card, .lsd-dl-card, .lsd-dev-summary-card, .location-card, .mpc-card, .dc-kpi, .fp-kpi, .ltz-card, .ltz-kpi, .data-card, .table-card, .report-card, .report-form-card, .host-card, .crm-stat, .fw-timeline-section, .config-card, .fw-modal__period-card, .fw-classified-item, .fw-menu-card, .report-header, .insights-section, .table-section, .kpi-summary, .cf-item, .fp-summary__cell, .fp-section, .fp-timeline, .fp-filterbar, .fp-solic-card, .fp-rec-card, .fp-notif-canal, .fp-nav, .timeline-item, .no-history-content, .location-section, .tech-card, .client-card, .lsd-entity-banner, .lsd-filters, .lsd-device-row, .lsd-pagination, .lsd-dev-status-strip, .lsd-reports__tab, .lsd-reports__panel, .lsd-reports__chart, .lsd-reports__table-block, .lsd-config-section, .fw-kpi-pill, .perf-kpi-pill, .fp-notif-tile, .fp-fattile, .lsd-reports__kpi):nth-last-child(n+6 of .pk-card, .pk-panel, .card, .menu-card, .chart-card, .fp-stack-card, .fp-card, .dc-card, .crm-card, .lsd-card, .krimbo-card, .fp-evid-card, .breakdown-card, .crm-kanban-card, .krimbo-proj, .krimbo-stat, .lsd-device-card, .lsd-dl-card, .lsd-dev-summary-card, .location-card, .mpc-card, .dc-kpi, .fp-kpi, .ltz-card, .ltz-kpi, .data-card, .table-card, .report-card, .report-form-card, .host-card, .crm-stat, .fw-timeline-section, .config-card, .fw-modal__period-card, .fw-classified-item, .fw-menu-card, .report-header, .insights-section, .table-section, .kpi-summary, .cf-item, .fp-summary__cell, .fp-section, .fp-timeline, .fp-filterbar, .fp-solic-card, .fp-rec-card, .fp-notif-canal, .fp-nav, .timeline-item, .no-history-content, .location-section, .tech-card, .client-card, .lsd-entity-banner, .lsd-filters, .lsd-device-row, .lsd-pagination, .lsd-dev-status-strip, .lsd-reports__tab, .lsd-reports__panel, .lsd-reports__chart, .lsd-reports__table-block, .lsd-config-section, .fw-kpi-pill, .perf-kpi-pill, .fp-notif-tile, .fp-fattile, .lsd-reports__kpi):hover,
  .pk-app :is(.pk-card, .pk-panel, .card, .menu-card, .chart-card, .fp-stack-card, .fp-card, .dc-card, .crm-card, .lsd-card, .krimbo-card, .fp-evid-card, .breakdown-card, .crm-kanban-card, .krimbo-proj, .krimbo-stat, .lsd-device-card, .lsd-dl-card, .lsd-dev-summary-card, .location-card, .mpc-card, .dc-kpi, .fp-kpi, .ltz-card, .ltz-kpi, .data-card, .table-card, .report-card, .report-form-card, .host-card, .crm-stat, .fw-timeline-section, .config-card, .fw-modal__period-card, .fw-classified-item, .fw-menu-card, .report-header, .insights-section, .table-section, .kpi-summary, .cf-item, .fp-summary__cell, .fp-section, .fp-timeline, .fp-filterbar, .fp-solic-card, .fp-rec-card, .fp-notif-canal, .fp-nav, .timeline-item, .no-history-content, .location-section, .tech-card, .client-card, .lsd-entity-banner, .lsd-filters, .lsd-device-row, .lsd-pagination, .lsd-dev-status-strip, .lsd-reports__tab, .lsd-reports__panel, .lsd-reports__chart, .lsd-reports__table-block, .lsd-config-section, .fw-kpi-pill, .perf-kpi-pill, .fp-notif-tile, .fp-fattile, .lsd-reports__kpi):nth-last-child(n+6 of .pk-card, .pk-panel, .card, .menu-card, .chart-card, .fp-stack-card, .fp-card, .dc-card, .crm-card, .lsd-card, .krimbo-card, .fp-evid-card, .breakdown-card, .crm-kanban-card, .krimbo-proj, .krimbo-stat, .lsd-device-card, .lsd-dl-card, .lsd-dev-summary-card, .location-card, .mpc-card, .dc-kpi, .fp-kpi, .ltz-card, .ltz-kpi, .data-card, .table-card, .report-card, .report-form-card, .host-card, .crm-stat, .fw-timeline-section, .config-card, .fw-modal__period-card, .fw-classified-item, .fw-menu-card, .report-header, .insights-section, .table-section, .kpi-summary, .cf-item, .fp-summary__cell, .fp-section, .fp-timeline, .fp-filterbar, .fp-solic-card, .fp-rec-card, .fp-notif-canal, .fp-nav, .timeline-item, .no-history-content, .location-section, .tech-card, .client-card, .lsd-entity-banner, .lsd-filters, .lsd-device-row, .lsd-pagination, .lsd-dev-status-strip, .lsd-reports__tab, .lsd-reports__panel, .lsd-reports__chart, .lsd-reports__table-block, .lsd-config-section, .fw-kpi-pill, .perf-kpi-pill, .fp-notif-tile, .fp-fattile, .lsd-reports__kpi) ~ :is(.pk-card, .pk-panel, .card, .menu-card, .chart-card, .fp-stack-card, .fp-card, .dc-card, .crm-card, .lsd-card, .krimbo-card, .fp-evid-card, .breakdown-card, .crm-kanban-card, .krimbo-proj, .krimbo-stat, .lsd-device-card, .lsd-dl-card, .lsd-dev-summary-card, .location-card, .mpc-card, .dc-kpi, .fp-kpi, .ltz-card, .ltz-kpi, .data-card, .table-card, .report-card, .report-form-card, .host-card, .crm-stat, .fw-timeline-section, .config-card, .fw-modal__period-card, .fw-classified-item, .fw-menu-card, .report-header, .insights-section, .table-section, .kpi-summary, .cf-item, .fp-summary__cell, .fp-section, .fp-timeline, .fp-filterbar, .fp-solic-card, .fp-rec-card, .fp-notif-canal, .fp-nav, .timeline-item, .no-history-content, .location-section, .tech-card, .client-card, .lsd-entity-banner, .lsd-filters, .lsd-device-row, .lsd-pagination, .lsd-dev-status-strip, .lsd-reports__tab, .lsd-reports__panel, .lsd-reports__chart, .lsd-reports__table-block, .lsd-config-section, .fw-kpi-pill, .perf-kpi-pill, .fp-notif-tile, .fp-fattile, .lsd-reports__kpi):hover,
  .pk-app :is(.krimbo-card, .crm-kanban-card):hover {
    box-shadow: var(--pk-shadow-grade-float);
  }
  :where(.pk-app) :is(.kpi-card, .stat-card, .lsd-stat-card, .lsb-kpi, .ins-kpi):nth-last-child(n+6 of .kpi-card, .stat-card, .lsd-stat-card, .lsb-kpi, .ins-kpi):hover,
  :where(.pk-app) :is(.kpi-card, .stat-card, .lsd-stat-card, .lsb-kpi, .ins-kpi):nth-last-child(n+6 of .kpi-card, .stat-card, .lsd-stat-card, .lsb-kpi, .ins-kpi) ~ :is(.kpi-card, .stat-card, .lsd-stat-card, .lsb-kpi, .ins-kpi):hover {
    box-shadow: var(--pk-shadow-grade-float);
  }
}

/* MAIS COR NOS CARTÕES DE NÚMERO — decisão do dono (2026-09-25): no claro, a 8%
   da família o vidro colorido lia quase branco ao lado dos blocos de antes. O
   texto destes cartões é Tinta ou -ink (nunca a Fraca), e a -ink pior passa a
   18% (4,64:1); aqui fica 14% no claro. O escuro mantém a força da família
   (12%): `--pk-kpi-tom-forca` é redefinido lá. Declarado NO cartão, em (0,1,0):
   um plugin que queira outra força a declara no cartão dele e vence por ordem.
   2026-09-28 (Onda B, KPI colorido do dono): entram crm-stat, ltz-kpi,
   fw-kpi-pill, perf-kpi-pill, fp-notif-tile, fp-fattile, lsd-reports__kpi e
   lsd-dev-summary-card — a superfície deles vem do bloco CARTÃO (0,2,0), como
   a de dc-kpi/fp-kpi. A força só pesa quando o plugin diz a cor
   (`--pk-card-tom` pelo que o número SIGNIFICA); ao dizê-la, o rótulo do
   cartão tem de estar em Tinta ou -ink: hoje perf-kpi-pill `.lbl`,
   lsd-reports__kpi-label e ltz-kpi__r estão na Média (-2), crm-stat-label e
   fp-notif-tile__lbl/__sub na Fraca (-3) e fp-fattile__label em opacidade. */
:where(.pk-app) :is(.kpi-card, .stat-card, .lsd-stat-card, .lsb-kpi, .ins-kpi, .dc-kpi, .fp-kpi,
                    .crm-stat, .ltz-kpi, .fw-kpi-pill, .perf-kpi-pill,
                    .fp-notif-tile, .fp-fattile, .lsd-reports__kpi, .lsd-dev-summary-card) {
  --pk-card-tom-forca: var(--pk-kpi-tom-forca, 14%);
}

/* 🔴 O QUE ABRE POR CIMA DE UM CARTÃO DE VIDRO PRECISA QUE O CARTÃO SUBA JUNTO.
   `backdrop-filter` cria contexto de empilhamento. Duas consequências, as duas
   medidas na prévia de 2026-09-24 antes de ir para produção:
     1. o `z-index` do painel de um combobox passa a valer só DENTRO do cartão,
        e o cartão seguinte cobre o painel que transborda;
     2. pior, e foi o que a foto mostrou: o painel que transborda de OUTRO
        vidro (o combo "Todas as empresas" no `.fp-pageheader` do painel do
        Flow) passa a ser coberto pelos cartões de baixo, que agora também são
        contextos no mesmo nível e vêm depois na ordem do documento. Antes eles
        eram fluxo comum, pintados abaixo de qualquer contexto.
   A saída é o vidro que tem algo ABERTO dentro subir acima dos irmãos. Os
   marcadores de "aberto" são os do parque: `.is-open` (fp-combo, pk-combo),
   `.open` (filtro de clientes do firewall), `.show` (dropdown do Bootstrap),
   `.dropdown-open` (agendapcnet), `--open` do fp-search-select (frotapcnet) e
   `[aria-expanded="true"]` no botão que abre. Subir um cartão não o move: só
   muda quem pinta por cima de quem, e só enquanto a coisa está aberta.
   `position: relative` porque `z-index` só vale em elemento posicionado (ou
   item de flex/grid); ele não muda o bloco de contenção dos filhos, que o
   próprio `backdrop-filter` já passou a ser. Nenhum destes nomes é sticky,
   absolute ou fixed no parque (conferido; de novo em 2026-09-28 para os nomes
   da Onda B, que entram aqui junto com o vidro — `.fp-section` e `.lsd-filters`
   têm combobox dentro, `.is-open`/`[aria-expanded]`); o `.pk-header` (fixed,
   z 9999) fica de fora de propósito. */
.pk-app :is(.pk-card, .pk-panel, .card, .menu-card, .chart-card, .fp-stack-card,
            .fp-card, .dc-card, .crm-card, .lsd-card, .krimbo-card,
            .fp-evid-card, .breakdown-card, .crm-kanban-card, .krimbo-proj,
            .krimbo-stat, .lsd-device-card, .lsd-dl-card, .lsd-dev-summary-card,
            .location-card, .mpc-card, .dc-kpi, .fp-kpi, .ltz-card, .ltz-kpi,
            .data-card, .table-card, .report-card, .report-form-card, .host-card,
            .kpi-card, .stat-card, .lsd-stat-card, .lsb-kpi, .ins-kpi,
            .crm-stat, .fw-timeline-section, .config-card, .fw-modal__period-card,
            .fw-classified-item, .report-header, .insights-section, .table-section,
            .kpi-summary, .cf-item, .fp-summary__cell, .fp-section, .fp-timeline,
            .fp-filterbar, .fp-solic-card, .fp-rec-card, .fp-notif-canal, .fp-nav,
            .timeline-item, .no-history-content, .location-section, .tech-card,
            .client-card, .lsd-entity-banner, .lsd-filters, .lsd-device-row,
            .lsd-pagination, .lsd-dev-status-strip, .lsd-reports__tab,
            .lsd-reports__panel, .lsd-reports__chart, .lsd-reports__table-block,
            .lsd-config-section, .fw-kpi-pill, .perf-kpi-pill, .fp-notif-tile,
            .fp-fattile, .lsd-reports__kpi,
            .bk-menu-card, .fw-menu-card, .fp-pageheader, .lsd-header):has(
              .is-open, .open, .show, .dropdown-open, [aria-expanded="true"],
              .fp-search-select__dropdown--open) {
  position: relative;
  z-index: 60;
}

/* --- SUPERFÍCIE DO CARD DE MENU -------------------------------------
   O card de menu de cada plugin é a primeira coisa que se vê ao abrir o
   plugin, e eram QUATRO superfícies diferentes para a mesma peça — medido
   em 2026-09-01: `--ap-card-bg`, um `linear-gradient(160deg,…)`,
   `--pk-surface` chapada e `--bk-card-bg`, com quatro sombras próprias
   (`--ap-shadow-lego`, `--shadow-lego`, `--pk-shadow-sm`, `--bk-shadow-lego`)
   e um canto literal de 16px. É por isso que abrir dois plugins parecia
   abrir dois produtos.

   Aqui vai só a SUPERFÍCIE — o vidro, a borda de fio, a elevação e o gesto
   de hover que o `.pk-card` do padrão já define, herdados do `.fw-card` do
   portal. TAMANHO NÃO ENTRA: nem `width`, nem `padding`, nem `font-size`.
   O card tem a largura que tem porque carrega título e descrição, e isso é
   decisão de quem desenhou a tela — a casa dá a aparência, não a medida.
   Foi o erro de 2026-09-01, e está no CLAUDE.md.

   ⚠️ Até 2026-09-24 este era o ÚNICO lugar com o vidro fora do `.pk-card`,
   e o alcance estreito era de propósito ("elevação é eixo legítimo"). O dono
   decidiu vidro em todo cartão, e a superfície passou ao bloco CARD acima, que
   já cita `.menu-card`. Este bloco fica pelo que só ele tem: os dois nomes de
   menu que não são cartão de conteúdo (`bk-menu-card`, `fw-menu-card`), o
   `transition: all` do gesto de menu e o anel de foco. Os valores são os
   mesmos — nada muda para o card de menu. (Desde 2026-09-28 o `fw-menu-card`
   também está no bloco CARTÃO, como o `menu-card`: dele ganha canto, letra e a
   sombra de grade; o vidro daqui é idêntico.) */
.pk-app .menu-card,
.pk-app .bk-menu-card,
.pk-app .fw-menu-card {
  background: color-mix(in srgb, var(--pk-card-tom, var(--pk-glass)) var(--pk-card-tom-forca, 8%), var(--pk-glass));
  -webkit-backdrop-filter: blur(16px) saturate(1.3);
          backdrop-filter: blur(16px) saturate(1.3);
  border: 1px solid color-mix(in srgb, var(--pk-card-tom, var(--pk-hairline)) 35%, var(--pk-hairline));
  box-shadow: var(--pk-shadow-rest);
  transition: all var(--pk-ease);
}
.pk-app .menu-card:hover,
.pk-app .bk-menu-card:hover,
.pk-app .fw-menu-card:hover {
  background: color-mix(in srgb, var(--pk-card-tom, var(--pk-glass-2)) var(--pk-card-tom-forca, 8%), var(--pk-glass-2));
  border-color: color-mix(in srgb, var(--pk-card-tom, var(--pk-hairline-hover)) 45%, var(--pk-hairline-hover));
  box-shadow: var(--pk-shadow-float);
}
.pk-app .menu-card:focus-visible,
.pk-app .bk-menu-card:focus-visible,
.pk-app .fw-menu-card:focus-visible {
  outline: var(--pk-ring); outline-offset: var(--pk-ring-offset);
}

/* O ÍCONE EM CÁPSULA — o que mais separava o plugin do portal, medido em
   2026-09-01 no lado a lado: no portal o ícone do card é uma cápsula de 54px
   com fundo `--pk-green-soft` e traço `--pk-green-dark`
   (`portalpcnet/public/portal.css:385`), o mesmo selo que o cabeçalho já usa;
   no plugin era um `<i>` solto de 35,2px pintado com a COR DO TEXTO
   (`rgb(29,36,51)`). Fundo, borda e sombra podiam estar idênticos — e estavam
   — que a peça continuava lendo como de outro produto, porque o que o olho
   pega primeiro num card de menu é o ícone. */
.pk-app .menu-card-icon,
.pk-app .bk-menu-card__icon,
.pk-app .fw-menu-card__icon {
  width: 54px; height: 54px;
  border-radius: var(--pk-radius-sm);
  display: grid; place-items: center;
  background: var(--pk-green-soft);
  color: var(--pk-green-dark);
  font-size: 27.5px;
  line-height: 1;
}

/* O TÍTULO — peso e tracking do portal. O TAMANHO fica de fora: 23px no portal
   é um card de 508px de largura e a ação principal da tela; 16px num card de
   250px é o proporcional, e tamanho é decisão de quem desenhou a tela.
   O `letter-spacing: normal` é correção de um defeito herdado: o título é um
   `<h3>`, e `.pk-app h1..h4` (0,1,1) aperta o tracking para -.01em — o mesmo
   que já tinha invertido o tracking de `.pk-section-title`. No portal o título
   do card não é heading, então nunca foi apertado. */
.pk-app .menu-card-title,
.pk-app .bk-menu-card__title,
.pk-app .fw-menu-card__title {
  font-weight: 700;
  letter-spacing: normal;
}

/* --- TABELA ---------------------------------------------------------
   A densidade da célula NÃO entra: uma tabela com o respiro de formulário
   mostra metade das linhas na mesma altura de tela, e isso está escrito no
   topo deste arquivo desde 21/08. O que padroniza uma tabela é o CABEÇALHO. */
.pk-app .pk-table,
.pk-app .table,
.pk-app .bk-table,
.pk-app .bk-triage-table,
.pk-app .lsd-dl-table,
.pk-app .lsd-dev-table,
.pk-app .lsd-wty-table,
/* 🔴 `.fp-table`, e NÃO `.fp-data` — o nome estava errado aqui desde 26/08.
   `.fp-data` é uma CÉLULA (`.fp-table .fp-data`; a regra "Mono data cells" do
   frotapcnet saiu em 783a572), não a tabela: o seletor `.fp-app .fp-data thead th`
   abaixo nunca casou nada, e a `font-family` proporcional era imposta a uma
   célula que usa a MONO DA CASA de propósito — dígito alinhado em coluna é a
   razão de `--pk-font-mono` existir. Só não estragou nada por empate de
   especificidade (0,2,0) resolvido por ordem de carga, a favor do plugin.
   A tabela de verdade é `.fp-table`, usada com `<table>` em 2 telas do
   frotapcnet e 3 do flowpcnet. */
.pk-app .fp-table,
/* 2026-09-23 (g6-familia-04/-12), um a um no markup: todos são o <table> com
   <thead> — nunca o `-wrap`/`-block`/`-scroll` em volta. */
.pk-app .krimbo-table,
.pk-app .dc-table,
.pk-app .crm-table,
.pk-app .tickets-table,
.pk-app .perf-table,
.pk-app .sla-table,
.pk-app .ins-table,
.pk-app .lsd-reports__table,
.pk-app .lsd-upd-table,
.pk-app .ltz-tabela,
.pk-app .data-table {
  font-family: var(--pk-font);
}
.pk-app .pk-table thead th,
.pk-app .table thead th,
.pk-app .bk-table thead th,
.pk-app .bk-triage-table thead th,
.pk-app .lsd-dl-table thead th,
.pk-app .lsd-dev-table thead th,
.pk-app .lsd-wty-table thead th,
.pk-app .fp-table thead th,
.pk-app .krimbo-table thead th,
.pk-app .dc-table thead th,
.pk-app .crm-table thead th,
.pk-app .tickets-table thead th,
.pk-app .perf-table thead th,
.pk-app .sla-table thead th,
.pk-app .ins-table thead th,
.pk-app .lsd-reports__table thead th,
.pk-app .lsd-upd-table thead th,
.pk-app .ltz-tabela thead th,
.pk-app .data-table thead th {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  /* 🔴 A TINTA TAMBÉM, e só ela (2026-09-23, g6-familia-04). O parque tinha
     quatro tintas de cabeçalho de coluna — verde-tinta sobre degradê verde
     (flowpcnet, dashboardcliente, crmpcnet), #646c7d (krimbo, backups),
     #5b6678 (métricas) e #1d2433 —, e o modelo da casa é um só: a Tinta Fraca,
     a mesma da `.pk-table` do host e do skin do portal no helpdesk. O FUNDO
     (o degradê verde de três plugins) NÃO se toca aqui: é tarefa de cada
     plugin, e o DESIGN.md e o portal ainda discordam entre Papel Rebaixado e
     transparente — decisão do dono. Tinta de texto não é a "cor de quem usa"
     que a forma deixa com o plugin: é papel de leitura, e passa nos dois temas
     (5,27:1 no branco, 5,60:1 no card escuro). ⚠️ No escuro a tinta vem de
     --pk-thead-ink (a Média), definido em pcnetui-tema-escuro.css: sobre o
     verde translúcido que alguns plugins põem no cabeçalho a Fraca caía a
     4,21:1 (2026-09-25). No claro o parâmetro não existe e fica a Fraca. */
  color: var(--pk-thead-ink, var(--pk-ink-3));
}

/* --- ABA ------------------------------------------------------------
   2026-09-23 (g6-familia-16). A casa JÁ tem a aba (`.pk-tab`, pcnet-componentes:
   sublinhado verde na ativa, canto só em cima, 600) e nenhum nome legado era
   alcançado — a família ficava sem régua no dedo-duro. Só entram os nomes que
   SÃO a mesma peça, lidos no markup: `.fp-tabs__btn` (abas da configuração do
   flowpcnet) e `.krimbo-tab` (fila e relatório do krimbo) — <button> com
   sublinhado de 2–3px na ativa, o desenho da `.pk-tab`.
   ⚠️ NÃO entram os alternadores de segmento (`.fp-viewtoggle__btn`,
   `.lsd-view-btn`): são outra peça (`.pk-toggle`), com o canto no contêiner.
   E a escolha entre "sublinhado" e "pílula de 9px" (o item de navegação do
   portal) para todas as abas do parque continua sendo do dono — aqui só se
   alinha o que já é sublinhado com o sublinhado da casa. */
.pk-app .pk-tab,
.pk-app .fp-tabs__btn,
.pk-app .krimbo-tab {
  border-radius: var(--pk-radius-sm) var(--pk-radius-sm) 0 0;
  font-family: var(--pk-font);
  font-weight: 600;
}

/* =====================================================================
   O CABEÇALHO DA CASA, ALCANÇANDO QUEM MONTA O SEU (2026-08-31)
   =====================================================================

   O `flowpcnet` é o último plugin com cabeçalho próprio: 21 telas montam
   `<header class="fp-pageheader">` à mão, cada uma com o seu PHP dentro.
   Reescrevê-las por script é o erro que este parque já pagou — no
   `lansentineldevices` um heredoc engoliu blocos `<?php` e a tela passou a
   imprimir SQL como texto (ver o CLAUDE.md do pcnetui).

   Então o alcance é por CSS, e o que se copia é o que faz o olho reconhecer
   a família: a caixa (vidro, borda, canto, sombra) e o SELO — a cápsula
   verde em volta do ícone do título, que é a peça mais característica do
   cabeçalho do portal.

   O ícone já está no markup (`<h1 class="fp-pagetitle"><i class="ti ...">`);
   aqui ele só ganha a cápsula. Zero PHP tocado.
   ===================================================================== */
.pk-app .fp-pageheader {
    background: var(--pk-glass);
    -webkit-backdrop-filter: blur(16px) saturate(1.3);
            backdrop-filter: blur(16px) saturate(1.3);
    border: 1px solid var(--pk-border);
    border-bottom: 1px solid var(--pk-border);   /* anula o traço de 2px próprio */
    border-radius: var(--pk-radius);
    box-shadow: var(--pk-shadow-sm);
    padding: 10px 20px;
    margin-bottom: var(--pk-sp-4);
}

/* O SELO: mesma medida e mesmas cores de `.pk-header__selo`
   (pcnetui-cabecalho.css). `flex: 0 0 auto` porque o título é flex e o
   ícone encolheria; `place-items` centra o glifo na cápsula. */
.pk-app .fp-pageheader .fp-pagetitle > i {
    flex: 0 0 auto;
    width: 34px; height: 34px;
    border-radius: var(--pk-radius-sm);
    display: grid; place-items: center;
    background: var(--pk-green-soft);
    color: var(--pk-green-dark);
    font-size: 17px;
}

/* O mesmo alcance, para o `lansentineldevices` — as 7 telas dele montam
   `<header class="lsd-header">` com `plugin_lansentineldevices_marca()` dentro,
   e o ícone já era uma cápsula: 64×64, raio grande, com sombra e borda
   próprias, contra os 34×34 do selo do portal. Aqui ele passa a ter a medida
   da casa. A caixa recebe a mesma forma dos outros cabeçalhos.

   `--pk-green-dark` no lugar de `--pk-on-green`: o `on-green` é a tinta feita
   para cair SOBRE o verde cheio; a cápsula é verde LAVADO, e quem escreve
   sobre ela é o verde de traço. */
.pk-app .lsd-header {
    background: var(--pk-glass);
    -webkit-backdrop-filter: blur(16px) saturate(1.3);
            backdrop-filter: blur(16px) saturate(1.3);
    border: 1px solid var(--pk-border);
    border-bottom: 1px solid var(--pk-border);
    border-radius: var(--pk-radius);
    box-shadow: var(--pk-shadow-sm);
    padding: 10px 20px;
    gap: var(--pk-sp-3);
}
.pk-app .lsd-header .lsd-header__icon {
    width: 34px; height: 34px;
    border-radius: var(--pk-radius-sm);
    border: 0;
    box-shadow: none;
    background: var(--pk-green-soft);
    color: var(--pk-green-dark);
    font-size: 17px;
}

/* =====================================================================
   O QUE ESTICA — pai centralizador não pode encolher a peça (2026-08-31)
   =====================================================================

   🔴 `display:flex` + `flex-direction:column` + `align-items:center` faz
   TODO filho de largura automática encolher até o tamanho do conteúdo. São
   **31 containers assim no parque**, e **21 deles (68%) não têm uma única
   regra dando largura a filho algum**.

   O efeito, medido em 16 telas: o cabeçalho da casa saía com **371px de
   1338** (28%) em `agendapcnet/front/location.php` e `admin_locations.php`,
   e com 800 de 1370 (58%) nos menus do `dashboardpcnet` e do
   `dashboardfirewall`. No menu do dashboardpcnet a mesma causa colapsou a
   grade de ladrilhos para **uma coluna de 249px** dentro de um pai de 1370 —
   três larguras diferentes na mesma tela.

   `align-self: stretch` e não `width: 100%`: num pai `column` o eixo cruzado
   é o horizontal, então `stretch` é a declaração semanticamente correta —
   ela não conflita com `max-width` de quem tiver um, e não faz nada quando o
   pai não é flex.

   Alcança TRÊS classes do padrão, nunca `*`: esticar por atacado quebraria
   quem é estreito de propósito (o `.pk-vazio__icone`, os cards de largura
   fixa dos menus). */
.pk-app .pk-header,
.pk-app .pk-tile-grid,
.pk-app .pk-section-head { align-self: stretch; }