/**
 * FOLHA-DE-ESTILO.css — PROJETOS JURÍDICOS (DESIGN-PADRÃO-PJ)
 * Registros oficiais consolidados com as alterações estritas solicitadas pelo usuário.
 *
 * ==========================================================================
 * REGRA DE OURO DOS PLACEHOLDERS E MÁSCARAS:
 * NUNCA utilizar números ou letras nos placeholders.
 * Utilizar estritamente os espaços vazios e pontuações das máscaras oficiais:
 * - CEP: __.___-__             (padrão 00.000-00)
 * - CPF: ___.___.___-__         (padrão 000.000.000-00)
 * - CNPJ: __.__.___/____-__     (padrão 00.000.000/0000-00)
 * - Telefone: (__) _ ____-____ (padrão (00) 0 0000-0000)
 * - E-mail: ____@____.___       (sempre com @ e domínio com ponto)
 * - Financeiro: R$ __.___,__    (padrão R$ 000.000,00 - com vírgula e centavos obrigatórios)
 * - Percentual: __%             (padrão [00%] - números inteiros com %)
 * ==========================================================================
 *
 * PADRONIZAÇÃO REGISTRADA:
 * 1. FORMULÁRIOS:
 *    - Altura: 26px | Borda: 1.2px solid | Raio: 8px | Fonte: 12px (peso 450)
 *    - Padding interno: 2px 5px (laterais aumentadas em 1px) | Margem antes e depois: 6px
 *    - Rótulo SEMPRE acima do campo (12.5px peso 500) e campo abaixo.
 *    - UF: alinhado à esquerda e campo com largura reduzida (~40px).
 *    - Checkbox/Radio sem label próprio: 'Marque a(s) opção(ões):'
 * 2. BOTÕES DE TEXTO:
 *    - Altura: 26px | Borda: 1.5px solid | Raio: 14px | Fonte: 12.4px (500) | Padding: 3px 7px
 *    - Fundo com 60% de opacidade | Hover/Foco: borda 2px e peso 550 | SEM ícones misturados.
 * 3. BOTÕES COM ÍCONE CIRCULARES:
 *    - Dimensão: 26px circular (radius 50%) ou mini-ícone 24px em tabelas | Borda: 1.5px solid
 *    - Fundo: 60% de opacidade | Hover/Foco: borda 2px.
 * 4. TABELAS:
 *    - Cabeçalho: 22px Navy (70% opacidade), texto marfim 11px uppercase centralizado
 *    - Sem borda superior (0px) e sem bordas laterais (0px na esquerda e direita da linha do cabeçalho)
 *    - Células: 27px altura, alinhamento vertical e horizontal centralizado
 *    - Demais linhas horizontais (1px solid #e2e8f0) e bordas laterais no corpo permanecem
 *    - Sem radius externo (0px) | Sem linha final (rodapé removido).
 * 5. CARDS (TIPOS A, B, C e C-DERIVADO):
 *    - Card Tipo A (Quadrado): 140x140px (aspect-ratio: 1/1) | 14px radius | 1.3px borda | padding 6px 8px
 *      Linha 1 (Topo): Título (70% centralizado V/H) + Chip (30% centralizado V/H, radius 12px, borda 1.5px, fonte 10.5px peso 480)
 *      Linha 2 (Centro): Ícone 36x36px centralizado
 *      Linha 3 (Base): Botões circulares 28px com borda 1.5px (+ e ?) centralizados.
 *    - Card Tipo B (Central de Acesso): 14px radius | 1.5px borda (hover 2px) | Coluna 1: 40%, Coluna 2: 60%
 *      Apenas nome do app em 14px uppercase (+1.6px letter-spacing), sem subtexto.
 *    - Card Tipo C (Processos Ativos): 14px radius | Coluna 1: Abrir detalhes (30x30px centralizado)
 *      Coluna 2: NUP normal (13px 550 letter-spacing -0.2px sem monospace) + copy / tipo / chip (11.5px 500 radius 12px) + mov
 *      Coluna 3: Cliente (Polo Ativo/Passivo 500) | Coluna 4: Adverso (Polo Passivo/Ativo 500)
 *      Coluna 5: Vara / Cidade / Tribunal | Coluna 6: Arquivar e Excluir.
 *    - Card Tipo C Derivado (Prazos): Coluna 1: 30x30px | Coluna 2: NUP / Tribunal•Tipo / Cliente
 *      Coluna 3: Descrição | Coluna 4: Data / dias restantes | Coluna 5: Editar, Concluir, Excluir.
 * 6. MODAIS:
 *    - Borda: 2px solid | Radius: 14px | Padding: 6px 8px | Gap: 4px | Sem linhas internas
 *    - Espaço de 6px acima do rodapé e 6px abaixo do cabeçalho
 *    - Título em UPPERCASE, font-weight 500, letter-spacing 1.1px, alinhamento vertical centralizado/middle | Padding top reduzido.
 */

@font-face {
  font-family: 'Google Sans Flex';
  src: url('./fonts/google-sans-flex.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 1000;
  font-display: swap;
}

:root {
  /* Paleta Canônica Institucional */
  --pj-navy: #031a35;
  --pj-navy-light: #062b56;
  --pj-navy-gradient: linear-gradient(155deg, rgba(6,30,88,.92), rgba(9,53,88,.85));
  --pj-cyan: #2fc9f2;
  --pj-cyan-hover: #1bb7df;
  --pj-cyan-ring: rgba(47, 201, 242, 0.25);
  --pj-ivory: #f6f3ec;
  --pj-ivory-dark: #eee8de;
  --pj-surface: #ffffff;
  --pj-border: #dce5ee;
  --pj-border-strong: #b9c7cd;
  --pj-text-main: #061b39;
  --pj-text-muted: #64748b;
  --pj-placeholder: #94a3b8;

  /* Semântica */
  --pj-danger: #d93838;
  --pj-danger-bg: rgba(254, 226, 226, 0.60);
  --pj-danger-border: #fca5a5;
  --pj-success: #16a34a;
  --pj-success-bg: rgba(220, 252, 231, 0.60);
  --pj-success-border: #86efac;

  /* Medidas de Formulário */
  --pj-input-height: 26px;
  --pj-input-border-width: 1.2px;
  --pj-input-radius: 8px;
  --pj-input-font-size: 12px;
  --pj-input-font-weight: 450;
  --pj-input-focus-weight: 500;
  --pj-input-focus-border-width: 1.8px;
  --pj-input-padding: 2px 5px; /* Aumentado 1px nas laterais */
  --pj-label-font-size: 12.5px;
  --pj-label-font-weight: 500;
  --pj-form-spacing-y: 6px;

  /* Medidas de Botões de Texto */
  --pj-btn-text-height: 26px;
  --pj-btn-text-border-width: 1.5px;
  --pj-btn-text-radius: 14px;
  --pj-btn-text-font-size: 12.4px;
  --pj-btn-text-font-weight: 500;
  --pj-btn-text-letter-spacing: -0.1px;
  --pj-btn-text-padding: 3px 7px;
  --pj-btn-text-gap: 6px;

  /* Cores com 60% de Opacidade */
  --pj-btn-bg-primary: rgba(3, 26, 53, 0.60);
  --pj-btn-bg-secondary: rgba(255, 255, 255, 0.60);
  --pj-btn-bg-accent: rgba(47, 201, 242, 0.60);
  --pj-btn-bg-danger: rgba(217, 56, 56, 0.60);

  /* Medidas de Botões com Ícone */
  --pj-btn-icon-size: 26px;
  --pj-btn-icon-radius: 50%;

  /* Medidas de Tabela */
  --pj-table-row-height: 27px; /* 27px de altura */
  --pj-table-header-height: 22px; /* 22px de altura */
  --pj-table-header-bg: rgba(3, 26, 53, 0.70);
  --pj-table-padding: 2px 4px;
  --pj-table-border: 1.5px solid var(--pj-border-strong);
  --pj-table-radius: 0px; /* Sem radius externo */
  --pj-table-footer-height: 12px;

  /* Tipografia do Servidor */
  --font-stack: 'Google Sans Flex', "Aptos", "Segoe UI", sans-serif;
  --font-heading: var(--font-stack);
  --pj-field-gap: 4px;
}

/* ==========================================================================
   1. FORMULÁRIO E CAMPOS DE ENTRADA (RÓTULO SEMPRE ACIMA / PADDING 2px 5px)
   ========================================================================== */

.pj-form-container {
  margin-top: var(--pj-form-spacing-y);
  margin-bottom: var(--pj-form-spacing-y);
  box-sizing: border-box;
}

.pj-form-group {
  display: flex;
  flex-direction: column; /* RÓTULO ACIMA E CAMPO ABAIXO SEMPRE */
  gap: 2px;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.pj-form-label {
  display: block;
  font-family: var(--font-stack);
  font-size: var(--pj-label-font-size);
  font-weight: var(--pj-label-font-weight);
  color: var(--pj-text-main);
  line-height: 1.2;
  margin: 0;
  padding: 0;
  text-align: left;
}

.pj-input {
  box-sizing: border-box;
  width: 100%;
  height: var(--pj-input-height);
  padding: var(--pj-input-padding);
  margin: 0;
  font-family: var(--font-stack);
  font-size: var(--pj-input-font-size);
  font-weight: var(--pj-input-font-weight);
  letter-spacing: 0px;
  color: var(--pj-text-main);
  background: var(--pj-surface);
  border: var(--pj-input-border-width) solid var(--pj-border-strong);
  border-radius: var(--pj-input-radius);
  outline: none;
  text-align: left; /* ALINHADO SEMPRE À ESQUERDA */
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  vertical-align: middle;
}

.pj-input:focus {
  font-weight: var(--pj-input-focus-weight);
  border-width: var(--pj-input-focus-border-width);
  border-color: var(--pj-cyan);
  box-shadow: 0 0 0 2px var(--pj-cyan-ring);
}

/* Placeholder discreto - NUNCA conter números ou letras */
.pj-input::placeholder {
  color: var(--pj-placeholder);
  font-weight: 400;
  letter-spacing: 0.5px;
}

/* UF com largura reduzida (metade) e alinhado à esquerda */
.pj-input.pj-input-uf {
  width: 44px;
  max-width: 44px;
  text-align: left;
}

/* Grid Proporcional Otimizado */
.pj-form-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 8px 8px;
  width: 100%;
  margin: 0;
  padding: 0;
}

.pj-col-uf         { grid-column: span 1; width: 44px; }
.pj-col-num        { grid-column: span 2; }
.pj-col-cep        { grid-column: span 2; }
.pj-col-data       { grid-column: span 2; }
.pj-col-percent    { grid-column: span 2; }
.pj-col-cpf        { grid-column: span 3; }
.pj-col-cnpj       { grid-column: span 3; }
.pj-col-tel        { grid-column: span 3; }
.pj-col-financeiro { grid-column: span 3; }
.pj-col-email      { grid-column: span 4; }
.pj-col-cidade     { grid-column: span 4; }
.pj-col-rua        { grid-column: span 6; }
.pj-col-nome       { grid-column: span 6; }

/* Checkbox e Radio com Rótulo Padrão */
.pj-choice-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.pj-choice-label-fallback {
  font-size: 12px;
  font-weight: 500;
  color: var(--pj-text-main);
}

.pj-choice-options {
  display: flex;
  gap: 12px;
  align-items: center;
}

.pj-choice-item {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11.5px;
  cursor: pointer;
}

/* ==========================================================================
   2. BOTÕES DE TEXTO (26px / 1.5px / 14px / 60% OPACIDADE / SEM ÍCONE)
   ========================================================================== */

.pj-btn-text {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: var(--pj-btn-text-height);
  padding: var(--pj-btn-text-padding);
  margin: 0;
  font-family: var(--font-stack);
  font-size: var(--pj-btn-text-font-size);
  font-weight: var(--pj-btn-text-font-weight);
  letter-spacing: var(--pj-btn-text-letter-spacing);
  line-height: 1;
  border-radius: var(--pj-btn-text-radius);
  border: var(--pj-btn-text-border-width) solid transparent;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
  box-sizing: border-box;
  vertical-align: middle;
  gap: var(--pj-btn-text-gap);
  transition: all 0.15s ease-in-out;
}

.pj-btn-text:hover,
.pj-btn-text:focus-visible {
  border-width: 2px;
  font-weight: 550;
  outline: none;
}

.pj-btn-text.pj-primary {
  background: var(--pj-btn-bg-primary);
  color: var(--pj-ivory);
  border-color: var(--pj-navy);
}
.pj-btn-text.pj-primary:hover {
  background: rgba(6, 43, 86, 0.75);
  border-color: var(--pj-cyan);
}

.pj-btn-text.pj-secondary {
  background: var(--pj-btn-bg-secondary);
  color: var(--pj-navy);
  border-color: var(--pj-border-strong);
}
.pj-btn-text.pj-secondary:hover {
  background: rgba(241, 245, 249, 0.85);
  border-color: var(--pj-navy);
}

.pj-btn-text.pj-accent {
  background: var(--pj-btn-bg-accent);
  color: var(--pj-navy);
  border-color: var(--pj-cyan);
}
.pj-btn-text.pj-accent:hover {
  background: rgba(27, 183, 223, 0.80);
  border-color: var(--pj-navy);
}

.pj-btn-text.pj-danger {
  background: var(--pj-btn-bg-danger);
  color: #ffffff;
  border-color: var(--pj-danger);
}
.pj-btn-text.pj-danger:hover {
  background: rgba(217, 56, 56, 0.85);
  border-color: #991b1b;
}

/* ==========================================================================
   3. BOTÕES COM ÍCONE CIRCULARES (26px / 1.5px / 50% / 60% OPACIDADE)
   ========================================================================== */

.pj-btn-icon-circle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--pj-btn-icon-size);
  height: var(--pj-btn-icon-size);
  min-width: var(--pj-btn-icon-size);
  min-height: var(--pj-btn-icon-size);
  padding: 0;
  margin: 0;
  border: var(--pj-btn-text-border-width) solid var(--pj-border-strong);
  border-radius: var(--pj-btn-icon-radius);
  background: var(--pj-btn-bg-secondary);
  color: var(--pj-navy);
  cursor: pointer;
  box-sizing: border-box;
  vertical-align: middle;
  transition: all 0.15s ease-in-out;
}

.pj-btn-icon-circle svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  display: block;
}

.pj-btn-icon-circle:hover,
.pj-btn-icon-circle:focus-visible {
  border-width: 2px;
  border-color: var(--pj-navy);
  background: rgba(241, 245, 249, 0.85);
  outline: none;
}

.pj-btn-icon-circle.pj-primary {
  background: var(--pj-btn-bg-primary);
  color: var(--pj-ivory);
  border-color: var(--pj-navy);
}
.pj-btn-icon-circle.pj-primary:hover {
  background: rgba(6, 43, 86, 0.75);
  border-color: var(--pj-cyan);
}

.pj-btn-icon-circle.pj-secondary {
  background: var(--pj-btn-bg-secondary);
  color: var(--pj-navy);
  border-color: var(--pj-border-strong);
}

.pj-btn-icon-circle.pj-danger {
  background: var(--pj-btn-bg-danger);
  color: #ffffff;
  border-color: var(--pj-danger);
}

/* Mini-ícone para tabelas */
.pj-btn-icon-mini {
  width: 24px;
  height: 24px;
  min-width: 24px;
  min-height: 24px;
  border-radius: 50%;
  border: 1.2px solid var(--pj-border-strong);
  background: var(--pj-btn-bg-secondary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
}
.pj-btn-icon-mini:hover {
  border-width: 2px;
  border-color: var(--pj-navy);
}
.pj-btn-icon-mini svg {
  width: 12px;
  height: 12px;
}

/* ==========================================================================
   4. TABELAS (CABEÇALHO 22px SEM BORDAS LATERAIS/SUPERIOR / CÉLULAS 27px CENTRALIZADAS / SEM LINHA FINAL)
   ========================================================================== */

.pj-table-compact {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 11.5px;
  background: #ffffff;
  border: none !important; /* Sem borda envolvente no elemento table para não passar pelo cabeçalho */
  border-radius: 0px !important; /* Sem radius externo */
  overflow: hidden;
}

.pj-table-compact thead th {
  background: var(--pj-table-header-bg); /* Navy 70% opacidade */
  color: var(--pj-ivory);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  height: var(--pj-table-header-height); /* 22px */
  padding: 0 4px;
  text-align: center;
  vertical-align: middle;
  letter-spacing: 0.04em;
  border: none !important; /* 0px na linha superior, esquerda e direita do cabeçalho */
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

.pj-table-compact tbody tr {
  height: var(--pj-table-row-height); /* 27px */
}

.pj-table-compact tbody tr:hover td {
  background: #f8fafc;
}

.pj-table-compact tbody td {
  height: var(--pj-table-row-height); /* 27px */
  padding: 2px 4px;
  font-size: 11.5px;
  text-align: center; /* Alinhamento horizontal centralizado */
  vertical-align: middle; /* Alinhamento vertical centralizado */
  border: 0;
  border-bottom: 1px solid #e2e8f0 !important; /* as demais linhas horizontais permanecem */
}

/* Bordas laterais e final somente no corpo da tabela (preservando o cabeçalho livre) */
.pj-table-compact tbody td:first-child {
  border-left: 1.5px solid var(--pj-border-strong) !important;
}

.pj-table-compact tbody td:last-child {
  border-right: 1.5px solid var(--pj-border-strong) !important;
}

.pj-table-compact tbody tr:last-child td {
  border-bottom: 1.5px solid var(--pj-border-strong) !important;
}

/* Linha final removida conforme instrução */
.pj-table-compact tfoot {
  display: none !important;
}

/* ==========================================================================
   5. CARDS (TIPOS A, B, C e C-DERIVADO)
   ========================================================================== */

/* 5.1 Card Tipo A (Quadrado Exato: 140x140px / 14px radius / 1.3px borda / padding 6px 8px) */
.pj-card-type-a {
  background: #ffffff;
  border: 1.3px solid var(--pj-border);
  border-radius: 14px;
  padding: 6px 8px;
  box-sizing: border-box;
  width: 140px;
  height: 140px;
  min-width: 140px;
  min-height: 140px;
  max-width: 140px;
  max-height: 140px;
  aspect-ratio: 1 / 1; /* QUADRADO EXATO */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  transition: all 0.15s ease-in-out;
  overflow: hidden;
}

.pj-card-type-a:hover {
  border-color: var(--pj-cyan);
  box-shadow: 0 4px 12px rgba(3, 26, 53, 0.08);
}

/* Linha 1 (Topo): TITULO (70% centralizado V/H) + CHIP (30% centralizado V/H) */
.pj-card-type-a-header {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 2px;
  min-height: 28px;
  box-sizing: border-box;
}

.pj-card-type-a-title-col {
  width: 70%;
  flex: 0 0 70%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding-right: 2px;
  box-sizing: border-box;
}

.pj-card-type-a-title {
  font-family: var(--font-stack);
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: -0.1px;
  color: var(--pj-navy);
  margin: 0;
  text-align: center;
  line-height: 1.15;
  word-break: break-word;
}

.pj-card-type-a-chip-col {
  width: 30%;
  flex: 0 0 30%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

/* Chip com radius 12px, borda 1.5px, fonte 10.5px, weight 480 */
.pj-card-type-a-chip {
  font-family: var(--font-stack);
  font-size: 10.5px;
  font-weight: 480; /* WEIGHT 480 */
  letter-spacing: -0.1px;
  padding: 1px 4px;
  border-radius: 12px; /* RADIUS 12px */
  border: 1.5px solid var(--pj-cyan); /* BORDA 1.5px */
  background: rgba(224, 242, 254, 0.45);
  color: #0369a1;
  white-space: nowrap;
  line-height: 1.2;
}

/* Linha 2 (Centro): Ícone 36px × 36px */
.pj-card-type-a-icon {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--pj-navy);
  margin: auto 0;
}

.pj-card-type-a-icon svg {
  width: 36px;
  height: 36px;
}

/* Linha 3 (Base): Botões Circulares de 28px com borda 1.5px (+ e ?) */
.pj-card-type-a-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin: 0;
  padding: 0;
}

.pj-btn-circle-28 {
  width: 28px;
  height: 28px;
  min-width: 28px;
  min-height: 28px;
  border-radius: 50%;
  border: 1.5px solid var(--pj-border-strong);
  background: rgba(255, 255, 255, 0.60);
  color: var(--pj-navy);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  transition: all 0.15s ease-in-out;
  box-sizing: border-box;
}

.pj-btn-circle-28 svg {
  width: 14px;
  height: 14px;
  display: block;
}

.pj-btn-circle-28:hover {
  border-width: 2px;
  border-color: var(--pj-cyan);
  background: rgba(224, 242, 254, 0.60);
}

/* 5.2 Card Tipo B (Central de Acesso: Coluna 1 40% / Coluna 2 60% / Fonte 14px uppercase +1.6px) */
.pj-card-type-b {
  background: #ffffff;
  border: 1.5px solid var(--pj-border-strong);
  border-radius: 14px;
  padding: 6px 10px;
  display: grid;
  grid-template-columns: 40% 60%;
  align-items: center;
  box-sizing: border-box;
  cursor: pointer;
  transition: all 0.15s ease;
  min-height: 48px;
}

.pj-card-type-b:hover,
.pj-card-type-b:focus-visible {
  border-width: 2px;
  border-color: var(--pj-cyan);
  background: #fafcfe;
  outline: none;
}

.pj-card-type-b-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--pj-navy);
}

.pj-card-type-b-icon svg {
  width: 28px;
  height: 28px;
}

.pj-card-type-b-text {
  font-family: var(--font-stack);
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: +1.6px;
  color: var(--pj-navy);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 5.3 Card Tipo C (Processos Ativos - 6 Colunas / Coluna 1: Abrir detalhes 30x30 / 3 Linhas) */
.pj-card-type-c {
  background: #ffffff;
  border: 1.4px solid var(--pj-border);
  border-radius: 14px;
  padding: 6px 10px;
  display: grid;
  grid-template-columns: 38px 2.2fr 1.6fr 1.6fr 1.6fr 68px;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
  box-sizing: border-box;
  margin-bottom: 6px;
  transition: all 0.15s ease;
}

.pj-card-type-c:hover {
  border-color: var(--pj-cyan);
  background: #fafcfe;
}

/* Coluna 1: Ícone de Abrir Detalhes (30x30 centralizado) */
.pj-card-c-col-open {
  display: flex;
  align-items: center;
  justify-content: center;
}

.pj-btn-open-detail {
  width: 30px;
  height: 30px;
  min-width: 30px;
  min-height: 30px;
  border-radius: 50%;
  border: 1.2px solid var(--pj-border-strong);
  background: rgba(255, 255, 255, 0.60);
  color: var(--pj-navy);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  transition: all 0.15s ease;
}

.pj-btn-open-detail:hover {
  border-width: 2px;
  border-color: var(--pj-cyan);
  background: rgba(224, 242, 254, 0.60);
}

.pj-btn-open-detail svg {
  width: 16px;
  height: 16px;
}

/* Coluna 2: NUP + copy / Tipo / Chips */
.pj-card-c-col-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1.2;
}

/* Formatação normal do NUP: font-size 13px, weight 550, letter-spacing negativo, SEM monospace/code */
.pj-nup-row {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-stack);
  font-size: 13px;
  font-weight: 550;
  letter-spacing: -0.2px;
  color: var(--pj-navy);
}

.pj-nup-row span {
  font-family: var(--font-stack);
  font-size: 13px;
  font-weight: 550;
  letter-spacing: -0.2px;
  color: var(--pj-navy);
}

.pj-copy-btn {
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  display: inline-flex;
  align-items: center;
  color: var(--pj-text-muted);
}
.pj-copy-btn:hover { color: var(--pj-cyan); }
.pj-copy-btn svg { width: 13px; height: 13px; }

.pj-process-type {
  font-size: 11px;
  color: var(--pj-text-muted);
}

.pj-process-status-line {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: #334155;
  margin-top: 1px;
}

/* Chip abaixo do NUP: font-size 11.5px, weight 500, radius 12px no contorno */
.pj-badge-chip-inline {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-stack);
  height: 18px;
  padding: 1px 7px;
  font-size: 11.5px;    /* 11.5px */
  font-weight: 500;     /* WEIGHT 500 */
  letter-spacing: -0.1px;
  border-radius: 12px;  /* RADIUS 12px */
  border: 1px solid var(--pj-border-strong);
  background: #f8fafc;
  color: #334155;
  line-height: 1.2;
}
.pj-badge-chip-inline.primary { border-color: var(--pj-cyan); color: #0369a1; background: rgba(224, 242, 254, 0.45); }
.pj-badge-chip-inline.success { border-color: #86efac; color: #15803d; background: rgba(220, 252, 231, 0.45); }
.pj-badge-chip-inline.warning { border-color: #fde047; color: #854d0e; background: rgba(254, 249, 195, 0.45); }
.pj-badge-chip-inline.danger  { border-color: #fca5a5; color: #b91c1c; background: rgba(224, 242, 254, 0.45); }

/* Colunas 3 e 4: Partes (Polo Ativo / Polo Passivo com font-weight 500) */
.pj-card-c-col-party {
  display: flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1.2;
}

.pj-party-name {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--pj-navy);
}

.pj-party-pole {
  font-size: 11px;
  font-weight: 500; /* PESO 500 */
  color: var(--pj-text-muted);
}

/* Coluna 5: Vara, Cidade, Tribunal */
.pj-card-c-col-origin {
  display: flex;
  flex-direction: column;
  gap: 1px;
  font-size: 11px;
  line-height: 1.2;
  color: #334155;
}

/* Coluna 6: Ações Arquivar e Excluir */
.pj-card-c-col-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}

/* 5.4 Card Tipo C Derivado (Prazos e Expedientes) */
.pj-card-type-c-prazos {
  background: #ffffff;
  border: 1.4px solid var(--pj-border);
  border-radius: 14px;
  padding: 6px 10px;
  display: grid;
  grid-template-columns: 38px 2.2fr 2.5fr 1.6fr 95px;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
  box-sizing: border-box;
  margin-bottom: 6px;
  transition: all 0.15s ease;
}

.pj-card-type-c-prazos:hover {
  border-color: var(--pj-cyan);
  background: #fafcfe;
}

.pj-prazos-due-line {
  display: flex;
  flex-direction: column;
  gap: 1px;
  line-height: 1.2;
}

.pj-due-date {
  font-size: 11.5px;
  font-weight: 700;
  color: var(--pj-navy);
}

.pj-due-countdown {
  font-size: 10.5px;
  font-weight: 600;
  color: var(--pj-danger);
}

/* ==========================================================================
   6. MODAIS (TÍTULO EM UPPERCASE COM LETTER-SPACING NEGATIVO)
   ========================================================================== */

.pj-modal-dialog {
  box-sizing: border-box;
  width: min(640px, calc(100vw - 32px));
  background: var(--pj-surface);
  border: 2px solid var(--pj-border-strong);
  border-radius: 14px;
  padding: 6px 8px;
  box-shadow: 0 10px 30px rgba(3, 26, 53, 0.25);
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.pj-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 4px 2px 4px; /* REDUZIDO PADDING TOP */
  margin-bottom: 6px;     /* Espaço de 6px abaixo do cabeçalho */
  border: none;           /* SEM LINHAS HORIZONTAIS INTERNAS */
}

/* Título em UPPERCASE, font-weight 500, letter-spacing 1.1px, alinhamento vertical middle */
.pj-modal-title {
  margin: 0;
  font-family: var(--font-stack);
  font-size: 12.5px;
  font-weight: 500;       /* FONT WEIGHT: 500 */
  text-transform: uppercase;
  letter-spacing: 1.1px;  /* LETTER-SPACING: 1.1px */
  color: var(--pj-navy);
  display: inline-flex;
  align-items: center;    /* ALINHAMENTO VERTICAL CENTRALIZADO/MIDDLE */
  vertical-align: middle;
  line-height: 1.2;
}

.pj-modal-body {
  padding: 0 4px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
}

.pj-modal-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  padding: 2px 4px;
  margin-top: 6px;    /* Espaço de 6px acima do rodapé */
  border: none;       /* SEM LINHAS HORIZONTAIS INTERNAS */
}

/* Catálogos: mesma grade e cards centrais dos produtos. */
.pj-catalog-grid:is(.modules-grid,.document-catalog-cards){display:grid;grid-template-columns:repeat(auto-fill,140px);gap:12px;justify-content:start}
:is(.document-catalog,.modules-grid) .module-card-action span{display:none}
.document-catalog .document-model-icon{object-fit:contain;max-width:36px;max-height:36px}
.modules-grid .module-card p{font-size:10px;line-height:1.2;margin:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

/* Componentes operacionais reconciliados com FOLHA-DE-ESTILO.css. */
.pj-modal-header,
.pj-form-heading,
.calc-dialog-header {
  padding: 6px 8px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin-bottom: 6px;     /* Espaço de 6px abaixo do cabeçalho */
  border: none;           /* SEM LINHAS HORIZONTAIS INTERNAS */
}

/* Título H2 do cabeçalho de modal/diálogo */
.pj-modal-header h2,
.pj-form-heading h2,
.calc-dialog-header h2,
.pj-modal-title {
  margin: 0;
  font-family: var(--font-heading, 'Nunito Sans', 'Nunito', sans-serif);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 1.15px;
  text-transform: uppercase;
  color: var(--pj-navy);
  display: inline-flex;
  align-items: center;    /* ALINHAMENTO VERTICAL CENTRALIZADO */
  vertical-align: middle;
  line-height: 1.2;
  gap: 8px;               /* GAP DE 8px ENTRE O MAIOR E O MENOR */
}

/* Texto menor de 13px (subtítulo ou detalhe secundário) */
.pj-modal-header small,
.pj-form-heading small,
.calc-dialog-header small,
.pj-modal-subtitle {
  font-family: var(--font-stack, 'Aptos', sans-serif);
  font-size: 13px;
  font-weight: 350;
  letter-spacing: normal;
  color: var(--pj-text-muted);
  display: inline-flex;
  align-items: center;    /* ALINHAMENTO VERTICAL CENTRALIZADO */
  vertical-align: middle;
  line-height: 1.2;
}

.pj-modal-body {
  padding: 0 4px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
}

.pj-modal-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  padding: 2px 4px;
  margin-top: 6px;    /* Espaço de 6px acima do rodapé */
  border: none;       /* SEM LINHAS HORIZONTAIS INTERNAS */
}

/* ==========================================================================
   7. TÍTULO GERAL DE PÁGINA OPERACIONAL
   ========================================================================== */

/* Bloco do cabeçalho de página operacional */
.pj-page-header,
.page-heading,
.calc-heading,
.document-heading {
  margin: 0 0 12px;
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0;
}

/* Título principal (H1) */
.pj-page-header h1,
.page-heading h1,
.calc-heading h1,
.document-heading h1,
.pj-clientes-demandas .pj-page-title,
body.calc-app-body .identity-page h1,
body.pj-interface.docs-app-body .docs-content :is(.pj-page-title,.docs-page-heading h1,.calc-heading h1,.vinculados-heading h1,.identity-page>header h1),
.pj-page-title {
  font-family: var(--font-stack);
  font-size: 20px;
  font-weight: 620;
  font-variation-settings: 'ROND' 35;
  letter-spacing: -0.6px;
  text-transform: uppercase;
  line-height: 1.1;
  text-align: left;
  margin: 0 0 6px;
  color: var(--pj-navy);
}

/* Subtítulo */
.pj-page-header p,
.page-heading p,
.calc-heading p,
.document-heading p,
.pj-page-subtitle {
  font-family: var(--font-stack);
  font-size: 13px;
  font-weight: 350;
  letter-spacing: -0.2px;
  line-height: 1.2;
  color: var(--pj-text-muted);
  margin: 1px 0 0 0;
}


.pj-btn-text.pj-btn-create { position:relative; font-weight:550; letter-spacing:-.5px; font-size:12.5px; border:1.5px solid transparent; box-sizing:border-box; }
.pj-btn-text.pj-btn-create::after { content:""; position:absolute; inset:-1px; border:1.5px solid var(--pj-border-strong); border-radius:inherit; pointer-events:none; }
.pj-btn-text.pj-btn-create:hover, .pj-btn-text.pj-btn-create:focus-visible { border-width:1.5px; }
.pj-btn-text.pj-btn-create:hover::after, .pj-btn-text.pj-btn-create:focus-visible::after { border-width:2px; }
.pj-btn-text.pj-btn-create svg { width:17px;height:17px;flex:none; }
.pj-back-title { display:flex;align-items:flex-start;gap:10px; }
.pj-page-header .pj-client-subtitle,.pj-client-subtitle,.pj-subtitle { font-family:var(--font-stack);font-size:14px;font-weight:500;font-variation-settings:'ROND' 30;letter-spacing:-.8px; }
dialog:not([open]) { display:none; }
.pj-action-square { display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;min-width:28px;border:1.5px solid var(--pj-border-strong);border-radius:6px;background:var(--pj-surface);color:var(--pj-navy);padding:3px; }
.pj-action-square svg { width:20px;height:20px; }

/* Conteúdo operacional: a página inicial e o conteúdo dos documentos mantêm
   sua tipografia própria. A centralização pertence somente aos diálogos. */
:is(body.calc-app-body,body.docs-app-body) :is(.calc-main,.docs-content):not(:has(.calc-home,.docs-home)) {
  font-family:var(--font-stack);font-size:14px;font-weight:400;letter-spacing:-.1px;
  align-self:start;align-content:start;justify-content:start;
}
body.calc-app-body .calc-main { display:block;margin-top:12px; }
body.pj-interface .identity-page { margin:0;max-width:none;padding:0; }
body.pj-interface .pj-section-title,body.pj-interface .pj-calc-list-section h2,body.pj-cd-inline .pj-cadastro-card h3 {
  font-family:var(--font-stack);font-size:13.5px;font-weight:650;font-variation-settings:'ROND' 30;
  letter-spacing:-.2px;margin:12px 0 8px;line-height:1.2;text-transform:uppercase;
}
body.pj-interface dialog:modal {
  position:fixed;inset:0;margin:auto;max-width:calc(100vw - 32px);
  max-height:calc(100dvh - 32px);box-sizing:border-box;
}
/* Cadastro nativo na página de detalhes: flexível, até quatro campos por linha. */
body.pj-cd-pagina #cadastro-form { min-height:0; }
body.pj-cd-inline .pj-form-body { padding:0;overflow:visible; }
body.pj-cd-inline .pj-cadastro-card { padding:0 0 8px;border:0;margin-bottom:8px; }
body.pj-cd-inline .pj-cadastro-card h3 { color:var(--pj-navy); }
body.pj-cd-inline .pj-client-intro { display:block; }
body.pj-cd-inline .pj-client-grid {
  display:flex;flex-wrap:wrap;gap:var(--pj-field-gap);align-items:flex-start;
}
body.pj-cd-inline .pj-client-grid > .form-group {
  flex:1 1 calc((100% - 3 * var(--pj-field-gap)) / 4);
  max-width:calc((100% - 3 * var(--pj-field-gap)) / 4);min-width:0;
}
body.pj-cd-inline .pj-client-grid > .pj-cadastro-hint { flex-basis:100%; }
body.pj-cd-inline .pj-inline-field {
  --pj-inline-actions-width:20px;display:flex;flex-wrap:wrap;align-items:center;
  position:relative;gap:2px var(--pj-field-gap);min-height:0;padding:0;margin:0;
}
body.pj-cd-inline .pj-inline-field > :is(label,h4) {
  flex:0 0 100%;order:0;font-family:var(--font-stack);font-size:var(--pj-label-font-size);
  font-weight:var(--pj-label-font-weight);line-height:1.2;margin:0;padding:0;
}
body.pj-cd-inline .pj-inline-field > :is(.pj-inline-value,input,select,textarea,.pj-legal-row) {
  order:2;flex:1 1 0;min-width:0;width:calc(100% - var(--pj-inline-actions-width) - var(--pj-field-gap));
}
body.pj-cd-inline .pj-inline-value {
  min-height:var(--pj-input-height);box-sizing:border-box;display:flex;align-items:center;
  white-space:pre-wrap;overflow-wrap:anywhere;padding:var(--pj-input-padding);
  font-family:var(--font-stack);font-size:var(--pj-input-font-size);font-weight:var(--pj-input-font-weight);
}
body.pj-cd-inline .pj-inline-actions { position:static;order:1;display:flex;align-items:center;gap:0;flex:none; }
body.pj-cd-inline .pj-inline-actions .pj-action-square {
  width:20px;height:20px;min-width:20px;min-height:20px;border:0;border-radius:0;padding:0;
  background:transparent;box-shadow:none;cursor:pointer;
}
body.pj-cd-inline .pj-inline-field[data-editing] { --pj-inline-actions-width:40px; }
body.pj-cd-inline .pj-inline-field[data-editing] > :is(.pj-inline-value,.pj-radio-options) { display:none!important; }
body.pj-cd-inline .pj-inline-field:not([data-editing]) > :not(label):not(h4):not(.pj-inline-value):not(.pj-inline-actions) { display:none!important; }
body.pj-cd-inline .pj-legal-chips { order:3;flex-basis:100%; }
body.pj-cd-inline .pj-legal-section { border:0; }
body.pj-cd-inline #cadastro-save-status { position:static;padding:0;margin:0 0 4px; }
body.pj-cd-inline #cadastro-save-status:empty { display:none; }
@media(max-width:900px) { body.pj-cd-inline .pj-client-grid > .form-group { flex-basis:calc((100% - 2 * var(--pj-field-gap)) / 3);max-width:calc((100% - 2 * var(--pj-field-gap)) / 3); } }
@media(max-width:650px) { body.pj-cd-inline .pj-client-grid > .form-group { flex-basis:calc((100% - var(--pj-field-gap)) / 2);max-width:calc((100% - var(--pj-field-gap)) / 2); } }
@media(max-width:420px) { body.pj-cd-inline .pj-client-grid > .form-group { max-width:100%;flex-basis:100%; } }

/* Margens do conteúdo independentes do respiro interno da navegação lateral. */
body.pj-interface:is(.calc-app-body,.docs-app-body):not(.calc-embedded):not(.pj-cd-formulario) :is(.calc-main,.docs-content) {
  box-sizing:border-box;width:100%;max-width:none;margin:12px 0;padding:0 7% 0 3%;
}
body.pj-interface.docs-app-body .docs-content:not([data-editor-page]) > main { max-width:none!important;margin:0!important;padding:0!important; }
.pj-heading-summary { display:flex;align-items:center;justify-content:flex-start;gap:16px;margin:0 0 12px; }
.pj-heading-summary :is(.pj-page-header,.pj-back-title) { margin:0;min-width:0; }
.pj-header-metric { display:flex;align-items:center;gap:8px;flex:none;border:0;background:transparent;padding:0;color:var(--pj-navy); }
.pj-header-metric > span:last-child { display:flex;align-items:center;gap:8px; }
.pj-header-metric small { font:600 11px/1.2 var(--font-stack); }
.pj-header-metric strong { font:600 26px/1 var(--font-stack); }
.pj-metric-icon { display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:#f4eddf; }
.pj-metric-icon :is(svg,img) { width:26px;height:26px; }
@media(max-width:520px) { .pj-heading-summary { gap:8px; }.pj-header-metric { gap:4px; }.pj-header-metric > span:last-child { flex-direction:column;gap:2px; }.pj-metric-icon { width:28px;height:28px; } }
.pj-history-filter { display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin:0 0 8px; }
.pj-history-filter .pj-input { flex:1;min-width:140px;max-width:480px; }
.pj-interface .identity-page .pj-panel { border:1.5px solid var(--pj-border-strong);border-radius:14px;background:var(--pj-surface);padding:8px;margin:8px 0;box-shadow:none; }
.pj-interface .identity-page .pj-section-title { margin:0 0 8px; }
.pj-interface .identity-page header { margin:0 0 12px; }
.pj-interface .identity-page .identity-fields { gap:6px 4px; }

/* Ajuda explicativa acessível por mouse, teclado e toque, junto do rótulo. */
.pj-field-help { position:relative;display:inline-flex;vertical-align:middle;margin-left:4px;text-transform:none;letter-spacing:normal; }
body.pj-interface:is(.calc-app-body,.docs-app-body) .pj-field-help > .pj-help-trigger { display:inline-flex;align-items:center;justify-content:center;flex:none;width:14px;height:14px;min-width:14px;min-height:14px;padding:0;margin:0;border:0;border-radius:0;background:transparent;color:#1563a8;cursor:help;font:inherit;line-height:1; }
.pj-interface .pj-field-help > .pj-help-trigger :is(img,svg) { display:block;width:14px;height:14px; }
.pj-help-popup { display:none;position:fixed;z-index:1200;width:max-content;max-width:min(210px,calc(100vw - 24px));box-sizing:border-box;padding:6px 8px;border:1px solid var(--pj-border-strong);border-radius:6px;background:var(--pj-surface);color:var(--pj-navy);box-shadow:0 3px 10px #031a3520;white-space:normal;font:550 9px/1.4 var(--font-stack);letter-spacing:0;text-align:left; }
.pj-field-help[data-open] .pj-help-popup { display:block; }
.pj-footer-links a.pj-footer-access { display:inline-flex;align-items:center;gap:4px;padding:0;background:transparent;text-decoration:none;font:500 11px var(--font-stack);color:var(--pj-navy); }
.pj-footer-access .pj-monogram-frame { width:19.2px;height:24px;min-width:19.2px; }
.pj-footer-access .pj-monogram-ivory { width:27.26px;height:27.26px;left:-4.82px;top:-.78px;background-color:var(--pj-navy); }
.pj-home-actions { display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin:0 0 12px; }

/* Autocompletes de cadastro, consultas e seleções usam o mesmo componente. */
.pj-interface .pj-autocomplete-options { z-index:1100;box-sizing:border-box;max-height:170px;overflow:auto;border:1px solid var(--pj-border-strong);border-radius:var(--pj-input-radius);background:var(--pj-surface);color:var(--pj-text-main);box-shadow:0 3px 10px #031a3520; }
.pj-autocomplete-options[hidden] { display:none!important; }
body.pj-interface:is(.calc-app-body,.docs-app-body) .pj-autocomplete-options .pj-autocomplete-option[role=option],
.pj-interface .pj-autocomplete-options .pj-autocomplete-empty,
.pj-interface .pj-autocomplete-options .pj-autocomplete-error {
 display:block;box-sizing:border-box;width:100%;min-height:0;height:auto;margin:0;padding:3px 5px;
 border:0;border-radius:0;background:transparent;color:inherit;text-align:left;text-transform:none;
 font:450 11.5px/1.35 var(--font-stack);letter-spacing:-.8px;white-space:normal;
}
.pj-interface .pj-autocomplete-options .pj-autocomplete-empty { font-style:italic; }
.pj-interface .pj-autocomplete-options .pj-autocomplete-error { color:var(--pj-danger); }
.pj-interface .pj-autocomplete-option:is(:hover,[aria-selected=true]) { background:var(--pj-ivory);outline:0; }

/* Abas centrais: mesma apresentação de Histórico, sem aparência de botão. */
.pj-tabs,.pj-interface .document-history-tabs { display:flex;flex-wrap:wrap;gap:16px;align-items:center;border-bottom:1px solid var(--pj-border-strong);margin:10px 0; }
body.pj-interface:is(.calc-app-body,.docs-app-body) .pj-tabs[role=tablist] > .pj-tab[role=tab],
.pj-interface .document-history-tabs > a {
 display:inline-flex;align-items:center;justify-content:center;width:auto;min-height:26px;height:auto;
 margin:0;padding:5px 0;border:0;border-radius:0;background:transparent;color:var(--pj-navy);
 font:500 14px/1.2 var(--font-stack);letter-spacing:-.1px;text-decoration:none;box-shadow:none;cursor:pointer;
}
body.pj-interface:is(.calc-app-body,.docs-app-body) .pj-tabs[role=tablist] > .pj-tab[aria-selected=true],
.pj-interface .document-history-tabs > [aria-current=page] { box-shadow:inset 0 -2px var(--pj-navy);font-weight:600; }
.pj-tab:focus-visible { outline:2px solid var(--pj-cyan);outline-offset:2px; }

/* Raios dos controles de formulário prevalecem sobre folhas legadas.
   Ferramentas do editor, conteúdo do documento, abas e itens de listas
   conservam a geometria própria de seus componentes. */
body.pj-interface:is(.calc-app-body,.docs-app-body) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=file]):not([type=range]):not([type=color]):not([type=image]):not([type=submit]):not([type=button]):not([type=reset]),select,textarea):not(:where([contenteditable], [contenteditable] *, .a4-sheet *, .calc-print-page *, .calc-mini-paper *)) {
 border-radius:var(--pj-input-radius)!important;
}
body.pj-interface:is(.calc-app-body,.docs-app-body) :is(.btn,.pj-btn,.pj-btn-text,.pj-btn-forte,.editor-fluxo-botao):not(:where([contenteditable] *, .a4-sheet *, .editor-command-panel *, .editor-fluxo-menu *, .tool-btn, .pj-icon-button, .module-card-action, [role=option], [role=tab])) {
 border-radius:var(--pj-btn-text-radius)!important;
}
body.pj-interface:is(.calc-app-body,.docs-app-body) :is(.document-catalog,.modules-grid) .module-card-action {
 border-radius:50%!important;
}

/* Início comum: o posicionamento vertical foi solicitado para esta tela. */
@font-face { font-family:'Akatab';font-style:normal;font-weight:400;font-display:swap;src:url('/static/plataforma/fonts/akatab-regular.ttf') format('truetype'); }
body.pj-interface:is(.calc-app-body,.docs-app-body) .pj-home {
 display:flex;flex-direction:column;justify-content:center;align-items:flex-start;box-sizing:border-box;
 width:100%;max-width:none;min-width:0;min-height:calc(100svh - 84px);margin:0;
 padding:36px 0 84px clamp(18px,4vw,56px);background:none;color:var(--pj-navy);
}
.pj-home-welcome { margin:0 0 22px;max-width:100%; }
body.pj-interface:is(.calc-app-body,.docs-app-body) .pj-home h1 { margin:0 0 8px;font:620 clamp(30px,3.1vw,42px)/1.1 var(--font-stack);letter-spacing:-.8px;text-transform:none; }
.pj-home-date { margin:0 0 6px;font:400 14px/1.5 var(--font-stack);letter-spacing:-.1px; }
.pj-home-last-access { margin:0 0 10px;font:400 9.5px/1.5 'Akatab',sans-serif;letter-spacing:1.15px; }
.pj-home-membership { display:flex;flex-direction:column;gap:2px;margin:0;font:400 12px/1.4 var(--font-stack); }
.pj-home-membership strong { font-weight:550; }
.pj-home .pj-home-actions { justify-content:flex-start;margin:0;gap:8px;max-width:100%; }
.pj-home-actions > .pj-card-type-b { width:250px;max-width:100%;min-height:64px;border-radius:16px;text-decoration:none; }
.pj-home-card-content { display:flex;flex-direction:column;min-width:0;gap:3px; }
.pj-home-card-content .pj-card-type-b-text { white-space:normal;line-height:1.25; }
.pj-home-card-count { font:400 10px/1.3 var(--font-stack);letter-spacing:0;text-transform:none;color:var(--pj-navy); }
.pj-footer-brand > strong { display:inline-flex;align-items:center;gap:4px; }
.pj-footer-brand .pj-monogram-frame { display:inline-block;width:12.8px;height:16px;min-width:12.8px;vertical-align:middle; }
.pj-footer-brand .pj-monogram-ivory { width:18.17px;height:18.17px;left:-3.21px;top:-.52px;background-color:var(--pj-navy); }
@media(max-width:520px) {
 body.pj-interface:is(.calc-app-body,.docs-app-body) .pj-home { padding:36px 0 48px 18px;min-height:calc(100svh - 130px); }
 .pj-home-actions > .pj-card-type-b { width:100%;min-height:60px; }
 .pj-home .pj-home-actions { width:100%; }
}
