primocode 8.37.0 → 8.38.1

package/studio/web/render.css

@@ -1157,3 +1157,83 @@
    quatro linhas — três palavras e um órfão —, e é assim que uma frase curta
    vira um bloco desengonçado no meio do quadro. */
 .el.texto.titulo, .el.texto[data-papel="titulo"] { text-wrap: balance; }
+
+/* ═══════════════════════════════════════════════════════════════════════
+   A COMPOSIÇÃO DE SLIDE (ver comporCabecaCorpo, em render.js).
+
+   Cabeça ancorada em cima, corpo centrado no que sobra — e o corpo em escala
+   de PROJETOR. Os tamanhos de antes (lista 34px, cartão 27/19, tabela 22)
+   foram calibrados para caber; num quadro de 1920 projetado numa sala eles
+   somem, e o que sobra é o vazio em volta. Só dentro desta composição: a cena
+   de vídeo com um título sozinho, e a capa, continuam como eram.
+   ═══════════════════════════════════════════════════════════════════════ */
+
+.cena .fluxo[data-composicao="cabeca-corpo"] { justify-content: flex-start; }
+.cena .fluxo[data-composicao="cabeca-corpo"] > .corpo-inicio { margin-top: auto; }
+.cena .fluxo[data-composicao="cabeca-corpo"] > .corpo-fim { margin-bottom: auto; }
+/* O título respira antes do corpo; o chapéu cola no título. */
+.cena .fluxo[data-composicao="cabeca-corpo"] > .el.txt.titulo { margin-bottom: calc(var(--u, 19px) * .4); }
+.cena .fluxo[data-composicao="cabeca-corpo"] > .el.txt.chapeu { margin-bottom: calc(var(--u, 19px) * -.9); }
+
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.lista { gap: calc(24px * var(--esc, 1)); }
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.lista .item {
+  font-size: calc(40px * var(--esc, 1));
+  line-height: 1.38;
+  padding-left: calc(50px * var(--esc, 1));
+}
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.lista .item::before { width: 14px; height: 14px; top: .56em; }
+
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.cartoes { gap: 28px; }
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.cartoes .cartao {
+  padding: 40px 42px;
+  min-height: calc(var(--alto, 1080px) * .27);
+  gap: 14px;
+  border-radius: 24px;
+}
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.cartoes .cartao b { font-size: 36px; line-height: 1.15; }
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.cartoes .cartao span { font-size: 25px; line-height: 1.45; }
+
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.numeros { gap: calc(40px * var(--esc, 1)); }
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.numeros .num { gap: 14px; }
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.numeros .num b { font-size: var(--tam-num, calc(140px * var(--esc, 1))); }
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.numeros .num span { font-size: calc(27px * var(--esc, 1)); }
+
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.tabela table { font-size: 29px; }
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.tabela th,
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.tabela td { padding: 22px 24px; }
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.tabela th { font-size: 18px; }
+
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.codigo { font-size: 26px; }
+
+/* O rodapé da apresentação: nome do deck e "03 / 08". Discreto — é âncora,
+   não conteúdo. */
+.cena .rodape {
+  position: absolute;
+  z-index: 2;
+  display: flex;
+  justify-content: space-between;
+  align-items: baseline;
+  gap: 24px;
+  font-family: var(--f-corpo);
+  font-size: calc(var(--u, 19px) * .95);
+  letter-spacing: .04em;
+  color: var(--c-fraco);
+  opacity: .82;
+  pointer-events: none;
+  white-space: nowrap;
+}
+.cena .rodape span:first-child { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
+.cena .rodape span:last-child { font-variant-numeric: tabular-nums; }
+
+/* Os números grandes NÃO quebram: coluna do tamanho do conteúdo, distribuídas.
+   Com três colunas iguais de um terço, "R$ 200 bi" a 140px partia em duas
+   linhas — o `!important` existe porque o render escreve `repeat(n, 1fr)`
+   inline, e é justamente isso que se troca aqui. */
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.numeros {
+  grid-template-columns: none !important;
+  grid-auto-flow: column;
+  grid-auto-columns: max-content;
+  justify-content: space-between;
+  column-gap: calc(var(--u, 19px) * 3);
+}
+.cena .fluxo[data-composicao="cabeca-corpo"] .el.numeros .num b { white-space: nowrap; }