/*
 * Espaço NM — adaptação estrutural do protótipo Material 3 Expressive.
 * Os valores abaixo reproduzem a referência aprovada; esta camada apenas
 * conecta o design aos módulos reais e não redefine a direção visual.
 */

:root {
  --nm-shell-rail-open: 264px;
  --nm-shell-rail-closed: 84px;
  --nm-shell-header: 68px;
}

body.nm-reference-shell {
  background: var(--nm-bg);
  color: var(--nm-on-surface);
}

/* Navegação global da referência */
body.nm-reference-shell #nav-rail {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 80;
  width: var(--nm-shell-rail-open);
  height: 100vh;
  /* V2.3.32 — o rail tem 16 destinos: com item fixo em 44px e respiro fixo ele
     ultrapassava a altura da janela em telas de 768px ou menos e passava a
     rolar, escondendo os últimos ícones. Altura de item, respiro e recuo agora
     acompanham a janela: 44px onde cabe, comprimindo até o piso confortável
     em telas baixas. A rolagem permanece como rede de segurança, mas não é
     mais acionada no uso normal. */
  padding: clamp(6px, 1.2vh, 14px) 12px;
  gap: clamp(1px, .45vh, 6px);
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: none;
  background: var(--nm-surface);
  color: var(--nm-on-surface-var);
  border: 0;
  border-right: 1px solid var(--nm-outline-var);
  box-shadow: none;
  transition: width var(--nm-slow) var(--nm-ease);
}

body.nm-reference-shell #nav-rail::-webkit-scrollbar { width: 0; height: 0; }

body.nm-reference-shell:not(.nm-shell-expanded) #nav-rail {
  width: var(--nm-shell-rail-closed);
}

body.nm-reference-shell #nav-rail .rail-logo,
body.nm-reference-shell #nav-rail #m3-datetime,
body.nm-reference-shell #nav-rail .rail-sep,
body.nm-reference-shell #nav-rail #m3-theme-button {
  display: none !important;
}

body.nm-reference-shell #m3-nav-toggle {
  order: -20;
  min-height: clamp(32px, 4.2vh, 42px);
  margin: 0 0 clamp(2px, .5vh, 6px);
  justify-content: flex-end;
}

body.nm-reference-shell:not(.nm-shell-expanded) #m3-nav-toggle {
  justify-content: center;
}

body.nm-reference-shell #m3-nav-toggle svg {
  transform: none;
  transition: transform var(--nm-slow) var(--nm-ease);
}

body.nm-reference-shell:not(.nm-shell-expanded) #m3-nav-toggle svg {
  transform: scaleX(-1);
}

/* V2.3.32 — o controle de recolhimento do rail usa o mesmo glifo do painel do
   módulo: quatro setas convergindo para recolher, divergindo para expandir. O
   ícone é montado pelo JavaScript, então o SVG original é ocultado e o glifo
   entra como máscara, herdando a cor do tema. Nenhuma marcação muda. */
body.nm-reference-shell #m3-nav-toggle svg { display: none; }
body.nm-reference-shell #m3-nav-toggle::before {
  content: "";
  display: block;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  background: currentColor;
  mask: var(--nm-icon-recolher) center / contain no-repeat;
  -webkit-mask: var(--nm-icon-recolher) center / contain no-repeat;
}
body.nm-reference-shell:not(.nm-shell-expanded) #m3-nav-toggle::before {
  mask-image: var(--nm-icon-expandir);
  -webkit-mask-image: var(--nm-icon-expandir);
}

body.nm-reference-shell #nav-rail .rail-item,
body.nm-reference-shell #nav-rail #rail-admin-item > .rail-item {
  position: relative;
  display: flex;
  width: 100%;
  min-height: clamp(32px, 4.4vh, 44px);
  align-items: center;
  justify-content: flex-start;
  gap: 14px;
  margin: 0;
  padding: clamp(4px, 1vh, 11px) 12px;
  overflow: hidden;
  color: var(--nm-on-surface-var);
  background: transparent;
  border: 1.5px solid transparent;
  border-radius: var(--nm-r-full);
  font: inherit;
  font-size: 13.5px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  transition: background var(--nm-fast) var(--nm-ease),
              color var(--nm-fast) var(--nm-ease),
              border-color var(--nm-fast) var(--nm-ease);
}

/* Na referência aprovada o controle de recolhimento é somente o ícone.
   O rótulo continua no aria-label, sem ocupar espaço visual no menu. */
body.nm-reference-shell #m3-nav-toggle .m3-toggle-label { display: none !important; }

body.nm-reference-shell #nav-rail .rail-item:hover {
  color: var(--nm-on-surface);
  background: var(--nm-surface-1);
}

body.nm-reference-shell #nav-rail .rail-item.ativo {
  color: var(--nm-on-primary-container);
  background: var(--nm-primary-container);
  border-color: var(--nm-secondary);
}

body.nm-reference-shell #nav-rail .rail-item svg {
  width: 21px;
  height: 21px;
  flex: none;
  stroke-width: 1.8;
}

body.nm-reference-shell #nav-rail .rail-label,
body.nm-reference-shell #nav-rail .m3-toggle-label {
  display: inline;
  width: auto;
  min-width: 0;
  opacity: 1;
  white-space: nowrap;
  transition: opacity var(--nm-mid) var(--nm-ease), width var(--nm-slow) var(--nm-ease);
}

body.nm-reference-shell:not(.nm-shell-expanded) #nav-rail .rail-item {
  justify-content: center;
}

body.nm-reference-shell:not(.nm-shell-expanded) #nav-rail .rail-label,
body.nm-reference-shell:not(.nm-shell-expanded) #nav-rail .m3-toggle-label {
  width: 0;
  opacity: 0;
  pointer-events: none;
}

/* Cabeçalho global da referência */
#nm-global-header {
  position: fixed;
  top: 0;
  right: 0;
  left: var(--nm-shell-rail-open);
  z-index: 70;
  min-height: var(--nm-shell-header);
  color: var(--nm-on-surface);
  background: color-mix(in srgb, var(--nm-surface) 86%, transparent);
  border-bottom: 1px solid var(--nm-outline-var);
  backdrop-filter: blur(14px);
  transition: left var(--nm-slow) var(--nm-ease);
}

body.nm-reference-shell:not(.nm-shell-expanded) #nm-global-header {
  left: var(--nm-shell-rail-closed);
}

#nm-global-header[hidden] { display: none !important; }

.nm-global-header-row {
  display: flex;
  min-height: var(--nm-shell-header);
  align-items: center;
  gap: 16px;
  padding: 12px clamp(16px, 3vw, 32px);
}

.nm-global-home {
  display: flex;
  flex: none;
  align-items: center;
  gap: 10px;
  padding: 4px;
  color: var(--nm-on-surface);
  background: transparent;
  border: 0;
  cursor: pointer;
}

.nm-global-home img { display: block; width: auto; height: 34px; object-fit: contain; }
html[data-theme="dark"] .nm-global-home .nm-logo-light { display: none; }
html:not([data-theme="dark"]) .nm-global-home .nm-logo-dark { display: none; }

.nm-global-search-wrap {
  position: relative;
  flex: 1 1 180px;
  min-width: 150px;
  max-width: 560px;
}

.nm-global-search-wrap > svg {
  position: absolute;
  top: 50%;
  left: 16px;
  z-index: 1;
  color: var(--nm-on-surface-var);
  transform: translateY(-50%);
}

#nm-global-search {
  width: 100%;
  min-height: 44px;
  padding: 11px 84px 11px 44px;
  color: var(--nm-on-surface);
  background: var(--nm-surface-2);
  border: 1.5px solid transparent;
  border-radius: var(--nm-r-full);
  font: inherit;
  font-size: 13.5px;
  transition: border-color var(--nm-fast) var(--nm-ease), background var(--nm-fast) var(--nm-ease);
}

#nm-global-search:focus { background: var(--nm-surface); border-color: var(--nm-primary); }
.nm-global-search-key {
  position: absolute;
  top: 50%;
  right: 12px;
  padding: 2px 7px;
  color: var(--nm-on-surface-var);
  border: 1px solid var(--nm-outline);
  border-radius: 6px;
  font-size: 11.5px;
  pointer-events: none;
  transform: translateY(-50%);
}

.nm-global-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.nm-global-action,
.nm-global-profile {
  display: grid;
  min-width: 40px;
  height: 40px;
  place-items: center;
  color: var(--nm-on-surface-var);
  background: transparent;
  border: 1.5px solid var(--nm-outline);
  border-radius: var(--nm-r-full);
  cursor: pointer;
  transition: background var(--nm-fast) var(--nm-ease), border-color var(--nm-fast) var(--nm-ease);
}
.nm-global-action:hover,.nm-global-profile:hover { background: var(--nm-surface-2); }
.nm-global-profile {
  display: flex;
  width: auto;
  gap: 10px;
  padding: 4px 12px 4px 5px;
  color: var(--nm-on-surface);
  font: inherit;
}
.nm-global-avatar {
  display: grid;
  width: 31px;
  height: 31px;
  place-items: center;
  color: var(--nm-on-primary);
  background: var(--nm-primary);
  border-radius: 50%;
  font-size: 12px;
  font-weight: 600;
}
.nm-global-profile-copy { display: flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 500; }
.nm-global-notif { position: relative; }
.nm-global-notif .notif-badge { position: absolute; top: -4px; right: -4px; }

/* Palco compartilhado */
body.nm-reference-shell .app:not(.oculto) {
  width: auto;
  min-height: 100vh;
  margin-left: var(--nm-shell-rail-open) !important;
  padding-top: var(--nm-shell-header);
  background: var(--nm-bg);
  transition: margin-left var(--nm-slow) var(--nm-ease);
}

body.nm-reference-shell:not(.nm-shell-expanded) .app:not(.oculto) {
  margin-left: var(--nm-shell-rail-closed) !important;
}

body.nm-reference-shell.nm-shell-expanded #tela-gestores {
  margin-left: var(--nm-shell-rail-open) !important;
}

body.nm-reference-shell:not(.nm-shell-expanded) #tela-gestores {
  margin-left: var(--nm-shell-rail-closed) !important;
}

body.nm-reference-shell #tela-inicial {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  max-width: none;
  margin-left: var(--nm-shell-rail-open) !important;
  padding: calc(var(--nm-shell-header) + clamp(20px, 3vw, 40px)) clamp(16px, 3vw, 32px) 64px !important;
}

body.nm-reference-shell:not(.nm-shell-expanded) #tela-inicial,
body.nm-reference-shell:not(.nm-shell-expanded).com-rail #tela-inicial,
body.nm-reference-shell:not(.nm-shell-expanded).rail-expandido #tela-inicial {
  margin-left: var(--nm-shell-rail-closed) !important;
}

body.nm-reference-shell.nm-shell-expanded #tela-inicial,
body.nm-reference-shell.nm-shell-expanded.com-rail #tela-inicial,
body.nm-reference-shell.nm-shell-expanded.rail-expandido #tela-inicial {
  margin-left: var(--nm-shell-rail-open) !important;
}

body.nm-reference-shell #tela-inicial > * { width: min(100%, 1376px); margin-right: auto; margin-left: auto; }

body.nm-reference-shell .app:not(#tela-inicial):not(#modulo-chat):not(#modulo-cards):not(#modulo-classificador):not(#modulo-guia-nm) > .sidebar,
body.nm-reference-shell #tela-gestores .gestores-sidebar {
  display: none !important;
}

body.nm-reference-shell .app:not(#tela-inicial):not(#modulo-chat):not(#modulo-cards):not(#modulo-classificador):not(#modulo-guia-nm) {
  grid-template-columns: minmax(0, 1fr);
}

body.nm-reference-shell .app > main,
body.nm-reference-shell #tela-gestores .gestores-main {
  width: 100%;
  max-width: 1440px;
  min-width: 0;
  margin: 0 auto;
  padding: clamp(20px, 3vw, 40px) clamp(16px, 3vw, 32px) 64px;
}

body.nm-reference-shell #tela-gestores .gestores-layout { display: block; min-height: auto; }

/* Painéis internos que contêm conteúdo funcional, nunca a navegação global. */
body.nm-reference-shell #modulo-chat,
body.nm-reference-shell #modulo-cards,
body.nm-reference-shell #modulo-classificador,
body.nm-reference-shell #modulo-guia-nm {
  grid-template-columns: minmax(250px, 310px) minmax(0, 1fr);
  gap: 0;
}

body.nm-reference-shell #modulo-chat > .sidebar,
body.nm-reference-shell #modulo-cards > .sidebar,
body.nm-reference-shell #modulo-classificador > .sidebar,
body.nm-reference-shell #modulo-guia-nm > .sidebar {
  position: sticky;
  top: var(--nm-shell-header);
  display: flex;
  width: auto;
  height: calc(100vh - var(--nm-shell-header));
  padding: 22px 18px;
  color: var(--nm-on-surface);
  background: var(--nm-surface);
  border-right: 1px solid var(--nm-outline-var);
  box-shadow: none;
}

body.nm-reference-shell #modulo-chat > .sidebar .brand,
body.nm-reference-shell #modulo-cards > .sidebar .brand,
body.nm-reference-shell #modulo-classificador > .sidebar .brand,
body.nm-reference-shell #modulo-guia-nm > .sidebar .brand,
body.nm-reference-shell #modulo-chat > .sidebar nav .nav-item:first-child,
body.nm-reference-shell #modulo-cards > .sidebar nav .nav-item:first-child,
body.nm-reference-shell #modulo-classificador > .sidebar nav .nav-item:first-child,
body.nm-reference-shell #modulo-guia-nm > .sidebar nav .nav-item:first-child {
  display: none !important;
}

body.nm-reference-shell .sidebar .nav-label,
body.nm-reference-shell .sidebar .profile-label,
body.nm-reference-shell .sidebar .profile-note { color: var(--nm-on-surface-var) !important; }
body.nm-reference-shell .sidebar .nav-item {
  color: var(--nm-on-surface-var);
  background: transparent;
  border: 1.5px solid transparent;
}
body.nm-reference-shell .sidebar .nav-item:hover { color: var(--nm-on-surface); background: var(--nm-surface-1); }
body.nm-reference-shell .sidebar .nav-item.active { color: var(--nm-on-primary-container); background: var(--nm-primary-container); border-color: var(--nm-secondary); }

/* Navegação contextual extraída das antigas barras laterais. */
/* V2.3.32 — conflito de cascata. Os <main> de Pós-Vendas e *Pasquale são
   contêineres flex em coluna com altura restrita, e a pílula, como item
   flexível padrão (flex-shrink: 1), era comprimida de 50px para 10px: sobrava
   apenas a barra de rolagem dela mesma, sem nenhum botão — o "campo com
   rolagem sem função". Fixar o item resolve sem afetar os demais módulos:
   onde já havia espaço, nada muda. */
.nm-context-nav {
  display: flex;
  flex: 0 0 auto;
  flex-direction: row;
  width: fit-content;
  max-width: 100%;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0 0 24px;
  padding: 5px;
  overflow-x: auto;
  background: var(--nm-surface-2);
  border-radius: var(--nm-r-full);
}
.nm-context-nav button {
  min-height: 40px;
  padding: 9px 18px;
  color: var(--nm-on-surface);
  background: transparent;
  border: 0;
  border-radius: var(--nm-r-full);
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
  transition: background var(--nm-fast) var(--nm-ease), color var(--nm-fast) var(--nm-ease);
}
.nm-context-nav button:hover { background: color-mix(in srgb, var(--nm-surface) 72%, transparent); }
.nm-context-nav button.active { color: var(--nm-on-primary-container); background: var(--nm-primary-container); }

.nm-breadcrumb {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  margin: 0 0 24px;
  color: var(--nm-on-surface-var);
  font-size: 12.5px;
}
.nm-breadcrumb button {
  padding: 0;
  color: var(--nm-primary);
  background: transparent;
  border: 0;
  font: inherit;
  font-weight: 500;
  cursor: pointer;
}

/* Home exatamente na hierarquia da referência */
.nm-home-overview { display: flex; flex-direction: column; gap: 36px; margin-bottom: 36px; }
.nm-home-hero { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px; }
.nm-home-copy { display: flex; flex-direction: column; gap: 8px; }
.nm-home-date { color: var(--nm-secondary-text); font-size: 12.5px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
body.nm-reference-shell .inicial-header { max-width: none; margin: 0; text-align: left; }
body.nm-reference-shell .inicial-header h1 { margin: 0; font-size: clamp(28px,3.4vw,40px); font-weight: 700; line-height: 1.1; letter-spacing: -.02em; }
body.nm-reference-shell .inicial-header p { max-width: 52ch; margin: 8px 0 0; color: var(--nm-on-surface-var); font-size: 14px; }
.nm-density-control { display: flex; align-items: center; gap: 6px; padding: 5px; background: var(--nm-surface-2); border-radius: var(--nm-r-full); }
.nm-density-control button { min-height: 40px; padding: 8px 16px; color: var(--nm-on-surface-var); background: transparent; border: 0; border-radius: var(--nm-r-full); font: inherit; font-size: 12.5px; font-weight: 500; cursor: pointer; }
.nm-density-control button.active { color: var(--nm-on-surface); background: var(--nm-surface); }
.nm-home-kpis { display: grid; grid-template-columns: repeat(auto-fit,minmax(230px,1fr)); gap: 16px; }
.nm-home-kpi { display: flex; min-height: 132px; flex-direction: column; justify-content: space-between; gap: 10px; padding: 22px; color: var(--nm-on-surface); background: var(--nm-surface); border: 1px solid var(--nm-outline-var); border-radius: var(--nm-r-l); }
.nm-home-kpi.primary { color: var(--nm-on-primary); background: var(--nm-primary); }
.nm-home-kpi.secondary { color: var(--nm-on-secondary-container); background: var(--nm-secondary-container); }
.nm-home-kpi-label { font-size: 12.5px; font-weight: 500; opacity: .85; }
.nm-home-kpi-value { font-family: var(--app-display-font); font-size: 38px; font-weight: 700; line-height: 1; letter-spacing: -.03em; }
.nm-home-kpi-note { font-size: 12px; opacity: .8; }
body.nm-reference-shell .inicial-secao { border: 0; }
body.nm-reference-shell .inicial-secao-titulo { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 16px; color: var(--nm-on-surface); border: 0; font-family: var(--app-display-font); font-size: 19px; font-weight: 700; text-transform: none; letter-spacing: 0; }
.nm-home-count { color: var(--nm-on-surface-var); font-family: var(--app-font); font-size: 12.5px; font-weight: 400; }
body.nm-reference-shell .modulos-grid { grid-template-columns: repeat(auto-fill,minmax(240px,1fr)); gap: 14px; }
/* Os separadores pertenciam à Home anterior. No protótipo aprovado a grade é
   contínua; ocultá-los mantém a lógica de permissões e remove as linhas/folgas. */
body.nm-reference-shell .home-grid-sep { display: none !important; }
body.nm-reference-shell .modulo-card { min-height: 142px; align-items: flex-start; justify-content: flex-start; gap: 4px; padding: 20px; text-align: left; }
body.nm-reference-shell .modulo-card .modulo-icon { margin: 0 0 10px; }
body.nm-reference-shell .modulo-card h3 { margin: 0; font-size: 15.5px; }
body.nm-reference-shell .modulo-card .modulo-tag { display: block; font-size: 12.5px; }

/* Componentes operacionais alinhados ao protótipo */
body.nm-reference-shell .top-row { align-items: flex-end; gap: 20px; margin-bottom: 22px; }
body.nm-reference-shell .top-row h1,
body.nm-reference-shell .dashboard-header h1,
body.nm-reference-shell .class-v2-header h1,
body.nm-reference-shell .guia-nm-header h1 { font-size: clamp(26px,3vw,34px); font-weight: 700; letter-spacing: -.02em; }
body.nm-reference-shell .subtitle { max-width: 64ch; color: var(--nm-on-surface-var); }
body.nm-reference-shell .toolbar { gap: 10px; margin-bottom: 18px; }
body.nm-reference-shell .btn-primary,
body.nm-reference-shell .btn-save { min-height: 44px; padding: 12px 22px; background: var(--nm-grad) !important; border-radius: var(--nm-r-full); box-shadow: var(--nm-shadow); }
body.nm-reference-shell button[onclick*="arquivo-base"],
body.nm-reference-shell button[onclick*="arquivo-pauta"] {
  color: var(--nm-on-surface) !important;
  background: transparent !important;
  border: 1.5px solid var(--nm-outline) !important;
  box-shadow: none;
  font-family: var(--app-font);
  font-weight: 500;
}

/* Os módulos abaixo possuem áreas internas em tela cheia. Estes ajustes
   corrigem somente encaixe e rolagem, sem alterar a linguagem visual. */
body.nm-reference-shell #modulo-chat .nm-breadcrumb { display: none; }

/* Chat: a referência aprovada usa a navegação global e, no conteúdo, apenas
   a lista de conversas e a conversa ativa. A antiga barra lateral permanece
   montada para preservar presença e permissões, mas não compõe a tela. */
body.nm-reference-shell #modulo-chat {
  grid-template-columns: minmax(0, 1fr);
  height: 100vh;
  height: 100dvh;
  min-height: 0;
  overflow: hidden;
}

body.nm-reference-shell #modulo-chat > .sidebar {
  display: none !important;
}

body.nm-reference-shell #modulo-chat > .nm-chat-main {
  display: flex !important;
  height: calc(100vh - var(--nm-shell-header));
  height: calc(100dvh - var(--nm-shell-header));
  min-height: 0;
  flex-direction: column;
  gap: 24px;
  overflow: hidden !important;
  padding: clamp(20px, 3vw, 40px) clamp(16px, 3vw, 32px) clamp(20px, 3vw, 40px) !important;
}

.nm-chat-reference-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.nm-chat-reference-heading h1 {
  margin: 0;
  font-family: var(--app-display-font);
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 700;
  letter-spacing: -.02em;
}

.nm-chat-reference-heading p {
  max-width: 64ch;
  margin: 8px 0 0;
  color: var(--nm-on-surface-var);
  text-wrap: pretty;
}

.nm-chat-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.nm-chat-action {
  min-height: 40px;
  padding: 9px 18px;
  color: var(--nm-on-surface);
  background: transparent;
  border: 1.5px solid var(--nm-outline);
  border-radius: var(--nm-r-full);
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background var(--nm-fast) var(--nm-ease), color var(--nm-fast) var(--nm-ease);
}

.nm-chat-action:hover { background: var(--nm-surface-1); }

.nm-chat-reference-grid {
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
  min-height: 0;
  flex: 1 1 auto;
  overflow: hidden;
}

body.nm-reference-shell #chat-modulo-lista,
body.nm-reference-shell #chat-modulo-thread {
  width: auto !important;
  min-width: 0;
  min-height: 0;
  color: var(--nm-on-surface);
  background: var(--nm-surface) !important;
  border: 1px solid var(--nm-outline-var) !important;
  border-radius: var(--nm-r-l);
}

body.nm-reference-shell #chat-modulo-lista {
  max-width: 360px;
  overflow-y: auto;
  padding: 12px;
}

body.nm-reference-shell #chat-modulo-thread {
  overflow: hidden;
}

body.nm-reference-shell #chat-modulo-mensagens-area,
body.nm-reference-shell #chat-modulo-mensagens { min-height: 0; }

.nm-chat-list-label {
  padding: 4px 12px 10px;
  color: var(--nm-on-surface-var);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}

body.nm-reference-shell #chat-modulo-lista-itens [data-module-chat] {
  min-height: 62px;
  margin: 0 0 6px;
  padding: 12px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: var(--nm-r-m);
  transition: background var(--nm-fast) var(--nm-ease);
}

body.nm-reference-shell #chat-modulo-lista-itens [data-module-chat]:hover {
  background: var(--nm-surface-1) !important;
}

body.nm-reference-shell #chat-modulo-lista-itens [data-module-chat][aria-current="true"] {
  color: var(--nm-on-primary-container);
  background: var(--nm-primary-container) !important;
}

body.nm-reference-shell #chat-modulo-mensagens-area > div:first-child {
  padding: 14px 18px !important;
  border-color: var(--nm-outline-var) !important;
}

body.nm-reference-shell #chat-modulo-mensagens {
  padding: 20px 24px !important;
}

body.nm-reference-shell #chat-modulo-thread .chat-composer {
  gap: 8px;
  padding: 12px 16px !important;
  border-color: var(--nm-outline-var) !important;
}

body.nm-reference-shell #chat-input-modulo {
  min-height: 44px;
  color: var(--nm-on-surface);
  background: var(--nm-surface);
  border: 1.5px solid var(--nm-outline) !important;
  border-radius: var(--nm-r-full) !important;
}

body.nm-reference-shell #chat-input-modulo:focus { border-color: var(--nm-primary) !important; }

body.nm-reference-shell .nm-chat-user-picker {
  width: min(480px, calc(100vw - 32px));
  max-height: min(680px, calc(100vh - 48px));
  overflow: hidden;
}

body.nm-reference-shell .nm-chat-user-picker input[type="search"] {
  width: 100%;
}

.nm-chat-user-list {
  display: flex;
  max-height: 390px;
  flex-direction: column;
  gap: 6px;
  margin-top: 12px;
  overflow-y: auto;
}

.nm-chat-user-option {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 12px;
  padding: 12px;
  color: var(--nm-on-surface);
  background: transparent;
  border: 0;
  border-radius: var(--nm-r-m);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background var(--nm-fast) var(--nm-ease);
}

.nm-chat-user-option:hover { background: var(--nm-surface-1); }
.nm-chat-user-option:disabled { opacity: .55; cursor: wait; }

.nm-chat-user-avatar {
  display: grid;
  width: 38px;
  height: 38px;
  flex: none;
  place-items: center;
  color: var(--nm-on-primary-container);
  background: var(--nm-primary-container);
  border-radius: var(--nm-r-full);
  font-size: 12px;
  font-weight: 500;
}

.nm-chat-user-copy {
  display: flex;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  gap: 2px;
}

.nm-chat-user-copy strong {
  overflow: hidden;
  font-size: 13.5px;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nm-chat-user-copy > span {
  overflow: hidden;
  color: var(--nm-on-surface-var);
  font-size: 11.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nm-chat-user-empty {
  margin: 0;
  padding: 20px 12px;
  color: var(--nm-on-surface-var);
  font-size: 12.5px;
  text-align: center;
}
body.nm-reference-shell #modulo-guia-nm .guia-nm-sources-panel {
  min-height: 0;
  overflow: hidden;
}
body.nm-reference-shell #modulo-corretor .corretor-topbar > div:nth-child(2) { display: none; }
body.nm-reference-shell #modulo-corretor main > .nm-breadcrumb,
body.nm-reference-shell #modulo-tarefas main > .nm-breadcrumb {
  margin-top: clamp(20px, 3vw, 40px);
  margin-right: clamp(16px, 3vw, 32px);
  margin-left: clamp(16px, 3vw, 32px);
}
body.nm-reference-shell #modulo-corretor main > .nm-context-nav,
body.nm-reference-shell #modulo-tarefas main > .nm-context-nav {
  margin-right: clamp(16px, 3vw, 32px);
  margin-left: clamp(16px, 3vw, 32px);
}
body.nm-reference-shell .table-card,
body.nm-reference-shell .summary-card,
body.nm-reference-shell .legend-card,
body.nm-reference-shell .status-block,
body.nm-reference-shell .roadmap { border-radius: var(--nm-r-l); }
body.nm-reference-shell table thead { background: var(--nm-surface-1); }
body.nm-reference-shell table th { padding-top: 12px; padding-bottom: 12px; font-size: 11.5px; letter-spacing: .06em; }
body.nm-reference-shell table td { padding-top: var(--nm-row-py); padding-bottom: var(--nm-row-py); }
body.nm-reference-shell .scope-pill { background: var(--nm-surface-2); }

/* Correções funcionais de densidade e sobreposição. Os tokens, raios e
   transições continuam sendo exatamente os da referência Material 3. */
body.nm-reference-shell #nav-rail .rail-item > .notif-badge {
  top: 5px !important;
  right: 5px !important;
  left: auto !important;
  border-color: var(--nm-surface) !important;
  z-index: 2;
}

body.nm-reference-shell #modulo-classificador .class-v2-nav,
body.nm-reference-shell #modulo-classificador .class-v2-nav-empty {
  color: var(--nm-on-surface-var) !important;
}
body.nm-reference-shell #modulo-classificador .class-v2-nav:hover {
  color: var(--nm-on-surface) !important;
  background: var(--nm-surface-1) !important;
}
body.nm-reference-shell #modulo-classificador .class-v2-nav.active {
  color: var(--nm-on-primary-container) !important;
  background: var(--nm-primary-container) !important;
}
body.nm-reference-shell #modulo-classificador .class-v2-history-item {
  color: var(--nm-on-surface) !important;
}
body.nm-reference-shell #modulo-classificador .class-v2-history-item span {
  color: var(--nm-on-surface-var) !important;
}
body.nm-reference-shell #modulo-classificador .class-v2-history-item:hover,
body.nm-reference-shell #modulo-classificador .class-v2-history-item.active {
  background: var(--nm-surface-1) !important;
  border-color: var(--nm-outline-var) !important;
}

/* Piso de microtexto do DESIGN_SYSTEM_V1: texto auxiliar 11,5px e microtexto
   limitado a 10,5px, inclusive no mobile. Os pontos abaixo vinham de camadas
   anteriores com 9px a 10px. Somente o tamanho muda; cor, peso, caixa,
   espaçamento e comportamento seguem como estão. */
body.nm-reference-shell .profile-label,
body.nm-reference-shell #cad-obs-count,
body.nm-reference-shell #class-v2-db-total,
body.nm-reference-shell .trello-member-avatar {
  font-size: 10.5px;
}
body.nm-reference-shell .class-v2-counts span,
body.nm-reference-shell .class-v2-db-form > p,
body.nm-reference-shell .class-v2-db-row > div > span {
  font-size: 10.5px;
}

.card-comment-editor { position: relative; min-width: 0; }
.card-mention-suggestions {
  position: absolute;
  right: 0;
  bottom: calc(100% + 6px);
  left: 0;
  z-index: 8;
  max-height: 260px;
  padding: 6px;
  overflow-y: auto;
  color: var(--nm-on-surface);
  background: var(--nm-surface);
  border: 1px solid var(--nm-outline-var);
  border-radius: var(--nm-r-m);
  box-shadow: var(--nm-shadow-lg);
}
.card-mention-suggestions[hidden] { display: none !important; }
.card-mention-option {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  color: var(--nm-on-surface);
  background: transparent;
  border: 0;
  border-radius: var(--nm-r-s);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.card-mention-option:hover,
.card-mention-option[aria-selected="true"] { background: var(--nm-primary-container); }
.card-mention-avatar {
  display: grid;
  width: 32px;
  height: 32px;
  flex: none;
  place-items: center;
  color: var(--nm-on-primary-container);
  background: var(--nm-primary-container);
  border-radius: 50%;
  font-size: 10.5px;
  font-weight: 600;
}
.card-mention-option > span:last-child { display: flex; min-width: 0; flex-direction: column; }
.card-mention-option strong { font-size: 12.5px; font-weight: 600; }
.card-mention-option small { overflow: hidden; color: var(--nm-on-surface-var); font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }

body.nm-reference-shell #chat-janelas-container {
  right: 16px;
  bottom: 0;
  max-width: calc(100vw - var(--nm-shell-rail-closed) - 32px);
  gap: 8px;
}
body.nm-reference-shell .chat-janela {
  width: clamp(250px, calc((100vw - var(--nm-shell-rail-closed) - 64px) / 5), 352px);
  height: min(62dvh, calc(100dvh - var(--nm-shell-header) - 20px));
  color: var(--nm-on-surface);
  background: var(--nm-surface);
  border-color: var(--nm-outline-var);
  border-radius: var(--nm-r-l) var(--nm-r-l) 0 0;
  box-shadow: var(--nm-shadow-lg);
}
body.nm-reference-shell .chat-janela.minimizada {
  width: 210px;
  height: auto !important;
  min-height: 0 !important;
}
body.nm-reference-shell .chat-header {
  min-height: 52px;
  padding: 8px 10px 8px 16px;
  color: var(--nm-on-primary);
  background: var(--nm-primary);
}
body.nm-reference-shell .chat-header-title { font-size: 13px; font-weight: 600; }
body.nm-reference-shell .chat-header-btns { gap: 2px; }
body.nm-reference-shell .chat-header-btns button,
body.nm-reference-shell .chat-composer button {
  display: inline-grid;
  width: 32px;
  height: 32px;
  flex: none;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
}
body.nm-reference-shell .chat-header-btns button { color: var(--nm-on-primary); }
body.nm-reference-shell .chat-header-btns button:hover { color: var(--nm-on-primary); background: color-mix(in srgb, var(--nm-on-primary) 14%, transparent); }
body.nm-reference-shell .chat-composer { gap: 4px; padding: 9px 10px; border-color: var(--nm-outline-var); }
body.nm-reference-shell .chat-corpo-janela { min-height: 0; overflow: hidden; }
body.nm-reference-shell .chat-mensagens { min-height: 0; overflow-y: auto; }
body.nm-reference-shell .chat-composer { flex: 0 0 auto; }
body.nm-reference-shell .chat-composer button { color: var(--nm-on-surface-var); background: transparent; }
body.nm-reference-shell .chat-composer button:hover { color: var(--nm-primary); background: var(--nm-primary-container); }
body.nm-reference-shell .chat-action-icon { width: 19px; height: 19px; pointer-events: none; }
body.nm-reference-shell .chat-composer input[type="text"] {
  min-height: 40px;
  color: var(--nm-on-surface);
  background: var(--nm-surface);
  border: 1.5px solid var(--nm-outline);
}
body.nm-reference-shell .chat-composer input[type="text"]:focus { border-color: var(--nm-primary); outline: none; }
body.nm-reference-shell .chat-anexo-chip { gap: 6px; text-decoration: none; }
body.nm-reference-shell .chat-anexo-chip .chat-action-icon { width: 15px; height: 15px; }

/* Guia NM: o módulo já recebe o espaço reservado do cabeçalho global. O
   conteúdo interno deve ocupar apenas o restante da tela, mantendo a caixa de
   pergunta visível e a rolagem dentro das mensagens/fontes. */
body.nm-reference-shell #modulo-guia-nm {
  min-height: 100vh !important;
  height: 100vh !important;
  grid-template-rows: minmax(0, calc(100vh - var(--nm-shell-header)));
  align-content: start;
  overflow: hidden;
}
body.nm-reference-shell #modulo-guia-nm .guia-nm-main {
  height: 100% !important;
  min-height: 0;
  align-self: stretch;
}
body.nm-reference-shell #modulo-guia-nm .guia-nm-workspace,
body.nm-reference-shell #modulo-guia-nm .guia-nm-conversation { min-height: 0; }
body.nm-reference-shell #modulo-guia-nm .guia-nm-messages,
body.nm-reference-shell #modulo-guia-nm .guia-nm-sources-list { overflow-y: auto; }

/* Dashboards: mesmas superfícies, tipografia, raios e estados do protótipo
   aprovado. As tabelas continuam com todos os dados e passam a rolar dentro
   dos cartões, sem estourar o palco principal. */
body.nm-reference-shell #view-dashboards,
body.nm-reference-shell #pauta-view-dashboards,
body.nm-reference-shell #cad-view-dashboards,
body.nm-reference-shell #pv-view-dash {
  min-width: 0;
  flex-direction: column;
  gap: 18px;
}
body.nm-reference-shell .status-tabs {
  width: fit-content;
  padding: 5px;
  gap: 4px;
  background: var(--nm-surface-2);
  border-radius: var(--nm-r-full);
}
body.nm-reference-shell .status-tab {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  color: var(--nm-on-surface-var);
  background: transparent;
  border: 0;
  border-radius: var(--nm-r-full);
}
body.nm-reference-shell .status-tab.active {
  color: var(--nm-on-primary);
  background: var(--nm-primary);
}
body.nm-reference-shell .status-block,
body.nm-reference-shell .summary-card {
  min-width: 0;
  padding: 20px;
  overflow: hidden;
  background: var(--nm-surface);
  border: 1px solid var(--nm-outline-var);
  border-radius: var(--nm-r-l);
}
body.nm-reference-shell .status-block > h3,
body.nm-reference-shell .summary-card > h3 {
  margin: 0 0 14px;
  color: var(--nm-on-surface);
  font-size: 14px;
  font-weight: 600;
}
body.nm-reference-shell .status-block > div,
body.nm-reference-shell .summary-card > div { max-width: 100%; overflow-x: auto; }
body.nm-reference-shell .status-table {
  min-width: max-content;
  color: var(--nm-on-surface);
  background: var(--nm-surface);
  border-color: var(--nm-outline-var) !important;
}
/* V2.3.32 — o seletor abaixo (0-2-2) perdia para
   ".table-card table.status-table thead th" (0-2-3, !important) de
   m3-design-system.css, que pinta o texto com --dashboard-head-text (branco)
   para o fundo azul escuro anterior. Como aqui o fundo já é superfície clara,
   o resultado era texto branco sobre claro: 1,11:1, ilegível. O bloco de
   contraste mais abaixo corrige na especificidade necessária. */
body.nm-reference-shell .status-table th {
  color: var(--nm-on-surface-var) !important;
  background: var(--nm-surface-1) !important;
  border-color: var(--nm-outline-var) !important;
}
body.nm-reference-shell .status-table td {
  color: var(--nm-on-surface);
  background: var(--nm-surface);
  border-color: var(--nm-outline-var) !important;
}

/* Gestores: o conteúdo administrativo usa a mesma largura, cartões e
   controles do restante do sistema. Somente o encaixe é corrigido. */
body.nm-reference-shell #tela-gestores { overflow-x: hidden; }
body.nm-reference-shell #tela-gestores > .nm-context-nav,
body.nm-reference-shell #tela-gestores .gestores-main > .nm-context-nav {
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: thin;
}
body.nm-reference-shell #tela-gestores .nm-context-nav > * { flex: 0 0 auto; }
body.nm-reference-shell #tela-gestores .gestores-main { min-height: calc(100vh - var(--nm-shell-header)); }
body.nm-reference-shell #tela-gestores .g-section {
  min-width: 0;
  padding: 20px;
  overflow-x: auto;
  background: var(--nm-surface);
  border: 1px solid var(--nm-outline-var);
  border-radius: var(--nm-r-l);
}
body.nm-reference-shell #tela-gestores .g-table {
  display: table;
  width: 100%;
  min-width: 860px;
  color: var(--nm-on-surface);
  background: var(--nm-surface);
  border-color: var(--nm-outline-var);
}
body.nm-reference-shell #tela-gestores .g-table th { color: var(--nm-on-surface-var); background: var(--nm-surface-1); }
body.nm-reference-shell #tela-gestores .g-table td { color: var(--nm-on-surface); background: var(--nm-surface); }
body.nm-reference-shell #g-view-usuarios .g-add-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(240px, 1.35fr) minmax(150px, .65fr) auto;
  align-items: center;
}
body.nm-reference-shell #g-view-usuarios .g-add-row > * { min-width: 0; }

@media (max-width: 900px) {
  body.nm-reference-shell #g-view-usuarios .g-add-row { grid-template-columns: 1fr; }
}

@media (min-width: 901px) {
  body.nm-reference-shell #view-compensacoes .table-card,
  body.nm-reference-shell #view-cnpj .table-card,
  body.nm-reference-shell #pauta-view-tabela .table-card,
  body.nm-reference-shell #cad-view-tabela .table-card,
  body.nm-reference-shell #pv-view-tabela .table-card {
    flex: 0 0 auto !important;
    width: 100%;
    height: clamp(440px, 58vh, 720px) !important;
    min-height: 440px !important;
    max-height: 720px !important;
    overflow: auto !important;
    isolation: isolate;
    scrollbar-gutter: stable both-edges;
  }

  body.nm-reference-shell #pv-view-tabela {
    flex: 0 0 auto !important;
    min-height: 440px !important;
    overflow: visible !important;
  }

  body.nm-reference-shell .table-card > .table-scroll {
    height: 100% !important;
    overflow: auto !important;
  }

  body.nm-reference-shell .table-card table,
  body.nm-reference-shell .table-card .data-table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
  }

  body.nm-reference-shell .table-card table thead,
  body.nm-reference-shell .table-card .data-table thead {
    position: static !important;
    z-index: auto !important;
  }

  body.nm-reference-shell .table-card table thead th,
  body.nm-reference-shell .table-card .data-table thead th {
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
    height: 44px;
    box-sizing: border-box;
    background: var(--nm-surface-1) !important;
    box-shadow: inset 0 -1px 0 var(--nm-outline-var);
  }

  body.nm-reference-shell .table-card table tbody td,
  body.nm-reference-shell .table-card .data-table tbody td {
    position: relative;
    z-index: 0;
    background: var(--nm-surface);
  }
}

/* Pós-Vendas: a camada global de formulários usa width:100% e controles
   confortáveis por padrão. Dentro desta grade esses valores faziam cada
   filtro ocupar uma linha inteira e inflavam as células editáveis, deixando
   apenas dois registros visíveis. Mantemos a aparência aprovada e restauramos
   somente o sizing específico da toolbar e das células da planilha. */
@media (min-width: 769px) {
  body.nm-reference-shell #pv-toolbar > select {
    width: auto;
    flex: 0 1 auto;
  }

  body.nm-reference-shell #pv-view-tabela {
    min-height: 220px !important;
  }

  body.nm-reference-shell #modulo-posvendas .pv-cell-text,
  body.nm-reference-shell #modulo-posvendas .pv-cell-date {
    padding: 4px 6px;
    font-size: 11.5px;
  }
}

body.nm-reference-shell .nm-reference-summary {
  margin: 0 0 20px;
  padding: 0;
  background: transparent;
  border: 0;
}
body.nm-reference-shell .nm-reference-summary > h3 { display: none; }
body.nm-reference-shell .nm-reference-summary .summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(200px,1fr));
  gap: 14px;
}
body.nm-reference-shell .nm-reference-summary .summary-tile,
body.nm-reference-shell .nm-reference-summary .summary-item {
  min-height: 88px;
  padding: 18px 20px;
  background: var(--nm-surface-1);
  border: 0;
  border-radius: var(--nm-r-m);
}
body.nm-reference-shell .nm-reference-summary .summary-tile:nth-child(2) { background: var(--nm-err-c); }
body.nm-reference-shell .nm-reference-summary .summary-tile:nth-child(3) { background: var(--nm-ok-c); }
body.nm-reference-shell .nm-reference-summary .summary-footnote { display: none; }

/* Menus existentes ligados ao novo cabeçalho. O contêiner continua montado
   para que notificações e presença funcionem; apenas os botões antigos somem. */
body.nm-reference-shell .rail-utility-dock {
  position: fixed !important;
  inset: 0 auto auto 0 !important;
  z-index: 119;
  display: block !important;
  width: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  pointer-events: none;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
body.nm-reference-shell .rail-utility-dock > button,
body.nm-reference-shell .rail-utility-dock .rail-utility-wrapper > button { display: none !important; }
body.nm-reference-shell .rail-utility-dock .rail-utility-wrapper {
  position: static;
  display: block;
  width: 0;
  height: 0;
  pointer-events: none;
}
body.nm-reference-shell #notif-dropdown {
  position: fixed;
  top: calc(var(--nm-shell-header) + 8px);
  right: 72px;
  left: auto;
  z-index: 120;
  width: min(420px, calc(100vw - 32px));
  color: var(--nm-on-surface);
  background: var(--nm-surface);
  border: 1px solid var(--nm-outline-var);
  border-radius: var(--nm-r-l);
  box-shadow: var(--nm-shadow-lg);
  pointer-events: auto;
}
body.nm-reference-shell #presenca-menu {
  position: fixed !important;
  top: calc(var(--nm-shell-header) + 8px) !important;
  right: 16px !important;
  left: auto !important;
  z-index: 120;
  pointer-events: auto;
}

/* --------------------------------------------------------------------------
   TAREFAS V2.3.28 — listas lado a lado com a identidade Material 3 aprovada
   -------------------------------------------------------------------------- */
body.nm-reference-shell #modulo-tarefas .tarefas-main {
  display: flex;
  min-width: 0;
  min-height: 0;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  background: var(--nm-bg);
}
body.nm-reference-shell .tarefas-page-header {
  display: flex;
  flex: none;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: clamp(24px, 3vw, 38px) clamp(20px, 3vw, 36px) 18px;
}
body.nm-reference-shell .tarefas-page-header .nm-breadcrumb {
  margin: 0 0 18px;
}
body.nm-reference-shell .tarefas-page-header h1 {
  margin: 0;
  color: var(--nm-on-surface);
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -.02em;
}
body.nm-reference-shell .tarefas-page-header p {
  max-width: 62ch;
  margin: 8px 0 0;
  color: var(--nm-on-surface-var);
  font-size: 13.5px;
  line-height: 1.5;
}
body.nm-reference-shell .tarefas-nova-lista { flex: none; }
body.nm-reference-shell .tarefas-filtros {
  flex: none;
  align-self: flex-start;
  margin: 0 clamp(20px, 3vw, 36px) 18px;
}
body.nm-reference-shell .tarefas-board {
  display: grid;
  min-width: 0;
  min-height: 0;
  flex: 1;
  grid-auto-flow: column;
  grid-auto-columns: minmax(304px, 360px);
  align-items: start;
  gap: 14px;
  padding: 0 clamp(20px, 3vw, 36px) 34px;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
body.nm-reference-shell .tarefas-lista-card {
  position: relative;
  display: flex;
  max-height: 100%;
  min-height: 220px;
  flex-direction: column;
  padding: 16px;
  overflow: auto;
  color: var(--nm-on-surface);
  background: var(--nm-surface);
  border: 1px solid var(--nm-outline-var);
  border-radius: var(--nm-r-l);
  box-shadow: var(--nm-shadow);
}
body.nm-reference-shell .tarefas-lista-header {
  position: relative;
  z-index: 2;
  display: flex;
  min-height: 40px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
body.nm-reference-shell .tarefas-lista-header h2 {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  color: var(--nm-on-surface);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -.01em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.nm-reference-shell .tarefas-lista-menu { position: relative; flex: none; }
body.nm-reference-shell .tarefas-lista-menu > summary {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  color: var(--nm-on-surface-var);
  border-radius: 50%;
  cursor: pointer;
  list-style: none;
  transition: color var(--nm-fast) var(--nm-ease), background var(--nm-fast) var(--nm-ease);
}
body.nm-reference-shell .tarefas-lista-menu > summary::-webkit-details-marker { display: none; }
body.nm-reference-shell .tarefas-lista-menu > summary:hover,
body.nm-reference-shell .tarefas-lista-menu[open] > summary {
  color: var(--nm-primary);
  background: var(--nm-primary-container);
}
body.nm-reference-shell .tarefas-lista-menu > div {
  position: absolute;
  top: 42px;
  right: 0;
  z-index: 5;
  display: grid;
  width: 168px;
  padding: 6px;
  background: var(--nm-surface);
  border: 1px solid var(--nm-outline-var);
  border-radius: var(--nm-r-m);
  box-shadow: var(--nm-shadow-lg);
}
body.nm-reference-shell .tarefas-lista-menu > div button {
  min-height: 40px;
  padding: 8px 10px;
  color: var(--nm-on-surface);
  background: transparent;
  border: 0;
  border-radius: var(--nm-r-s);
  font: inherit;
  font-size: 12.5px;
  text-align: left;
  cursor: pointer;
}
body.nm-reference-shell .tarefas-lista-menu > div button:hover { background: var(--nm-surface-2); }
body.nm-reference-shell .tarefas-lista-menu > div button.perigo { color: var(--nm-err); }
body.nm-reference-shell .tarefas-adicionar {
  display: flex;
  min-height: 44px;
  align-items: center;
  gap: 10px;
  margin: 3px 0 6px;
  padding: 8px 4px;
  color: var(--nm-primary);
  background: transparent;
  border: 0;
  border-radius: var(--nm-r-s);
  font: inherit;
  font-size: 13.5px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  transition: color var(--nm-fast) var(--nm-ease), background var(--nm-fast) var(--nm-ease);
}
body.nm-reference-shell .tarefas-adicionar:hover {
  color: var(--nm-on-primary-container);
  background: var(--nm-primary-container);
}
body.nm-reference-shell .tarefas-pendentes { display: grid; gap: 2px; }
body.nm-reference-shell .tarefa-board-item {
  position: relative;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: start;
  gap: 8px;
  padding: 9px 4px;
  border-radius: var(--nm-r-s);
  transition: background var(--nm-fast) var(--nm-ease);
}
body.nm-reference-shell .tarefa-board-item:hover,
body.nm-reference-shell .tarefa-board-item:focus-within { background: var(--nm-surface-1); }
body.nm-reference-shell .tarefa-board-check {
  appearance: none;
  position: relative;
  width: 20px;
  height: 20px;
  margin: 1px 0 0;
  flex: none;
  background: transparent;
  border: 2px solid var(--nm-outline);
  border-radius: 50%;
  cursor: pointer;
}
body.nm-reference-shell .tarefa-board-check::after {
  position: absolute;
  top: 2px;
  left: 5px;
  width: 5px;
  height: 9px;
  border-right: 2px solid var(--nm-on-primary);
  border-bottom: 2px solid var(--nm-on-primary);
  content: '';
  opacity: 0;
  transform: rotate(45deg);
}
body.nm-reference-shell .tarefa-board-check:checked {
  background: var(--nm-primary);
  border-color: var(--nm-primary);
}
body.nm-reference-shell .tarefa-board-check:checked::after { opacity: 1; }
body.nm-reference-shell .tarefa-board-conteudo {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  padding: 0;
  color: inherit;
  background: transparent;
  border: 0;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
body.nm-reference-shell .tarefa-board-nome {
  width: 100%;
  overflow-wrap: anywhere;
  color: var(--nm-on-surface);
  font-size: 13.5px;
  /* M3 list item: o nome da tarefa é texto corrido, não ênfase. */
  font-weight: 400;
  line-height: 1.42;
}
body.nm-reference-shell .tarefa-board-detalhe {
  display: -webkit-box;
  overflow: hidden;
  color: var(--nm-on-surface-var);
  font-size: 12px;
  line-height: 1.42;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
body.nm-reference-shell .tarefa-board-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 3px;
}
body.nm-reference-shell .tarefa-prazo,
body.nm-reference-shell .tarefa-recorrencia {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  padding: 3px 8px;
  color: var(--nm-on-surface-var);
  background: var(--nm-surface-2);
  border-radius: var(--nm-r-full);
  font-size: 10.5px;
  font-weight: 500;
  white-space: nowrap;
}
body.nm-reference-shell .tarefa-prazo.vencido {
  color: var(--nm-err);
  background: var(--nm-err-c);
}
body.nm-reference-shell .tarefa-board-acoes {
  display: flex;
  gap: 2px;
  opacity: 0;
  transition: opacity var(--nm-fast) var(--nm-ease);
}
body.nm-reference-shell .tarefa-board-item:hover .tarefa-board-acoes,
body.nm-reference-shell .tarefa-board-item:focus-within .tarefa-board-acoes { opacity: 1; }
body.nm-reference-shell .tarefa-board-acoes button {
  display: grid;
  width: 32px;
  height: 32px;
  padding: 0;
  place-items: center;
  color: var(--nm-on-surface-var);
  background: transparent;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
}
body.nm-reference-shell .tarefa-board-acoes button:hover { color: var(--nm-primary); background: var(--nm-primary-container); }
body.nm-reference-shell .tarefa-board-acoes button.perigo:hover { color: var(--nm-err); background: var(--nm-err-c); }
body.nm-reference-shell .tarefa-board-item.concluida .tarefa-board-nome {
  color: var(--nm-on-surface-var);
  text-decoration: line-through;
}
body.nm-reference-shell .tarefas-concluidas { margin-top: auto; padding-top: 10px; }
body.nm-reference-shell .tarefas-concluidas > summary {
  min-height: 40px;
  padding: 10px 6px;
  color: var(--nm-primary);
  border-radius: var(--nm-r-s);
  font-size: 12.5px;
  font-weight: 500;
  cursor: pointer;
  list-style-position: inside;
}
body.nm-reference-shell .tarefas-concluidas > summary:hover { background: var(--nm-primary-container); }
body.nm-reference-shell .tarefas-concluidas > div { display: grid; gap: 2px; padding-top: 4px; }
body.nm-reference-shell .tarefas-empty {
  display: grid;
  min-height: 154px;
  place-items: center;
  align-content: center;
  gap: 7px;
  padding: 18px 10px;
  color: var(--nm-on-surface-var);
  text-align: center;
}
body.nm-reference-shell .tarefas-empty.compacta { min-height: 92px; }
body.nm-reference-shell .tarefas-empty strong { color: var(--nm-on-surface); font-size: 13.5px; }
body.nm-reference-shell .tarefas-empty span { font-size: 12px; }
body.nm-reference-shell .tarefas-lista-modal { width: min(420px, calc(100vw - 32px)); }
body.nm-reference-shell .tarefas-lista-modal label {
  display: block;
  margin-bottom: 7px;
  color: var(--nm-on-surface-var);
  font-size: 12px;
  font-weight: 500;
}
body.nm-reference-shell .tarefas-lista-modal input {
  width: 100%;
  min-height: 44px;
  box-sizing: border-box;
  padding: 10px 12px;
  color: var(--nm-on-surface);
  background: var(--nm-surface);
  border: 1px solid var(--nm-outline);
  border-radius: var(--nm-r-s);
  font: inherit;
  font-size: 13.5px;
}

@media (max-width: 900px) {
  body.nm-reference-shell #nav-rail { display: none !important; }
  body.nm-reference-shell #nm-global-header { left: 0; }
  body.nm-reference-shell .app:not(.oculto),
  body.nm-reference-shell:not(.nm-shell-expanded) .app:not(.oculto),
  body.nm-reference-shell.nm-shell-expanded #tela-gestores,
  body.nm-reference-shell:not(.nm-shell-expanded) #tela-gestores {
    margin-left: 0 !important;
    padding-bottom: 82px;
  }
  body.nm-reference-shell #tela-inicial,
  body.nm-reference-shell.com-rail #tela-inicial,
  body.nm-reference-shell.rail-expandido #tela-inicial {
    margin-left: 0 !important;
  }
  .nm-global-home { display: none; }
  .nm-global-profile-copy { display: none; }
  .nm-global-profile { padding-right: 5px; }
  body.nm-reference-shell #modulo-chat,
  body.nm-reference-shell #modulo-cards,
  body.nm-reference-shell #modulo-classificador,
  body.nm-reference-shell #modulo-guia-nm { grid-template-columns: minmax(0,1fr); }
  body.nm-reference-shell #modulo-chat > .sidebar,
  body.nm-reference-shell #modulo-cards > .sidebar,
  body.nm-reference-shell #modulo-classificador > .sidebar,
  body.nm-reference-shell #modulo-guia-nm > .sidebar { position: static; width: 100%; height: auto; max-height: 42vh; border-right: 0; border-bottom: 1px solid var(--nm-outline-var); }

  body.nm-reference-shell #modulo-chat > .sidebar { display: none !important; }
  .nm-chat-reference-grid { grid-template-columns: minmax(0, 1fr); }
  body.nm-reference-shell #chat-modulo-lista { width: 100% !important; max-width: none; max-height: 300px; }
  body.nm-reference-shell #modulo-tarefas { grid-template-columns: minmax(0, 1fr); }
  body.nm-reference-shell #modulo-tarefas > .sidebar { display: none; }
  body.nm-reference-shell .tarefas-board { grid-auto-columns: minmax(286px, min(360px, calc(100vw - 40px))); }
}

@media (max-width: 620px) {
  :root { --nm-shell-header: 64px; }
  .nm-global-header-row { gap: 8px; padding: 10px 12px; }
  .nm-global-search-key { display: none; }
  #nm-global-search { padding-right: 16px; }
  .nm-global-action { min-width: 38px; height: 38px; }
  .nm-global-profile { min-width: 38px; height: 38px; }
  .nm-global-avatar { width: 29px; height: 29px; }
  .nm-home-overview { gap: 24px; margin-bottom: 28px; }
  .nm-home-hero { align-items: flex-start; }
  .nm-density-control { width: 100%; overflow-x: auto; }
  .nm-home-kpis { grid-template-columns: 1fr 1fr; gap: 10px; }
  .nm-home-kpi { min-height: 116px; padding: 16px; }
  .nm-home-kpi-value { font-size: 30px; }
  body.nm-reference-shell .modulos-grid { grid-template-columns: 1fr; }
  .nm-context-nav { width: 100%; flex-wrap: nowrap; border-radius: var(--nm-r-m); }
  body.nm-reference-shell .tarefas-page-header { align-items: stretch; flex-direction: column; gap: 16px; }
  body.nm-reference-shell .tarefas-nova-lista { align-self: flex-start; }
  body.nm-reference-shell .tarefas-filtros { max-width: calc(100vw - 40px); overflow-x: auto; }
  body.nm-reference-shell .tarefas-board { grid-auto-columns: calc(100vw - 40px); padding-right: 20px; padding-left: 20px; }
  body.nm-reference-shell .tarefa-board-acoes { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  body.nm-reference-shell *, body.nm-reference-shell *::before, body.nm-reference-shell *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}

/* ==========================================================================
   V2.3.32 — correções de contraste, navegação, densidade e estados
   ==========================================================================
   Rodada exclusivamente visual sobre a base funcional 96c6f58. Todos os
   seletores abaixo são visuais: nenhum ID, data-*, name, handler ou seletor
   consumido pelo JavaScript é alterado. Onde a correção exigiu !important, o
   motivo é sempre um !important pré-existente em camada que este ciclo não
   pode refatorar (ver PLANO_CONSOLIDACAO_CSS.md), e está documentado no ponto.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. CONTRASTE — cabeçalho dos dashboards
   --------------------------------------------------------------------------
   Conflito: m3-design-system.css fixa
     .table-card table.status-table thead th { color: var(--dashboard-head-text)
     !important; background: var(--dashboard-head) !important }
   (0-2-3) para o cabeçalho azul escuro anterior. A camada aprovada já havia
   trocado o fundo por superfície clara em 0-2-2, que PERDE a disputa de
   especificidade — o texto continuava branco sobre claro: 1,11:1 medido.
   Ajuste: mesmas duas propriedades em 0-3-4, seguindo o fundo claro que o
   protótipo já definia. Seguro porque só cor e fundo mudam, no par que o
   próprio protótipo especifica, e o valor verificado por
   ux-regression-smoke.mjs (background: var(--nm-surface-1) !important em
   .status-table th) permanece no arquivo, intacto. */
body.nm-reference-shell .table-card table.status-table thead th,
body.nm-reference-shell .table-card table.status-table thead tr th {
  color: var(--nm-on-surface-var) !important;
  background: var(--nm-surface-1) !important;
}
body.nm-reference-shell table.status-table td.row-label { color: var(--nm-on-surface); }
/* A coluna de total é referência de leitura: ganha superfície própria em vez
   de peso tipográfico, que era o recurso da camada anterior. */
body.nm-reference-shell table.status-table td.total-col {
  color: var(--nm-on-surface);
  background: var(--nm-surface-1);
  font-weight: 500;
}

/* --------------------------------------------------------------------------
   2. NAVEGAÇÃO — painel lateral recolhível
   --------------------------------------------------------------------------
   Conflito: o recolhimento vive em styles.css, em
     .app.module-sidebar-collapsed { grid-template-columns:
       var(--module-sidebar-collapsed-width) minmax(0,1fr) }
   (0-2-0). A largura das colunas destes quatro módulos é fixada acima por
   seletor de id (1-1-1), que prevalecia: ao clicar, o conteúdo do painel
   sumia (a regra de opacidade tem especificidade suficiente) mas a coluna
   continuava com 250–310px — exatamente o sintoma relatado.
   Ajuste: as mesmas regras já previstas em styles.css, repetidas na
   especificidade necessária. Seguro porque o comportamento, a classe, a chave
   de armazenamento, o botão e o JavaScript são os que já existem — nada é
   introduzido, apenas deixa de ser sobrescrito. */
body.nm-reference-shell #modulo-chat.module-sidebar-collapsed,
body.nm-reference-shell #modulo-cards.module-sidebar-collapsed,
body.nm-reference-shell #modulo-classificador.module-sidebar-collapsed,
body.nm-reference-shell #modulo-guia-nm.module-sidebar-collapsed {
  grid-template-columns: var(--module-sidebar-collapsed-width) minmax(0, 1fr);
}
body.nm-reference-shell #modulo-chat.module-sidebar-collapsed > .sidebar,
body.nm-reference-shell #modulo-cards.module-sidebar-collapsed > .sidebar,
body.nm-reference-shell #modulo-classificador.module-sidebar-collapsed > .sidebar,
body.nm-reference-shell #modulo-guia-nm.module-sidebar-collapsed > .sidebar {
  /* A largura vai na própria barra, não só na grade: o Classificador é
     contêiner flex, onde grid-template-columns não tem efeito. Em grade as
     duas declarações concordam. */
  box-sizing: border-box;
  flex: 0 0 var(--module-sidebar-collapsed-width);
  width: var(--module-sidebar-collapsed-width);
  min-width: 0;
  align-items: center;
  padding: 14px 6px;
  gap: 0;
  overflow: hidden;
}
/* O botão de recolher foi desenhado para a barra lateral escura anterior
   (fundo e borda em branco translúcido) e ficava praticamente invisível sobre
   a superfície clara deste shell: era um controle que o usuário não achava. */
body.nm-reference-shell .app > .sidebar > .module-sidebar-toggle,
body.nm-reference-shell .app.module-sidebar-collapsed > .sidebar .module-sidebar-toggle {
  width: 28px;
  height: 28px;
  color: var(--nm-on-surface-var);
  background: var(--nm-surface-2);
  border: 1px solid var(--nm-outline-var);
  border-radius: var(--nm-r-full);
  transition: background var(--nm-fast) var(--nm-ease), color var(--nm-fast) var(--nm-ease);
}
body.nm-reference-shell .app > .sidebar > .module-sidebar-toggle:hover,
body.nm-reference-shell .app.module-sidebar-collapsed > .sidebar .module-sidebar-toggle:hover {
  color: var(--nm-on-surface);
  background: var(--nm-surface-1);
}
/* V2.3.32 — ícone do controle de recolhimento do painel, conforme a referência
   entregue: quatro setas convergindo para o centro. O botão é montado pelo
   JavaScript como um <span> vazio e desenhado por CSS, então a troca é
   puramente visual: o glifo entra como máscara e herda a cor do tema. No
   estado recolhido as setas apontam para fora, indicando a ação de expandir. */
body.nm-reference-shell .app > .sidebar > .module-sidebar-toggle > span,
body.nm-reference-shell .app.module-sidebar-collapsed > .sidebar .module-sidebar-toggle > span {
  display: block;
  flex: 0 0 auto;
  width: 16px;
  min-width: 16px;
  height: 16px;
  background: currentColor;
  border: 0;
  transform: none;
  mask: var(--nm-icon-recolher) center / contain no-repeat;
  -webkit-mask: var(--nm-icon-recolher) center / contain no-repeat;
}
body.nm-reference-shell .app.module-sidebar-collapsed > .sidebar .module-sidebar-toggle > span {
  mask-image: var(--nm-icon-expandir);
  -webkit-mask-image: var(--nm-icon-expandir);
}

/* --------------------------------------------------------------------------
   3. NAVEGAÇÃO — pílula contextual sem itens (*Pasquale)
   --------------------------------------------------------------------------
   *Pasquale passou a ter fluxo único e todas as fontes da navegação ficam
   ocultas. Sobrava a pílula vazia, tendo a própria barra de rolagem como único
   conteúdo visível. Sem item visível, a pílula não é desenhada. Se o módulo
   voltar a ter mais de um fluxo, ela reaparece sozinha. */
.nm-context-nav:not(:has(button:not([hidden]))) { display: none; }

/* --------------------------------------------------------------------------
   4. NAVEGAÇÃO — orientação: onde estou
   --------------------------------------------------------------------------
   O item ativo do rail e da navegação contextual diferia do inativo apenas por
   fundo tonal. Um indicador de forma torna a posição legível sem depender de
   percepção de cor — e atende quem usa o sistema em monitor de baixo contraste. */
body.nm-reference-shell #nav-rail .rail-item.active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 3px;
  height: 22px;
  background: var(--nm-secondary);
  border-radius: 0 var(--nm-r-full) var(--nm-r-full) 0;
  transform: translateY(-50%);
}
body.nm-reference-shell #nav-rail .rail-item { position: relative; }
body.nm-reference-shell .nm-breadcrumb { color: var(--nm-on-surface-var); }
body.nm-reference-shell .nm-breadcrumb strong,
body.nm-reference-shell .nm-breadcrumb b { color: var(--nm-on-surface); font-weight: 500; }

/* --------------------------------------------------------------------------
   5. TABELAS — densidade, zebra e leitura de linha
   --------------------------------------------------------------------------
   As planilhas são a tela onde a equipe passa o dia. A linha alternada e o
   realce de linha sob o cursor reduzem o erro de leitura horizontal sem
   alterar altura de linha, cabeçalho fixo, alturas protegidas por teste nem
   qualquer comportamento de seleção. */
body.nm-reference-shell .table-card tbody tr:nth-child(even) > td {
  background: color-mix(in oklch, var(--nm-surface-1) 55%, transparent);
}
body.nm-reference-shell .table-card tbody tr:hover > td {
  background: color-mix(in oklch, var(--nm-secondary-container) 34%, transparent);
}
body.nm-reference-shell .table-card tbody tr:focus-within > td {
  background: color-mix(in oklch, var(--nm-secondary-container) 46%, transparent);
}
/* O cabeçalho fixo precisa de um limite visível quando o corpo rola por baixo. */
body.nm-reference-shell .table-card thead th { box-shadow: inset 0 -1px 0 var(--nm-outline-var); }
body.nm-reference-shell table.status-table tbody tr:hover > td {
  background: color-mix(in oklch, var(--nm-secondary-container) 30%, transparent);
}
/* Números alinhados à direita leem-se em coluna; hoje herdavam o alinhamento
   do texto em parte dos dashboards. */
body.nm-reference-shell table.status-table td .metric-abs,
body.nm-reference-shell table.status-table td .metric-pct { font-variant-numeric: tabular-nums; }

/* --------------------------------------------------------------------------
   6. TIPOGRAFIA — escala de peso do Material 3
   --------------------------------------------------------------------------
     700  título de página (headline emphasized)
     600  título de seção, rótulo micro em caixa alta, iniciais de avatar
     500  rótulo de interface, botão, aba, chip, cabeçalho de tabela
     400  texto corrido, células e valores de tabela
   As camadas anteriores usavam 700 em cabeçalho de tabela, rótulo de célula,
   badge, métrica e botão primário, o que deixava telas inteiras em negrito e
   anulava a hierarquia. Aqui só o peso muda. */
body.nm-reference-shell th,
body.nm-reference-shell .data-table thead th,
body.nm-reference-shell .g-table thead th,
body.nm-reference-shell .class-result-table thead th { font-weight: 500; }
/* Mesmo conflito do item 1: m3-design-system.css fixa
   ".status-table th { font-weight: 700 !important }". Sem a mesma prioridade o
   cabeçalho dos dashboards continuaria sozinho em negrito no sistema. */
body.nm-reference-shell table.status-table th,
body.nm-reference-shell table.status-table td.row-label { font-weight: 500 !important; }
body.nm-reference-shell .badge,
body.nm-reference-shell .pv-rcc-sim,
body.nm-reference-shell .scope-pill,
body.nm-reference-shell .btn-primary,
body.nm-reference-shell .btn-save { font-weight: 500; }
body.nm-reference-shell main h3,
body.nm-reference-shell .summary-card h3,
body.nm-reference-shell .status-block h3,
body.nm-reference-shell .card-modal-main h4 { font-weight: 600; }
body.nm-reference-shell .sidebar .nav-item { font-weight: 500; }
body.nm-reference-shell .sidebar .nav-label,
body.nm-reference-shell .nm-global-avatar,
body.nm-reference-shell .trello-member-avatar { font-weight: 600; }

/* --------------------------------------------------------------------------
   7. ESTADOS — hover, foco e seleção
   --------------------------------------------------------------------------
   Estados existiam apenas em parte dos controles. Todos usam os tempos e a
   curva já definidos no tema (120/200ms), e afetam somente cor, borda e
   sombra: nenhuma animação nova, nenhum deslocamento de layout. */
body.nm-reference-shell .modulo-card,
body.nm-reference-shell .summary-card,
body.nm-reference-shell .table-card {
  transition: border-color var(--nm-fast) var(--nm-ease), box-shadow var(--nm-mid) var(--nm-ease);
}
/* --nm-shadow é a sombra de cartão da escala do tema; --nm-shadow-lg é de modal.
   No estado normal o cartão de módulo não tem sombra, então o hover eleva de
   none para a sombra base. */
body.nm-reference-shell .modulo-card:hover { border-color: var(--nm-primary); box-shadow: var(--nm-shadow); }
body.nm-reference-shell .modulo-card:focus-within { border-color: var(--nm-primary); }
body.nm-reference-shell .nm-context-nav button:hover:not(.active) { background: var(--nm-surface); }
body.nm-reference-shell .status-tab:hover:not(.active) { color: var(--nm-on-surface); background: var(--nm-surface-1); }
/* Linha selecionada: hoje dependia só de um leve tom de fundo. */
body.nm-reference-shell tbody tr.selecionada > td,
body.nm-reference-shell tbody tr.selected > td {
  background: color-mix(in oklch, var(--nm-secondary-container) 62%, transparent);
  box-shadow: inset 3px 0 0 var(--nm-secondary);
}

/* --------------------------------------------------------------------------
   8. FORMULÁRIOS — uma só caixa em todos os módulos
   --------------------------------------------------------------------------
   As barras de ferramentas traziam 34px de altura, raio de 7–8px e corpo de
   12px, contra os 40px, raio de campo e 13px do restante do sistema. */
body.nm-reference-shell .toolbar input[type="text"],
body.nm-reference-shell .toolbar input[type="search"],
body.nm-reference-shell .toolbar input[type="date"],
body.nm-reference-shell .toolbar input:not([type]),
body.nm-reference-shell .toolbar select {
  min-height: 40px;
  border-radius: var(--nm-r-s);
  font-family: var(--app-font);
  font-size: 13px;
}
body.nm-reference-shell .toolbar button {
  min-height: 40px;
  font-family: var(--app-font);
  font-size: 13px;
  font-weight: 500;
}
/* Estado de foco do campo: a borda sozinha não sinalizava o alvo ativo. */
body.nm-reference-shell input:focus-visible,
body.nm-reference-shell select:focus-visible,
body.nm-reference-shell textarea:focus-visible { border-color: var(--nm-primary); }
/* Campo obrigatório inválido: sinal de cor acompanhado de borda, nunca só cor. */
body.nm-reference-shell input:not(:placeholder-shown):invalid,
body.nm-reference-shell textarea:not(:placeholder-shown):invalid {
  border-color: var(--nm-err);
  background: color-mix(in oklch, var(--nm-err-c) 22%, transparent);
}

/* --------------------------------------------------------------------------
   9. ESTADOS VAZIOS
   --------------------------------------------------------------------------
   Os vazios existentes são texto solto no meio da área. Centralizar e dar
   respiro os distingue de "conteúdo que falhou a carregar". */
body.nm-reference-shell .notif-vazia,
body.nm-reference-shell .presenca-vazio,
body.nm-reference-shell .class-v2-empty,
body.nm-reference-shell .class-v2-nav-empty {
  display: grid;
  place-items: center;
  gap: 6px;
  padding: 40px 24px;
  color: var(--nm-on-surface-var);
  text-align: center;
  text-wrap: pretty;
}

/* --------------------------------------------------------------------------
   10. TECLADO E LEITURA
   -------------------------------------------------------------------------- */
/* O foco dentro de área rolável precisa de folga para não encostar na borda. */
body.nm-reference-shell .table-card > .table-scroll,
body.nm-reference-shell .chat-lista-itens,
body.nm-reference-shell .chat-modulo-lista-itens { scroll-padding: 48px 0; }
@media (prefers-reduced-motion: reduce) {
  body.nm-reference-shell *,
  body.nm-reference-shell *::before,
  body.nm-reference-shell *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* --------------------------------------------------------------------------
   11. CELULAR
   -------------------------------------------------------------------------- */
@media (max-width: 620px) {
  /* Alvos de toque em 44px, mínimo recomendado, sem alterar tipografia. */
  body.nm-reference-shell .nm-context-nav button,
  body.nm-reference-shell .status-tab,
  body.nm-reference-shell .toolbar button,
  body.nm-reference-shell .toolbar select,
  body.nm-reference-shell .toolbar input { min-height: 44px; }
  /* O painel lateral recolhido não deve comer a área útil no celular. */
  body.nm-reference-shell .app.module-sidebar-collapsed { grid-template-columns: minmax(0,1fr); }
  body.nm-reference-shell .app.module-sidebar-collapsed > .sidebar { display: none; }
}

/* --------------------------------------------------------------------------
   12. CORES FORA DA PALETA — métricas dos dashboards
   --------------------------------------------------------------------------
   styles.css fixa ".metric-pct { color:#F31212 }" e pesos 700 em
   ".metric-pct" e "td.total-col .metric-abs". O vermelho é literal, não vem de
   token: no tema escuro ficava saturado sobre superfície escura e, no claro,
   destoava da paleta aprovada (#002060 / #00B0F0 / status). Passa a usar o
   token de erro, que já é calibrado nos dois temas, e o peso entra na escala.
   Somente cor e peso mudam; o valor, o alinhamento e a posição seguem iguais. */
body.nm-reference-shell .metric-pct {
  color: var(--nm-err);
  font-weight: 500;
}
body.nm-reference-shell table.status-table td.total-col .metric-abs { font-weight: 600; }
/* Percentual positivo e negativo não podem depender só da cor. */
body.nm-reference-shell .metric-pct { font-variant-numeric: tabular-nums; }

/* ==========================================================================
   V2.3.32 — correções autorizadas da auditoria visual
   ========================================================================== */

/* --------------------------------------------------------------------------
   13. CONTRASTE DO BADGE DE PRIORIDADE NO TEMA ESCURO
   --------------------------------------------------------------------------
   Problema medido: 1,57:1 no P1 e 1,60:1 no P2, no tema escuro. O badge é
   montado pelo JavaScript com estilo embutido
     color: var(--pN); background: color-mix(in srgb, var(--pN) 15%, white)
   e o "white" é literal: no tema escuro o fundo continua branco enquanto
   var(--pN) passa a ser o tom claro, invertendo a relação.
   Correção: a mistura passa a usar a superfície do tema em vez de branco, e o
   tom vem de currentColor — que é exatamente o var(--pN) já aplicado pelo
   estilo embutido. Assim vale para as cinco prioridades sem enumerá-las e sem
   tocar no JavaScript.
   O !important é necessário porque a declaração concorrente é inline; o
   seletor é restrito a quem tem color-mix embutido, para não alcançar badge
   nenhum que já seja pintado por folha de estilo. No tema claro o resultado é
   idêntico ao atual, porque --nm-surface é #FFFFFF. */
body.nm-reference-shell .badge[style*="color-mix"] {
  background: color-mix(in srgb, currentColor 15%, var(--nm-surface)) !important;
}

/* --------------------------------------------------------------------------
   14. ÁREA CLICÁVEL DO BREADCRUMB
   --------------------------------------------------------------------------
   Medido: 31 × 18px no item "Início", presente em todos os módulos. O mínimo
   recomendado é 40px de altura para ponteiro. Só o alvo cresce: tamanho,
   peso e cor do texto seguem iguais. */
body.nm-reference-shell .nm-breadcrumb button {
  min-height: 40px;
  padding: 0 8px;
}
@media (max-width: 620px) {
  body.nm-reference-shell .nm-breadcrumb button { min-height: 44px; }
}

/* --------------------------------------------------------------------------
   15. ALTURA UNIFORME DOS CONTROLES — 40px
   --------------------------------------------------------------------------
   O sistema usa 40px em campo, botão e aba. Estes controles divergiam por
   herança de camadas anteriores. Só a altura muda; tipografia, cor, raio e
   comportamento seguem iguais. */

/* Cards — barra superior e cabeçalho das listas (media 38, 39, 33, 24, 26px) */
body.nm-reference-shell .cards-topbar-btn,
body.nm-reference-shell .trello-lista-titulo,
body.nm-reference-shell .trello-lista-menu-btn,
body.nm-reference-shell .trello-add-card-btn,
body.nm-reference-shell .trello-add-lista-btn { min-height: 40px; }
/* O cabeçalho da lista acompanha o novo campo, sem apertar o conteúdo. */
body.nm-reference-shell .trello-lista-header { align-items: center; }

/* Classificador — campo de nome e ações (media 38 e 36px) */
body.nm-reference-shell .class-v2-list-name input,
body.nm-reference-shell .class-v2-primary,
body.nm-reference-shell .class-v2-secondary { min-height: 40px; }

/* Gestores — linha de novo usuário (media 34 e 30px) */
body.nm-reference-shell .g-add-row select,
body.nm-reference-shell .g-add-row input,
body.nm-reference-shell .g-add-row button { min-height: 40px; }

/* *Pasquale — ações do fluxo único (media 31 e 25px) */
body.nm-reference-shell .corretor-header button,
body.nm-reference-shell #btn-cor-corrigir,
body.nm-reference-shell #btn-cor-copiar { min-height: 40px; }

/* --------------------------------------------------------------------------
   16. EXCEÇÕES À REGRA DE 40px — com o motivo medido
   --------------------------------------------------------------------------
   Três controles NÃO foram elevados porque o aumento custaria área útil ou
   estouraria o contêiner, exatamente o efeito que a autorização pede para
   evitar. Ficam registrados aqui e no relatório, não corrigidos em silêncio:

   a) .tarefa-board-acoes button (32px) — ações de linha reveladas no hover,
      dentro de um item de tarefa de ~38px. A 40px cada linha cresceria 8px e
      cada coluna do quadro mostraria menos tarefas.
   b) .tarefa-board-conteudo (19px no texto curto) — é o alvo da linha inteira,
      largo: a altura pequena não reduz a área de clique, que ocupa toda a
      largura da coluna. Elevá-la somaria mais de 20px por tarefa.
   c) .module-sidebar-toggle (28px) — no estado recolhido a coluna tem 44px com
      6px de recuo: sobram 32px. Um botão de 40px transbordaria.

   Nenhuma regra é emitida aqui de propósito. */

/* --------------------------------------------------------------------------
   17. TRANSBORDO DO ITEM DE NAVEGAÇÃO DO CLASSIFICADOR NO ESTADO RECOLHIDO
   --------------------------------------------------------------------------
   Problema medido: com o painel recolhido (coluna de 44px, botão de 28px), o
   rótulo "Banco de dados" quebrava em duas linhas e vazava o próprio botão —
   scrollHeight 51px contra clientHeight 42px, com overflow visível. Com o
   painel aberto (botão de 263px) o item já estava correto: 45px de conteúdo em
   45px de caixa, uma linha, sem reticências.

   A marcação é <span aria-hidden>▦</span> seguido de um nó de texto solto, sem
   elemento próprio — o rótulo não pode ser alcançado por seletor. A solução
   zera a fonte no botão, o que oculta o nó de texto, e devolve o tamanho ao
   span do ícone; nada de JavaScript e nenhuma mudança de estrutura.

   Aberto: nowrap garante a linha única sem reticências, e o overflow segue
   visível, então nada é cortado.
   Recolhido: texto oculto, ícone centrado, overflow contido.
   Vale para os três itens do Classificador e não alcança outro módulo, por
   estar sob #modulo-classificador. */
body.nm-reference-shell #modulo-classificador .class-v2-nav {
  white-space: nowrap;
}
body.nm-reference-shell #modulo-classificador.module-sidebar-collapsed .class-v2-nav {
  box-sizing: border-box;
  width: 100%;
  justify-content: center;
  gap: 0;
  /* Recuo simétrico e estreito: zerar o recuo com font-size 0 deixava o botão
     sem largura nenhuma e o ícone escapava para fora da caixa. */
  padding-right: 4px;
  padding-left: 4px;
  overflow: hidden;
  font-size: 0;
}
body.nm-reference-shell #modulo-classificador.module-sidebar-collapsed .class-v2-nav > span[aria-hidden="true"] {
  font-size: 15px;
  line-height: 1;
}

/* --------------------------------------------------------------------------
   18. PASQUALE E CLASSIFICADOR — ARQUITETURA DOS APLICATIVOS LOVABLE
   --------------------------------------------------------------------------
   A composição reproduz a hierarquia dos aplicativos de origem, mas todos os
   valores visuais continuam ligados aos tokens Material 3 do Espaço NM. */

body.nm-reference-shell #modulo-corretor main {
  overflow-y: auto;
  background: var(--nm-bg);
}

body.nm-reference-shell #modulo-corretor .corretor-topbar {
  margin: 12px clamp(16px, 3vw, 32px) 0;
  padding: 14px 18px;
  border: 1px solid var(--nm-outline-var);
  border-bottom: 0;
  border-radius: var(--nm-r-l) var(--nm-r-l) 0 0;
  background: var(--nm-surface);
}

body.nm-reference-shell #modulo-corretor .corretor-topbar > div:nth-child(2) {
  display: flex;
}

.corretor-topbar-heading {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.corretor-topbar-heading strong {
  color: var(--nm-on-surface);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.25;
}

.corretor-topbar-heading small,
.corretor-eyebrow {
  color: var(--nm-on-surface-var);
  font-size: 11.5px;
}

.corretor-eyebrow {
  color: var(--nm-primary);
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.corretor-topbar-actions {
  align-items: center;
  gap: 8px;
  margin-left: auto;
}

body.nm-reference-shell #modulo-corretor .corretor-topbar-actions .class-v2-primary {
  border-color: var(--nm-primary);
  background: var(--nm-primary);
  color: var(--nm-on-primary);
}

body.nm-reference-shell #modulo-corretor .corretor-topbar-actions .class-v2-primary:hover {
  border-color: color-mix(in srgb, var(--nm-primary) 88%, black);
  background: color-mix(in srgb, var(--nm-primary) 88%, black);
}

body.nm-reference-shell #modulo-corretor .corretor-topbar-actions .class-v2-secondary {
  border-color: var(--nm-outline-var);
  background: var(--nm-surface);
  color: var(--nm-on-surface);
}

body.nm-reference-shell #modulo-corretor .corretor-layout {
  display: grid;
  grid-template-columns: minmax(210px, 250px) minmax(300px, 1fr) minmax(320px, 1fr);
  flex: 0 0 auto;
  height: clamp(500px, calc(100vh - 290px), 720px);
  min-height: 500px;
  margin: 0 clamp(16px, 3vw, 32px);
  overflow: hidden;
  border-right: 1px solid var(--nm-outline-var);
  border-left: 1px solid var(--nm-outline-var);
  background: var(--nm-surface);
}

.corretor-historico-painel {
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  border-right: 1px solid var(--nm-outline-var);
  background: var(--nm-surface-1);
}

.corretor-historico-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  padding: 15px 14px 10px;
  color: var(--nm-on-surface);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.corretor-historico-header small {
  color: var(--nm-on-surface-var);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

.corretor-historico-lista {
  display: flex;
  min-height: 0;
  flex: 1;
  flex-direction: column;
  gap: 4px;
  padding: 0 8px 10px;
  overflow-y: auto;
}

.corretor-historico-vazio {
  margin: 6px;
  color: var(--nm-on-surface-var);
  font-size: 11.5px;
  font-style: italic;
  line-height: 1.5;
}

.corretor-historico-item {
  display: grid;
  width: 100%;
  gap: 3px;
  padding: 10px;
  border: 1px solid transparent;
  border-radius: var(--nm-r-s);
  background: transparent;
  color: var(--nm-on-surface);
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  transition: background var(--nm-fast) var(--nm-ease), border-color var(--nm-fast) var(--nm-ease);
}

.corretor-historico-item:hover,
.corretor-historico-item:focus-visible {
  border-color: var(--nm-outline-var);
  background: var(--nm-surface);
  outline: none;
}

.corretor-historico-item span,
.corretor-historico-item small {
  color: var(--nm-on-surface-var);
  font-size: 10.5px;
}

.corretor-historico-item strong {
  overflow: hidden;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.corretor-historico-limpar {
  min-height: 40px;
  margin: 8px;
  border: 1px solid var(--nm-outline-var);
  border-radius: var(--nm-r-full);
  background: var(--nm-surface);
  color: var(--nm-on-surface-var);
  cursor: pointer;
  font-family: inherit;
  font-size: 11.5px;
  font-weight: 600;
}

body.nm-reference-shell #modulo-corretor .corretor-painel {
  min-width: 0;
  border-right-color: var(--nm-outline-var);
  background: var(--nm-surface);
}

body.nm-reference-shell #modulo-corretor .corretor-header {
  min-height: 62px;
  padding: 11px 16px;
  border-bottom-color: var(--nm-outline-var);
  background: var(--nm-surface);
}

.corretor-header > div {
  display: grid;
  gap: 2px;
}

.corretor-panel-kicker {
  color: var(--nm-on-surface-var);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

body.nm-reference-shell #modulo-corretor .corretor-header h3 {
  color: var(--nm-on-surface);
  font-size: 13.5px;
  font-weight: 650;
}

body.nm-reference-shell #modulo-corretor .corretor-textarea {
  padding: 20px;
  background: var(--nm-surface);
  color: var(--nm-on-surface);
  font-family: "Red Hat Text", Arial, sans-serif;
  font-size: 14px;
  line-height: 1.75;
}

body.nm-reference-shell #modulo-corretor .corretor-textarea:focus-visible {
  box-shadow: inset 0 0 0 2px var(--nm-primary);
}

body.nm-reference-shell #modulo-corretor .corretor-resultado {
  padding: 20px;
  background: var(--nm-surface);
  color: var(--nm-on-surface);
  font-size: 14px;
  line-height: 1.7;
}

body.nm-reference-shell #modulo-corretor .corretor-texto-final {
  padding: 16px;
  border-color: var(--nm-outline-var);
  border-radius: var(--nm-r-m);
  background: var(--nm-surface-1);
}

.corretor-copy-button {
  min-height: 36px;
  padding: 0 13px;
  border: 1px solid var(--nm-outline);
  border-radius: var(--nm-r-full);
  background: var(--nm-surface);
  color: var(--nm-primary);
  cursor: pointer;
  font-family: inherit;
  font-size: 11.5px;
  font-weight: 650;
}

.corretor-copy-button:disabled {
  opacity: .42;
  cursor: not-allowed;
}

.corretor-empty-state {
  display: flex;
  height: 100%;
  min-height: 220px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
  color: var(--nm-on-surface-var);
  text-align: center;
}

.corretor-empty-state > span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 50%;
  background: var(--nm-primary-container);
  color: var(--nm-on-primary-container);
  font-size: 20px;
}

.corretor-empty-state strong {
  color: var(--nm-on-surface);
  font-size: 13.5px;
}

.corretor-empty-state small {
  max-width: 310px;
  font-size: 11.5px;
  line-height: 1.5;
}

body.nm-reference-shell #modulo-corretor .corretor-correcoes-aplicadas {
  border-top-color: var(--nm-outline-var);
}

body.nm-reference-shell #modulo-corretor .corretor-correcao-item {
  border-bottom-color: var(--nm-outline-var);
}

.corretor-statusbar {
  margin: 0 clamp(16px, 3vw, 32px) 32px;
  padding: 9px 16px;
  border: 1px solid var(--nm-outline-var);
  border-top: 0;
  border-radius: 0 0 var(--nm-r-l) var(--nm-r-l);
  background: var(--nm-surface-1);
  color: var(--nm-on-surface-var);
  font-size: 10.5px;
  text-align: center;
}

body.nm-reference-shell #modulo-classificador {
  --class-accent: var(--nm-primary);
  --class-accent-strong: color-mix(in srgb, var(--nm-primary) 88%, black);
  --class-accent-soft: var(--nm-primary-container);
  --class-ok: var(--nm-ok);
  --class-rejected: var(--nm-err);
  --class-review: var(--nm-warn);
}

body.nm-reference-shell #modulo-classificador .class-v2-main {
  width: 100%;
  max-width: 1320px;
  margin: 0 auto;
  padding-right: clamp(16px, 3vw, 32px);
  padding-left: clamp(16px, 3vw, 32px);
}

.class-v2-history-intro {
  margin: 0 10px 10px;
  color: var(--nm-on-surface-var);
  font-size: 11.5px;
  line-height: 1.45;
}

body.nm-reference-shell #modulo-classificador .class-v2-history-item {
  margin-bottom: 7px;
  padding: 10px 11px;
  border-color: var(--nm-outline-var) !important;
  border-radius: var(--nm-r-s);
  background: var(--nm-surface);
}

body.nm-reference-shell #modulo-classificador .class-v2-history-item:hover,
body.nm-reference-shell #modulo-classificador .class-v2-history-item.active {
  border-color: var(--nm-primary) !important;
  background: var(--nm-primary-container) !important;
}

.class-v2-main-tabs {
  display: flex;
  width: fit-content;
  max-width: 100%;
  gap: 4px;
  margin: 0 0 18px;
  padding: 5px;
  overflow-x: auto;
  border-radius: var(--nm-r-full);
  background: var(--nm-surface-2);
}

body.nm-reference-shell #modulo-classificador .class-v2-main-tabs .class-v2-nav,
body.nm-reference-shell #modulo-classificador.module-sidebar-collapsed .class-v2-main-tabs .class-v2-nav {
  display: inline-flex;
  width: auto;
  min-width: max-content;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 16px;
  overflow: visible;
  border: 0;
  border-radius: var(--nm-r-full);
  background: transparent;
  color: var(--nm-on-surface-var) !important;
  cursor: pointer;
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;
}

body.nm-reference-shell #modulo-classificador .class-v2-main-tabs .class-v2-nav:hover {
  background: var(--nm-surface) !important;
  color: var(--nm-on-surface) !important;
}

body.nm-reference-shell #modulo-classificador .class-v2-main-tabs .class-v2-nav.active {
  background: var(--nm-primary) !important;
  color: var(--nm-on-primary) !important;
  box-shadow: var(--nm-shadow);
}

body.nm-reference-shell #modulo-classificador.module-sidebar-collapsed .class-v2-main-tabs .class-v2-nav > span[aria-hidden="true"] {
  width: auto;
  font-size: 15px;
}

body.nm-reference-shell #modulo-classificador .class-v2-toolbar-card,
body.nm-reference-shell #modulo-classificador .class-v2-input-card {
  align-items: flex-start;
  gap: 14px;
  padding: 18px;
  border-color: var(--nm-outline-var);
  border-radius: var(--nm-r-l);
  background: var(--nm-surface);
}

.class-v2-step-card {
  display: flex;
}

.class-v2-step-marker {
  display: grid;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  place-items: center;
  border-radius: 50%;
  background: var(--nm-primary);
  color: var(--nm-on-primary);
  font-size: 12px;
  font-weight: 750;
}

.class-v2-step-marker-small {
  width: 28px;
  height: 28px;
  flex-basis: 28px;
}

.class-v2-step-content,
.class-v2-analyze-content {
  min-width: 0;
  flex: 1;
}

.class-v2-step-heading {
  display: grid;
  gap: 2px;
  margin-bottom: 12px;
}

.class-v2-step-heading strong {
  color: var(--nm-on-surface);
  font-size: 13.5px;
  font-weight: 700;
}

.class-v2-step-heading span {
  color: var(--nm-on-surface-var);
  font-size: 11.5px;
  line-height: 1.45;
}

.class-v2-step-row {
  display: flex;
  align-items: flex-end;
  gap: 18px;
}

.class-v2-step-row .class-v2-list-name {
  flex: 1;
}

.class-v2-analyze-block {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--nm-outline-var);
}

body.nm-reference-shell #modulo-classificador .class-v2-results,
body.nm-reference-shell #modulo-classificador .class-v2-consult-form,
body.nm-reference-shell #modulo-classificador .class-v2-consult-result,
body.nm-reference-shell #modulo-classificador .class-v2-db-form,
body.nm-reference-shell #modulo-classificador .class-v2-db-browser {
  border-color: var(--nm-outline-var);
  border-radius: var(--nm-r-l);
  background: var(--nm-surface);
}

body.nm-reference-shell #modulo-classificador .class-v2-save::before {
  content: "4";
  display: inline-grid;
  width: 20px;
  height: 20px;
  margin-right: 6px;
  place-items: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--nm-on-primary) 18%, transparent);
  font-size: 10px;
}

@media (max-width: 1100px) {
  body.nm-reference-shell #modulo-corretor .corretor-layout {
    grid-template-columns: 210px minmax(260px, 1fr) minmax(280px, 1fr);
  }
}

@media (max-width: 900px) {
  body.nm-reference-shell #modulo-corretor .corretor-layout {
    grid-template-columns: 1fr 1fr;
    height: auto;
    min-height: 0;
    overflow: visible;
  }
  .corretor-historico-painel {
    grid-column: 1 / -1;
    min-height: 150px;
    max-height: 210px;
    border-right: 0;
    border-bottom: 1px solid var(--nm-outline-var);
  }
  .corretor-historico-lista {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  }
  body.nm-reference-shell #modulo-corretor .corretor-painel {
    min-height: 430px;
  }
}

@media (max-width: 700px) {
  body.nm-reference-shell #modulo-corretor .corretor-topbar {
    align-items: flex-start;
  }
  .corretor-topbar-heading small { display: none; }
  .corretor-topbar-actions { width: 100%; }
  .corretor-topbar-actions button { flex: 1; }
  body.nm-reference-shell #modulo-corretor .corretor-layout {
    grid-template-columns: 1fr;
  }
  body.nm-reference-shell #modulo-corretor .corretor-painel {
    min-height: 390px;
    border-right: 0;
    border-bottom: 1px solid var(--nm-outline-var);
  }
  .class-v2-main-tabs { width: 100%; }
  body.nm-reference-shell #modulo-classificador .class-v2-main-tabs .class-v2-nav,
  body.nm-reference-shell #modulo-classificador.module-sidebar-collapsed .class-v2-main-tabs .class-v2-nav {
    flex: 1;
    padding-right: 12px;
    padding-left: 12px;
  }
  .class-v2-step-row { display: grid; }
  .class-v2-open-list {
    min-width: 0;
    padding-top: 12px;
    padding-left: 0;
    border-top: 1px solid var(--nm-outline-var);
    border-left: 0;
  }
}
