/* cd-paginas-util.css — onda F2 (26/out/2026), CSP-STYLE: os style="" estáticos das páginas públicas e portais (*.html
   da raiz e de public/, public/assets/*.js, public/assets/paginas/*.js) viraram classes de UMA declaração cada
   (pu-<prop>-<valor>), para as páginas rodarem com style-src sem 'unsafe-inline' (CSP_STRICT=enforce). Par do
   public/cd-utilitarios.css do painel (F1).
   - Carregado por ÚLTIMO no <head> e com :not(#_) (especificidade 1,1,0): faz o papel do style="" que substitui.
     Estilo posto por JS (el.style.x = …) continua vencendo, como vencia o inline.
   - Atalhos (margin, padding, border, background…) vêm antes dos longhands: margin:0 + margin-top:8px no mesmo
     elemento continua dando 8px no topo.
   - display:none NÃO vira classe: fica em data-css="display:none" e public/assets/cd-estilo-cssom.js aplica pelo
     CSSOM (o JS das páginas alterna el.style.display). A regra abaixo esconde antes do JS rodar.
   - Estilo calculado (${…} no valor) também vai em data-css.
   - Cor cravada: as que já estavam no style="" vieram como estavam (teto em tests/paginas-util-css.test.js, só desce).
   Classe nova: siga o padrão; classe sem uso derruba tests/paginas-util-css.test.js. */
[data-css='display:none']:not(#_) {
  display: none;
}
.pu-bd-1px-solid-border:not(#_) {
  border: 1px solid var(--border);
}
.pu-bd-1px-solid-rgba-167-139-250-0_2:not(#_) {
  border: 1px solid rgba(167, 139, 250, 0.2);
}
.pu-bd-1px-solid-rgba-234-179-8-_3:not(#_) {
  border: 1px solid rgba(234, 179, 8, 0.3);
}
.pu-bd-1px-solid-rgba-245-158-11-_4:not(#_) {
  border: 1px solid rgba(245, 158, 11, 0.4);
}
.pu-bd-1px-solid-rgba-255-255-255-0_3:not(#_) {
  border: 1px solid rgba(255, 255, 255, 0.3);
}
.pu-bd-1px-solid-rgba-34-197-94-0_2:not(#_) {
  border: 1px solid rgba(34, 197, 94, 0.2);
}
.pu-bd-1px-solid-rgba-37-99-235-0_2:not(#_) {
  border: 1px solid rgba(37, 99, 235, 0.2);
}
.pu-bd-1px-solid-rgba-96-165-250-0_25:not(#_) {
  border: 1px solid rgba(96, 165, 250, 0.25);
}
.pu-bd-1px-solid-var-border-h2a3245:not(#_) {
  border: 1px solid var(--border, #2a3245);
}
.pu-bd-none:not(#_) {
  border: none;
}
.pu-bdb-1px-solid-border:not(#_) {
  border-bottom: 1px solid var(--border);
}
.pu-bdl-2px-solid-h4f8df9:not(#_) {
  border-left: 2px solid #4f8df9;
}
.pu-bdt-1px-solid-border:not(#_) {
  border-top: 1px solid var(--border);
}
.pu-bg-bg:not(#_) {
  background: var(--bg);
}
.pu-bg-border:not(#_) {
  background: var(--border);
}
.pu-bg-card:not(#_) {
  background: var(--card);
}
.pu-bg-hfff:not(#_) {
  background: #fff;
}
.pu-bg-linear-gradient-135deg-rgba-96-1-ed633:not(#_) {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.08), rgba(167, 139, 250, 0.04));
}
.pu-bg-linear-gradient-90deg-h60a5fa-ha78bfa:not(#_) {
  background: linear-gradient(90deg, #60a5fa, #a78bfa);
}
.pu-bg-none:not(#_) {
  background: none;
}
.pu-bg-primary:not(#_) {
  background: var(--primary);
}
.pu-bg-rgba-0-0-0-_55:not(#_) {
  background: rgba(0, 0, 0, 0.55);
}
.pu-bg-rgba-0-0-0-_7:not(#_) {
  background: rgba(0, 0, 0, 0.7);
}
.pu-bg-rgba-167-139-250-0_06:not(#_) {
  background: rgba(167, 139, 250, 0.06);
}
.pu-bg-rgba-234-179-8-_08:not(#_) {
  background: rgba(234, 179, 8, 0.08);
}
.pu-bg-rgba-245-158-11-_15:not(#_) {
  background: rgba(245, 158, 11, 0.15);
}
.pu-bg-rgba-245-158-11-_18:not(#_) {
  background: rgba(245, 158, 11, 0.18);
}
.pu-bg-rgba-255-255-255-0_1:not(#_) {
  background: rgba(255, 255, 255, 0.1);
}
.pu-bg-rgba-34-197-94-0_06:not(#_) {
  background: rgba(34, 197, 94, 0.06);
}
.pu-bg-rgba-37-99-235-0_04:not(#_) {
  background: rgba(37, 99, 235, 0.04);
}
.pu-bg-rgba-37-99-235-0_06:not(#_) {
  background: rgba(37, 99, 235, 0.06);
}
.pu-bg-surface:not(#_) {
  background: var(--surface);
}
.pu-bg-transparent:not(#_) {
  background: transparent;
}
.pu-bg-var-accent-h22c55e:not(#_) {
  background: var(--accent, #22c55e);
}
.pu-bg-var-card-h1a2030:not(#_) {
  background: var(--card, #1a2030);
}
.pu-br-10px:not(#_) {
  border-radius: 10px;
}
.pu-br-12px:not(#_) {
  border-radius: 12px;
}
.pu-br-14px:not(#_) {
  border-radius: 14px;
}
.pu-br-16px:not(#_) {
  border-radius: 16px;
}
.pu-br-20px:not(#_) {
  border-radius: 20px;
}
.pu-br-2px:not(#_) {
  border-radius: 2px;
}
.pu-br-3px:not(#_) {
  border-radius: 3px;
}
.pu-br-6px:not(#_) {
  border-radius: 6px;
}
.pu-br-8px:not(#_) {
  border-radius: 8px;
}
.pu-br-radius-lg:not(#_) {
  border-radius: var(--radius-lg);
}
.pu-br-radius-md:not(#_) {
  border-radius: var(--radius-md);
}
.pu-flex-1:not(#_) {
  flex: 1;
}
.pu-flex-2:not(#_) {
  flex: 2;
}
.pu-gap-10px:not(#_) {
  gap: 10px;
}
.pu-gap-12px:not(#_) {
  gap: 12px;
}
.pu-gap-14px:not(#_) {
  gap: 14px;
}
.pu-gap-4px:not(#_) {
  gap: 4px;
}
.pu-gap-6px:not(#_) {
  gap: 6px;
}
.pu-gap-8px:not(#_) {
  gap: 8px;
}
.pu-inset-0:not(#_) {
  inset: 0;
}
.pu-list-style-none:not(#_) {
  list-style: none;
}
.pu-m-0:not(#_) {
  margin: 0;
}
.pu-m-0-0-10px:not(#_) {
  margin: 0 0 10px;
}
.pu-m-0-0-12px:not(#_) {
  margin: 0 0 12px;
}
.pu-m-0-0-14px:not(#_) {
  margin: 0 0 14px;
}
.pu-m-0-0-4px:not(#_) {
  margin: 0 0 4px;
}
.pu-m-0-0-6px:not(#_) {
  margin: 0 0 6px;
}
.pu-m-12px-0:not(#_) {
  margin: 12px 0;
}
.pu-m-12px-0-14px:not(#_) {
  margin: 12px 0 14px;
}
.pu-m-14px-0-8px:not(#_) {
  margin: 14px 0 8px;
}
.pu-m-16px-0-10px:not(#_) {
  margin: 16px 0 10px;
}
.pu-m-16px-0-6px:not(#_) {
  margin: 16px 0 6px;
}
.pu-m-18px-0-10px:not(#_) {
  margin: 18px 0 10px;
}
.pu-m-20px-0-10px:not(#_) {
  margin: 20px 0 10px;
}
.pu-m-4px-0-0:not(#_) {
  margin: 4px 0 0;
}
.pu-m-6px-0:not(#_) {
  margin: 6px 0;
}
.pu-m-6px-0-0:not(#_) {
  margin: 6px 0 0;
}
.pu-m-6px-0-4px:not(#_) {
  margin: 6px 0 4px;
}
.pu-m-8px-auto-18px:not(#_) {
  margin: 8px auto 18px;
}
.pu-outline-none:not(#_) {
  outline: none;
}
.pu-ov-hidden:not(#_) {
  overflow: hidden;
}
.pu-p-0:not(#_) {
  padding: 0;
}
.pu-p-0-16px:not(#_) {
  padding: 0 16px;
}
.pu-p-0-2px:not(#_) {
  padding: 0 2px;
}
.pu-p-10px:not(#_) {
  padding: 10px;
}
.pu-p-10px-12px:not(#_) {
  padding: 10px 12px;
}
.pu-p-10px-14px:not(#_) {
  padding: 10px 14px;
}
.pu-p-10px-16px:not(#_) {
  padding: 10px 16px;
}
.pu-p-10px-20px:not(#_) {
  padding: 10px 20px;
}
.pu-p-12px:not(#_) {
  padding: 12px;
}
.pu-p-12px-14px:not(#_) {
  padding: 12px 14px;
}
.pu-p-14px:not(#_) {
  padding: 14px;
}
.pu-p-14px-22px:not(#_) {
  padding: 14px 22px;
}
.pu-p-16px:not(#_) {
  padding: 16px;
}
.pu-p-18px-22px:not(#_) {
  padding: 18px 22px;
}
.pu-p-20px:not(#_) {
  padding: 20px;
}
.pu-p-20px-16px-14px:not(#_) {
  padding: 20px 16px 14px;
}
.pu-p-24px:not(#_) {
  padding: 24px;
}
.pu-p-2px-8px:not(#_) {
  padding: 2px 8px;
}
.pu-p-3px-0-5px-8px:not(#_) {
  padding: 3px 0 5px 8px;
}
.pu-p-40px:not(#_) {
  padding: 40px;
}
.pu-p-4px-10px:not(#_) {
  padding: 4px 10px;
}
.pu-p-6px-0:not(#_) {
  padding: 6px 0;
}
.pu-p-8px-0:not(#_) {
  padding: 8px 0;
}
.pu-p-8px-14px:not(#_) {
  padding: 8px 14px;
}
.pu-td-none:not(#_) {
  text-decoration: none;
}
.pu-transition-background-0_3s:not(#_) {
  transition: background 0.3s;
}
.pu-transition-background-_15s-color-_15s:not(#_) {
  transition:
    background 0.15s,
    color 0.15s;
}
.pu-transition-transform-_3s:not(#_) {
  transition: transform 0.3s;
}
.pu-transition-width-_5s-ease:not(#_) {
  transition: width 0.5s ease;
}
.pu-accent-color-h22c55e:not(#_) {
  accent-color: #22c55e;
}
.pu-accent-color-ha78bfa:not(#_) {
  accent-color: #a78bfa;
}
.pu-accent-color-primary:not(#_) {
  accent-color: var(--primary);
}
.pu-ai-center:not(#_) {
  align-items: center;
}
.pu-ai-flex-start:not(#_) {
  align-items: flex-start;
}
.pu-border-collapse-collapse:not(#_) {
  border-collapse: collapse;
}
.pu-box-shadow-0-20px-60px-rgba-0-0-0-_5:not(#_) {
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}
.pu-c-accent:not(#_) {
  color: var(--accent);
}
.pu-c-blue-on-dark:not(#_) {
  color: var(--blue-on-dark);
}
.pu-c-blue-on-dark-soft:not(#_) {
  color: var(--blue-on-dark-soft);
}
.pu-c-green-on-dark:not(#_) {
  color: var(--green-on-dark);
}
.pu-c-h08110a:not(#_) {
  color: #08110a;
}
.pu-c-h4f8df9:not(#_) {
  color: #4f8df9;
}
.pu-c-h60a5fa:not(#_) {
  color: #60a5fa;
}
.pu-c-ha78bfa:not(#_) {
  color: #a78bfa;
}
.pu-c-hc0c0c0:not(#_) {
  color: #c0c0c0;
}
.pu-c-hcd7f32:not(#_) {
  color: #cd7f32;
}
.pu-c-he0f7fa:not(#_) {
  color: #e0f7fa;
}
.pu-c-hf59e0b:not(#_) {
  color: #f59e0b;
}
.pu-c-hffd700:not(#_) {
  color: #ffd700;
}
.pu-c-hfff:not(#_) {
  color: #fff;
}
.pu-c-inherit:not(#_) {
  color: inherit;
}
.pu-c-muted:not(#_) {
  color: var(--muted);
}
.pu-c-primary:not(#_) {
  color: var(--primary);
}
.pu-c-success:not(#_) {
  color: var(--success);
}
.pu-c-text:not(#_) {
  color: var(--text);
}
.pu-c-text-soft:not(#_) {
  color: var(--text-soft);
}
.pu-c-text-strong:not(#_) {
  color: var(--text-strong);
}
.pu-c-var-danger-hf87171:not(#_) {
  color: var(--danger, #f87171);
}
.pu-c-var-muted-h888:not(#_) {
  color: var(--muted, #888);
}
.pu-c-var-muted-h8b93a7:not(#_) {
  color: var(--muted, #8b93a7);
}
.pu-c-warning:not(#_) {
  color: var(--warning);
}
.pu-cur-pointer:not(#_) {
  cursor: pointer;
}
.pu-d-block:not(#_) {
  display: block;
}
.pu-d-flex:not(#_) {
  display: flex;
}
.pu-d-grid:not(#_) {
  display: grid;
}
.pu-d-inline-flex:not(#_) {
  display: inline-flex;
}
.pu-fd-column:not(#_) {
  flex-direction: column;
}
.pu-ff-inherit:not(#_) {
  font-family: inherit;
}
.pu-ff-ui-monospace-menlo-monospace:not(#_) {
  font-family: ui-monospace, Menlo, monospace;
}
.pu-ff-var-font-mono-monospace:not(#_) {
  font-family: var(--font-mono, monospace);
}
.pu-fs-10_5px:not(#_) {
  font-size: 10.5px;
}
.pu-fs-10px:not(#_) {
  font-size: 10px;
}
.pu-fs-11_5px:not(#_) {
  font-size: 11.5px;
}
.pu-fs-11px:not(#_) {
  font-size: 11px;
}
.pu-fs-12px:not(#_) {
  font-size: 12px;
}
.pu-fs-13px:not(#_) {
  font-size: 13px;
}
.pu-fs-14px:not(#_) {
  font-size: 14px;
}
.pu-fs-15px:not(#_) {
  font-size: 15px;
}
.pu-fs-16px:not(#_) {
  font-size: 16px;
}
.pu-fs-17px:not(#_) {
  font-size: 17px;
}
.pu-fs-18px:not(#_) {
  font-size: 18px;
}
.pu-fs-19px:not(#_) {
  font-size: 19px;
}
.pu-fs-20px:not(#_) {
  font-size: 20px;
}
.pu-fs-22px:not(#_) {
  font-size: 22px;
}
.pu-fs-24px:not(#_) {
  font-size: 24px;
}
.pu-fs-28px:not(#_) {
  font-size: 28px;
}
.pu-fs-32px:not(#_) {
  font-size: 32px;
}
.pu-fs-40px:not(#_) {
  font-size: 40px;
}
.pu-fs-42px:not(#_) {
  font-size: 42px;
}
.pu-fsh-0:not(#_) {
  flex-shrink: 0;
}
.pu-fw-400:not(#_) {
  font-weight: 400;
}
.pu-fw-500:not(#_) {
  font-weight: 500;
}
.pu-fw-600:not(#_) {
  font-weight: 600;
}
.pu-fw-700:not(#_) {
  font-weight: 700;
}
.pu-fw-800:not(#_) {
  font-weight: 800;
}
.pu-fwr-wrap:not(#_) {
  flex-wrap: wrap;
}
.pu-grid-template-columns-1fr:not(#_) {
  grid-template-columns: 1fr;
}
.pu-h-100p:not(#_) {
  height: 100%;
}
.pu-h-100px:not(#_) {
  height: 100px;
}
.pu-h-14px:not(#_) {
  height: 14px;
}
.pu-h-160px:not(#_) {
  height: 160px;
}
.pu-h-16px:not(#_) {
  height: 16px;
}
.pu-h-34px:not(#_) {
  height: 34px;
}
.pu-h-40px:not(#_) {
  height: 40px;
}
.pu-h-4px:not(#_) {
  height: 4px;
}
.pu-h-60px:not(#_) {
  height: 60px;
}
.pu-h-6px:not(#_) {
  height: 6px;
}
.pu-h-auto:not(#_) {
  height: auto;
}
.pu-jc-center:not(#_) {
  justify-content: center;
}
.pu-jc-flex-end:not(#_) {
  justify-content: flex-end;
}
.pu-jc-space-between:not(#_) {
  justify-content: space-between;
}
.pu-lh-1:not(#_) {
  line-height: 1;
}
.pu-lh-1_1:not(#_) {
  line-height: 1.1;
}
.pu-lh-1_4:not(#_) {
  line-height: 1.4;
}
.pu-lh-1_45:not(#_) {
  line-height: 1.45;
}
.pu-lh-1_5:not(#_) {
  line-height: 1.5;
}
.pu-ls-0:not(#_) {
  letter-spacing: 0;
}
.pu-ls-_3px:not(#_) {
  letter-spacing: -0.3px;
}
.pu-ls-_4px:not(#_) {
  letter-spacing: 0.4px;
}
.pu-ls-_5px:not(#_) {
  letter-spacing: 0.5px;
}
.pu-maxh-90vh:not(#_) {
  max-height: 90vh;
}
.pu-maxw-300px:not(#_) {
  max-width: 300px;
}
.pu-maxw-380px:not(#_) {
  max-width: 380px;
}
.pu-maxw-400px:not(#_) {
  max-width: 400px;
}
.pu-maxw-820px:not(#_) {
  max-width: 820px;
}
.pu-mb-10px:not(#_) {
  margin-bottom: 10px;
}
.pu-mb-12px:not(#_) {
  margin-bottom: 12px;
}
.pu-mb-14px:not(#_) {
  margin-bottom: 14px;
}
.pu-mb-16px:not(#_) {
  margin-bottom: 16px;
}
.pu-mb-18px:not(#_) {
  margin-bottom: 18px;
}
.pu-mb-2px:not(#_) {
  margin-bottom: 2px;
}
.pu-mb-3px:not(#_) {
  margin-bottom: 3px;
}
.pu-mb-4px:not(#_) {
  margin-bottom: 4px;
}
.pu-mb-6px:not(#_) {
  margin-bottom: 6px;
}
.pu-mb-7px:not(#_) {
  margin-bottom: 7px;
}
.pu-mb-8px:not(#_) {
  margin-bottom: 8px;
}
.pu-minh-60vh:not(#_) {
  min-height: 60vh;
}
.pu-minw-0:not(#_) {
  min-width: 0;
}
.pu-ml-10px:not(#_) {
  margin-left: 10px;
}
.pu-ml-6px:not(#_) {
  margin-left: 6px;
}
.pu-ml-auto:not(#_) {
  margin-left: auto;
}
.pu-mt-10px:not(#_) {
  margin-top: 10px;
}
.pu-mt-12px:not(#_) {
  margin-top: 12px;
}
.pu-mt-14px:not(#_) {
  margin-top: 14px;
}
.pu-mt-16px:not(#_) {
  margin-top: 16px;
}
.pu-mt-18px:not(#_) {
  margin-top: 18px;
}
.pu-mt-20px:not(#_) {
  margin-top: 20px;
}
.pu-mt-24px:not(#_) {
  margin-top: 24px;
}
.pu-mt-28px:not(#_) {
  margin-top: 28px;
}
.pu-mt-2px:not(#_) {
  margin-top: 2px;
}
.pu-mt-36px:not(#_) {
  margin-top: 36px;
}
.pu-mt-3px:not(#_) {
  margin-top: 3px;
}
.pu-mt-4px:not(#_) {
  margin-top: 4px;
}
.pu-mt-6px:not(#_) {
  margin-top: 6px;
}
.pu-mt-8px:not(#_) {
  margin-top: 8px;
}
.pu-op-_55:not(#_) {
  opacity: 0.55;
}
.pu-overflow-x-auto:not(#_) {
  overflow-x: auto;
}
.pu-pos-fixed:not(#_) {
  position: fixed;
}
.pu-pos-relative:not(#_) {
  position: relative;
}
.pu-pt-16px:not(#_) {
  padding-top: 16px;
}
.pu-scroll-margin-top-96px:not(#_) {
  scroll-margin-top: 96px;
}
.pu-ta-center:not(#_) {
  text-align: center;
}
.pu-ta-left:not(#_) {
  text-align: left;
}
.pu-tt-none:not(#_) {
  text-transform: none;
}
.pu-tt-uppercase:not(#_) {
  text-transform: uppercase;
}
.pu-user-select-none:not(#_) {
  user-select: none;
}
.pu-w-0p:not(#_) {
  width: 0%;
}
.pu-w-100p:not(#_) {
  width: 100%;
}
.pu-w-14px:not(#_) {
  width: 14px;
}
.pu-w-16px:not(#_) {
  width: 16px;
}
.pu-w-40px:not(#_) {
  width: 40px;
}
.pu-z-index-1000:not(#_) {
  z-index: 1000;
}
.pu-z-index-90:not(#_) {
  z-index: 90;
}
.pu-nowrap:not(#_) {
  white-space: nowrap;
}