/* Contrato compartilhado de layout: espaço operacional fluido, coleções
   intrínsecas e medida de leitura. Nenhuma regra depende de um monitor. */
:root {
  --layout-gutter: clamp(14px, 1.5vw, 40px);
  --layout-gap: clamp(10px, 1vw, 20px);
  --layout-reading: 80rem;
  --layout-card: 20rem;
}
body { overflow-wrap: anywhere; }
.view { width: 100%; max-width: none; min-width: 0; margin-inline: auto; padding-inline: var(--layout-gutter); }
/* As superfícies operacionais compartilham a largura da área principal. */
.pj, .prog, .pri, #configHost, #agendaHost,
#view-config .view-head, #view-agenda .view-head { width: 100%; max-width: none; }
/* Texto corrido e conversa têm medida limitada e ficam no centro da área útil. */
#view-assistente > *, .pj-detail, #monHost, .mon-filters, #logHost,
#view-monitor .view-head, #view-diario .view-head {
  width: 100%; max-width: var(--layout-reading); margin-inline: auto;
}
.cfg-md { margin-inline: auto; }
.stage-wrap { width: 100%; max-width: 120rem; padding-inline: var(--layout-gutter); }
.stage { max-height: 85dvh; }

/* Primitives de coleção. min(100%,…) também suporta painéis menores que um card.
   auto-fill preserva o tamanho das fotos quando há só um ou dois resultados;
   auto-fit redistribui cartões de dados, sem colunas fantasmas. */
.layout-grid, .pj-grid, .pj-code-grid, .pj-code-gap-grid, .pj-code-detail-grid,
.review-list, .desc-pessoas, .cfg-list, .cfg-saved-list, .cfg-tools-grid,
.prog-dupla, .vl-pontas {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--layout-card)), 1fr));
  gap: var(--layout-gap); align-items: start;
}
.cfg-list { --layout-card: 26rem; }
.prog-dupla, .pj-code-gap-grid { --layout-card: 28rem; }
.vl-pontas, .pj-code-detail-grid { --layout-card: 15rem; }
.grid, .skeleton-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, clamp(10rem, 16vw, 14rem)), 1fr)); }
.pri-grade { grid-template-columns: repeat(auto-fill, minmax(min(100%, 10rem), 1fr)); }
.bcu-grade { grid-template-columns: repeat(auto-fill, minmax(min(100%, 12rem), 1fr)); }
.desc-grid, .sis-sondas, .cfg-id-grid, .cfg-provider-options,
.prog-topo, .desc-stats, .cfg-account-facts, .cfg-usage-summary {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 10.5rem), 1fr));
}
.cfg-openai-body { grid-template-columns: repeat(auto-fit, minmax(min(100%, 26rem), 1fr)); }
.wc-aprovacoes .review-list { display: grid; max-width: none; }

/* Todo filho pode encolher e quebrar texto antes de empurrar a próxima coluna.
   Ícones/avatares mantêm suas dimensões; mídia nunca alarga o painel. */
:where(.view, .drawer, .pj-sheet, .dmodal, .ds-popover) :where(div, section, article, header, footer, p, h1, h2, h3, label, span, b, small, code) { min-width: 0; }
:where(img, video, canvas) { max-width: 100%; }
:where(button, summary, .badge, .chip, .btn) { overflow-wrap: anywhere; }
.view-head, .cfg-section-head, .cfg-head, .pj-head, .pri-head,
.sis-grupo-head, .wc-head, .assist-sessao, .prog-item, .cfg-saved-head { flex-wrap: wrap; }
.view-head .sub { white-space: normal; }
.badge { height: auto; min-height: 24px; max-width: 100%; white-space: normal; }
.card .badges { flex-wrap: wrap; }
.filters, .mon-chip-rail { flex-wrap: wrap; overflow: visible; }
.filters .chip { flex-shrink: 1; white-space: normal; }
.ds-select, .ds-option { white-space: normal; overflow-wrap: anywhere; }
.ds-select > span { min-width: 0; }

/* Ellipsis só funciona em bloco: em flex ela deixava nomes cortados sem sinal.
   Identidades e números são mostrados por inteiro; previews usam line-clamp. */
.wc-head-nm, .tl-nome, .pri-nm, .prog-item-nm,
.sis-sistema, .sis-site, .disp-lugar-pick {
  white-space: normal; overflow: visible; flex-wrap: wrap;
}
.prog-num b, .prog-hero-v b, .prog-lado-nums b { flex-wrap: wrap; overflow-wrap: anywhere; }
.bcu-bio { max-height: none; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.card .who .nm { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.card .last { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; white-space: normal; overflow: hidden; }
.card .meta { max-height: calc(100% - 48px); overflow-y: auto; }
.card-shell.opener .card .meta { max-height: calc(100% - 48px); }
.cal-grid, .cal-weekdays { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal-evs { max-width: 100%; }
.cal-ev { max-width: 100%; }

/* Conteúdo aberto não tem teto artificial. O botão já indica e controla o
   recolhimento; display:none também retira os controles fechados do teclado. */
.sis-linhas-caixa { max-height: none; overflow: visible; }
.sis-grupo.recolhido .sis-linhas-caixa { display: none; }

/* As regiões internas rolam, sem comprimir cabeçalho/compositor para altura zero. */
.wc-body { min-width: 0; }
.wc-thread, .assist-thread { min-width: 0; min-height: 0; }
.wc-mode-menu > * { flex-shrink: 0; }
.wc-thread > :not(.wc-msgs), .assist-shell > :not(.assist-thread) { flex-shrink: 0; }
.assist-compose { flex-wrap: wrap; }
.assist-compose textarea { min-width: min(100%, 15rem); flex: 1 1 15rem; }
.assist-msg { max-width: min(100%, 48rem); }
.bubble.wc-audio { min-width: min(210px, 100%); }
@media (min-width: 901px) {
  .wc-body { grid-template-columns: minmax(16rem, .32fr) minmax(0, 1fr); }
}
/* A leitura de duas colunas precisa de espaço útil além da navegação. */
@media (min-width: 721px) and (max-width: 1100px) {
  .agenda-workspace { grid-template-columns: minmax(0, 1fr); }
  .agenda-proposals-pane { position: static; max-height: none; }
  .agenda-conn { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
}
@media (max-width: 720px), (max-height: 480px) and (pointer: coarse) {
  .view { padding-inline: 14px; }
  .mon-chip-rail { display: flex; }
  .wc-body, .assist-shell { min-height: 16rem; }
}
@media (max-width: 380px) {
  .grid, .skeleton-grid { grid-template-columns: minmax(0, 1fr); }
}