/* ---------- 6. Responsividade ---------- */

/* No desktop o backdrop do drawer nunca aparece. */
@media (min-width: 769px) {
  .sidebar-backdrop { display: none !important; }
}

/* Sidebar vira drawer sobreposto no mobile/tablet. A segunda condição
   (id0126/E69) pega o celular DEITADO: a largura em paisagem passa de 768px
   em quase todo aparelho moderno (812, 844, 932px...), então só a largura
   nunca dispararia o modo celular — e a sidebar fixa (268px) + o painel da
   lousa (mínimo 420px) sobre uma tela de ~375px de ALTURA espremiam o chat
   a quase nada. A altura curta é o sinal de "isto é um celular", esteja ele
   de pé ou deitado. */
@media (max-width: 768px), (max-height: 500px) and (orientation: landscape) {
  .sidebar {
    position: fixed; top: 0; bottom: 0; left: 0;
    z-index: 40;
    width: 82vw; max-width: 300px;
    margin-left: 0;
    transform: translateX(-100%);
    transition: transform var(--transition);
  }
  /* Lote C, Fase 4: aberto, o drawer flutua sobre a página como o menu e o
     diálogo, e ganha a mesma sombra (no escuro ela é none). */
  .app.sidebar-open .sidebar { transform: translateX(0); box-shadow: var(--sombra-flutuante); }
  .sidebar__close { display: inline-flex; }

  /* Painel de figura ocupa a tela toda no mobile. */
  .figure-panel {
    position: fixed; inset: 0;
    z-index: 60;
    flex: none;
    border-left: none;
  }
  /* id0145: no "Fale comigo" a lousa já É a tela — sem ficar por cima do
     drawer das conversas, que precisa abrir pelo menu dela. */
  .app.fale-ativa .figure-panel { position: relative; inset: auto; z-index: auto; flex: 1 1 auto; }
}

@media (max-width: 640px) {
  body { font-size: 15px; }
  .messages { padding: 18px 12px 8px; }
  .composer-wrap { padding: 6px 10px calc(12px + env(safe-area-inset-bottom)); }
  .msg--user .msg__body { max-width: 88%; }
  .topbar { padding: 10px 12px; }

  /* O empilhamento de desenho+contas (antes duplicado aqui) mora agora no
     @container `figpainel` perto de .fig-solution__line--passo — o painel
     em tela cheia do celular tem a largura do painel = largura da janela,
     então o container query já cobre este caso sozinho (id0126/E70). */
  .figure-panel__body { padding: 10px; }

  /* Balão maior no celular: 62% de uma tela estreita não caberia o texto. */
  .fig-balao { width: min(240px, 84%); }
  .fig-pergunta { max-width: 94%; }

  /* Paywall no celular: empilhado, mas compacto — cheio (48px cada, mais a
     caixa da cota) ele tomava meia tela, e a resposta tem de continuar à
     vista (§3 S2: nunca cobrir o conteúdo). */
  .composer__paywall { grid-template-columns: 1fr; gap: 8px; margin-top: 8px; }
  .composer__paywall .acao-primaria,
  .composer__paywall .acao-secundaria { min-height: 44px; padding: 10px 14px; }
  .composer__cota--esgotada { padding: 10px 12px; font-size: .85rem; }
  /* A dica do card (kicker) em 360px ia a três linhas: menos espaçamento. */
  .figure-card__hint { letter-spacing: var(--tracking-ui); }

  /* Alvo de toque: 38px é menos que os 44px que a WCAG 2.5.8 pede como
     mínimo, e no celular estes botões são tocados com o polegar, não com um
     ponteiro de 1px. No desktop seguem em 38px — lá o mouse acerta. */
  .btn--icon { width: 44px; height: 44px; }
}

/* Aula ao vivo (id0165): a lousa fica LIVRE. O HUD (estado + botões
   compactos) mora no cabeçalho do painel; a legenda é uma faixa própria entre
   a lousa e a barra de ferramentas — nada por cima do que o professor escreve. */
.aula-live-hud { flex: 1 1 auto; min-width: 0; display: flex; align-items: center;
  justify-content: flex-end; gap: 6px; margin-left: 8px; }
.aula-live-hud__estado { flex: 1 1 auto; min-width: 0; margin: 0; color: var(--text-muted);
  font-size: var(--fs-etiqueta); text-align: right;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aula-live-hud__btn { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px;
  min-height: 36px; padding: 0 12px; border: 1px solid var(--border);
  border-radius: var(--raio-controle); background: var(--surface); color: var(--text);
  font: inherit; font-size: var(--fs-controle-compacto); cursor: pointer;
  transition: background var(--transition), border-color var(--transition); }
.aula-live-hud__btn svg.icon { width: 18px; height: 18px; }
.aula-live-hud__btn:hover,
.aula-live-hud__btn:focus-visible { border-color: var(--accent); }
.aula-live-hud__btn--parar { color: var(--giz-vermelho); }
/* id0175: microfone do aluno fechado — o botão fica marcado até reabrir. */
.aula-live-hud__btn--fechado { color: var(--giz-vermelho); border-color: var(--giz-vermelho); }
.aula-live-hud__btn--som { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
/* Celular: só os ícones (o rótulo segue no aria-label e no title) e o estado
   encolhe — o cabeçalho cabe numa linha e a lousa ganha a tela. */
@media (max-width: 640px) {
  .aula-live-hud__btn { width: 36px; padding: 0; justify-content: center; }
  .aula-live-hud__btn > span { display: none; }
  .aula-live-hud__estado { font-size: var(--fs-etiqueta); }
}

/* A legenda: no máximo duas linhas, na letra dos desenhos (Kalam). */
.aula-live-legenda { flex: 0 0 auto; max-width: 760px; width: 100%; margin: -4px auto 0;
  min-height: 2.6em; text-align: center;
  font-family: 'Kalam', 'Playpen Sans', 'Caveat', cursive; font-size: 1.05rem; line-height: 1.3;
  color: var(--text); }
.aula-live-legenda__fala { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aula-live-legenda__fala--user { color: var(--text-muted); }
@media (max-width: 640px) {
  .aula-live-legenda { font-size: .95rem; }
}

/* A lousa que ACUMULA: blocos em fluxo (flex-wrap), nunca sobrepostos — quem
   posiciona é o navegador, em qualquer largura. Rola na vertical quando enche;
   a parte nova é rolada para a vista (app.js: aulaParteDestacar). */
.figure-panel .fig-board.aula-live-lousa { flex-direction: row; flex-wrap: wrap;
  align-items: flex-start; align-content: flex-start; gap: 18px 28px;
  padding: 18px 20px; overflow-x: hidden; overflow-y: auto; }
.aula-live-lousa .aula-parte { flex: 1 1 300px; min-width: min(100%, 260px); max-width: 100%;
  display: flex; flex-direction: column; gap: 8px; padding: 6px 8px;
  border-left: 3px solid transparent; }
/* Abertura e resumo ocupam a linha inteira; desenho e matriz, o espaço que pedem. */
.aula-live-lousa .aula-parte--titulo_objetivo,
.aula-live-lousa .aula-parte--resumo { flex-basis: 100%; }
.aula-live-lousa .aula-parte--matriz { flex: 1 1 100%; }
/* id0256: o SUBTÍTULO que abre cada bloco do roteiro (o nome do conceito). Linha inteira, maior que o texto da lousa
   e menor que o título; na cor da escrita, sem moldura. O espaço acima separa o bloco novo do anterior. */
.aula-live-lousa .aula-parte--subtitulo { flex-basis: 100%; margin-top: 12px; }
.aula-live-lousa .aula-parte.aula-parte--subtitulo .fig-solution { font-size: clamp(22px, 2.6vw, 30px); font-weight: 700;
  color: var(--arr-traco); }   /* na cor do bloco: o nome do conceito e os desenhos dele têm a mesma cor */
/* id0256 ("VAMOS COLORIR"): a cor dos TRAÇOS da parte (bordas, setas, nós e ícones dos arranjos; o texto fica no
   giz). Arestas de figura geométrica e linhas de grade (tabelas, malha, Briot-Ruffini) ficam SEMPRE no giz, que é
   preto no tema claro (pedido do Beny). O servidor manda `cor` (0 a 2); no roteiro é uma por bloco. Sem `cor`, o giz.
   Só a paleta de blocos: as cores do giz têm significado (etapa, intermediário, resposta, consulta). */
.aula-live-lousa .aula-parte { --arr-traco: var(--quadro-giz); }
.aula-live-lousa .aula-parte[data-cor="0"] { --arr-traco: var(--bloco-roxo); }
.aula-live-lousa .aula-parte[data-cor="1"] { --arr-traco: var(--bloco-laranja); }
.aula-live-lousa .aula-parte[data-cor="2"] { --arr-traco: var(--bloco-rosa); }
/* id0256: a PERGUNTA ao aluno se destaca do resto da lousa: fundo suave e fio na cor da pergunta (o ciano, que nenhum
   giz usa). O fio fica mesmo quando ela é a parte nova. */
.aula-live-lousa .aula-parte.aula-parte--pergunta_retorica,
.aula-live-lousa.aula-pagina .aula-pg-faixa > .aula-parte.aula-parte--pergunta_retorica,
.aula-live-lousa .aula-parte.aula-parte--pergunta_ao_aluno,
.aula-live-lousa.aula-pagina .aula-pg-faixa > .aula-parte.aula-parte--pergunta_ao_aluno {   /* o motor de página zera o padding */
  box-sizing: border-box; background-color: var(--pergunta-fundo); border-left: 4px solid var(--pergunta); padding: 16px 18px; }
.aula-live-lousa .aula-parte--pergunta_ao_aluno .fig-solution,
.aula-live-lousa .aula-parte--pergunta_retorica .fig-solution { font-weight: 600; }
/* Fase 3 (C3): a FÓRMULA do tópico em destaque. Nome na cor do bloco, a fórmula grande numa caixa com o traço do bloco
   e a legenda das letras no giz. A caixa não passa da largura da parte e quebra a fórmula longa em vez de estourar. */
.aula-live-lousa .aula-formula__titulo { margin: 0; font-family: var(--font-calc); font-size: clamp(18px, 2vw, 24px);
  font-weight: 700; color: var(--arr-traco); }
.aula-live-lousa .aula-formula__caixa { box-sizing: border-box; max-width: 100%; align-self: flex-start;
  border: 2px solid var(--arr-traco); border-radius: 6px; padding: 10px 18px; display: flex; flex-direction: column; gap: 6px; }
.aula-live-lousa .aula-formula__expr { margin: 0; font-family: var(--font-calc); font-size: clamp(22px, 2.6vw, 32px);
  color: var(--quadro-giz); overflow-wrap: anywhere; }
.aula-live-lousa .aula-formula__definicao { margin: 0; font-family: var(--font-calc); font-size: clamp(17px, 1.9vw, 22px);
  color: var(--quadro-giz); }
.aula-live-lousa .aula-formula__legenda { margin: 2px 0 0; padding-left: 1.2em; display: flex; flex-direction: column; gap: 2px;
  font-family: var(--font-calc); font-size: clamp(15px, 1.6vw, 19px); color: var(--quadro-giz); }
/* id0296 r5: o MAPA do "Qual usar?": duas colunas (uma por ferramenta) com o nome, quando usar e um exemplo curto, e a pista que decide
   embaixo, na linha inteira. A 2ª coluna usa o amarelo do giz para as duas se distinguirem; no celular, uma sobre a outra. */
.aula-live-lousa .aula-parte--comparar_ferramentas { flex-basis: 100%; }
.aula-live-lousa .aula-comparar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; width: 100%; }
.aula-live-lousa .aula-comparar__col { box-sizing: border-box; min-width: 0; border: 2px solid var(--arr-traco); border-radius: 6px;
  padding: 10px 14px; display: flex; flex-direction: column; gap: 4px; }
.aula-live-lousa .aula-comparar__col--1 { border-color: var(--giz-amarelo); }
.aula-live-lousa .aula-comparar__nome { margin: 0; font-family: var(--font-calc); font-size: clamp(18px, 2vw, 24px); font-weight: 700;
  color: var(--arr-traco); overflow-wrap: anywhere; }
.aula-live-lousa .aula-comparar__col--1 .aula-comparar__nome { color: var(--giz-amarelo); }
.aula-live-lousa .aula-comparar__rotulo { margin: 4px 0 0; font-family: var(--font-calc); font-size: clamp(13px, 1.3vw, 15px); opacity: .7;
  color: var(--quadro-giz); }
.aula-live-lousa .aula-comparar__txt { margin: 0; font-family: var(--font-calc); font-size: clamp(16px, 1.8vw, 21px); color: var(--quadro-giz);
  overflow-wrap: anywhere; }
.aula-live-lousa .aula-comparar__exemplo .fig-solution { font-size: inherit; }
.aula-live-lousa .aula-comparar__pista { grid-column: 1 / -1; margin: 0; padding-top: 8px; border-top: 2px dashed var(--quadro-giz);
  text-align: center; font-family: var(--font-calc); font-size: clamp(17px, 1.9vw, 22px); font-weight: 700; color: var(--quadro-giz); }
@media (max-width: 640px) { .aula-live-lousa .aula-comparar { grid-template-columns: minmax(0, 1fr); } }
/* Fase 1-2 (A3): o DESFECHO da história (linha inteira): o nome do tema (na cor do bloco, como o subtítulo), o objetivo
   da aula e a trilha numerada, no giz. */
.aula-live-lousa .aula-parte--desfecho_historia { flex-basis: 100%; }
.aula-live-lousa .aula-desfecho__tema { margin: 0; font-family: var(--font-calc); font-size: clamp(22px, 2.6vw, 30px);
  font-weight: 700; color: var(--arr-traco); }
.aula-live-lousa .aula-desfecho__objetivo { margin: 0; font-family: var(--font-calc); font-size: clamp(17px, 1.9vw, 22px);
  color: var(--quadro-giz); }
.aula-live-lousa .aula-desfecho__trilha { margin: 4px 0 0; padding-left: 1.6em; display: flex; flex-direction: column; gap: 4px;
  font-family: var(--font-calc); font-size: clamp(16px, 1.7vw, 20px); color: var(--quadro-giz); }
/* A3: a TRILHA fixa no topo da lousa (sticky dentro da própria lousa, que é quem rola): ✓ visto, ▸ atual. Uma linha só;
   se não cabe, rola na horizontal (o atual é trazido para a vista). Fundo opaco do quadro: o que rola passa por baixo. */
.aula-live-lousa .aula-trilha { position: sticky; top: 0; z-index: 4; flex: 0 0 auto; width: 100%; box-sizing: border-box;
  background: var(--quadro-bg); border-bottom: 1px solid var(--quadro-moldura); padding: 6px 4px; }
/* No motor de página a lousa tem --pg-topo de margem em cima: a faixa gruda na BORDA (senão o que rola aparece acima dela) */
.aula-live-lousa.aula-pagina .aula-trilha { top: calc(-1 * var(--pg-topo)); }
.aula-live-lousa .aula-trilha__lista { display: flex; gap: 6px 18px; margin: 0; padding: 0; list-style: none;
  overflow-x: auto; white-space: nowrap; scrollbar-width: none; font-family: var(--font-calc); font-size: 15px; line-height: 1.4; }
.aula-live-lousa .aula-trilha__item { display: inline-flex; align-items: baseline; gap: 4px; color: var(--quadro-giz); opacity: .6; }
.aula-live-lousa .aula-trilha__item--feito { opacity: .85; }
.aula-live-lousa .aula-trilha__item--atual { opacity: 1; font-weight: 700; }
.aula-live-lousa .aula-trilha__marca:empty { display: none; }
/* id0256: o ESPAÇO do desenho da questão (os desenhos vêm com as analogias): a caixa tracejada dos arranjos que ainda
   não existem (`faltando`), com o que o desenho vai mostrar. */
.aula-live-lousa .aula-pergunta__desenho { box-sizing: border-box; width: min(100%, 420px); min-height: 140px;
  display: flex; align-items: center; justify-content: center; padding: 12px 16px; text-align: center;
  font-family: var(--font-calc); font-size: .9em; color: var(--quadro-giz); border: 2px dashed var(--quadro-giz); }
/* id0355: o PALCO da cena (aula-arranjos.js `palco`): os objetos da história lado a lado (cada um repetido em grade), setas entre
   eles e a pergunta embaixo. Sem moldura (os desenhos de referência só marcam posição); texto no giz; "?" em azul. */
.aula-live-lousa .aula-pergunta__palco { width: min(100%, 520px); margin: 6px 0 2px; }
.aula-live-lousa .aula-palco { display: flex; flex-direction: column; align-items: center; gap: 10px; color: var(--quadro-giz); }
.aula-live-lousa .aula-palco__cena { display: flex; align-items: flex-end; justify-content: center; gap: 8px; width: 100%; }
.aula-live-lousa .aula-palco__item { flex: 1 1 0; min-width: 0; max-width: 240px; display: flex; flex-direction: column; align-items: center; gap: 3px; }
.aula-live-lousa .aula-palco__grupo { display: grid; grid-template-columns: repeat(var(--cols, 1), minmax(0, 1fr)); gap: 3px 2px;
  width: 100%; justify-items: center; align-items: end; }
.aula-live-lousa .aula-palco__copia { display: flex; flex-direction: column; align-items: center; min-width: 0; width: 100%; }
.aula-live-lousa .aula-palco__copia--apagada { opacity: .4; }
.aula-live-lousa .aula-palco__svg { position: static; display: block; flex: 0 0 auto; width: 100%; height: auto; max-height: var(--alto, 64px); overflow: visible; }
.aula-live-lousa .aula-palco__facin path { vector-effect: non-scaling-stroke; }
.aula-live-lousa .aula-palco__copia--meio .aula-palco__svg { clip-path: inset(0 50% 0 0); }
.aula-live-lousa .aula-palco__novo { box-sizing: border-box; width: 100%; min-height: 56px; display: flex; align-items: center; justify-content: center;
  padding: 4px; border: 2px dashed var(--quadro-giz); font-family: var(--font-calc); font-size: .75em; text-align: center; overflow-wrap: anywhere; }
.aula-live-lousa .aula-palco__novo--copia { min-height: 0; aspect-ratio: 1 / 1; max-height: var(--alto, 64px); max-width: var(--alto, 64px); }
.aula-live-lousa .aula-palco__novo-nome { font-family: var(--font-calc); font-size: .7em; color: var(--text-muted, var(--quadro-giz)); text-align: center; }
.aula-live-lousa .aula-palco .fig-solution { margin: 0; max-width: 100%; text-align: center; }
.aula-live-lousa .aula-palco .aula-palco__val { margin-top: 4px; font-size: .72em; line-height: 1.1; }
.aula-live-lousa .aula-palco .aula-palco__val .fig-solution__line { white-space: nowrap; }
.aula-live-lousa .aula-palco__rotulo { font-size: .85em; line-height: 1.15; }
.aula-live-lousa .aula-palco__linha { font-size: .78em; line-height: 1.15; }
.aula-live-lousa .aula-palco__ligacao { flex: 0 0 auto; width: 84px; align-self: center; display: flex; flex-direction: column; gap: 6px; }
.aula-live-lousa .aula-palco__seta { display: flex; flex-direction: column; align-items: center; }
.aula-live-lousa .aula-palco__seta-txt { font-size: .68em; line-height: 1.1; }
.aula-live-lousa .aula-palco__seta-svg { position: static; display: block; width: 100%; height: 12px; overflow: visible; }
.aula-live-lousa .aula-palco__pergunta { font-size: 1em; }
/* id0361: o palco no CELULAR. A coluna fixa de 84 px das setas deixava ~50 px por objeto (3 itens + 2 setas em 390 px) e o
   overflow-wrap: anywhere da parte partia a palavra no meio ("capi/m"). Palco estreito: setas e vãos menores, rótulos um pouco menores
   e palavra nunca partida: cada coluna tem pelo menos a largura da maior palavra dela, e a das setas, a do próprio texto. */
.aula-live-lousa .aula-palco { width: 100%; container-type: inline-size; }
.aula-live-lousa .aula-parte .aula-palco .fig-solution__line { overflow-wrap: normal; word-break: normal; }
.aula-live-lousa .aula-palco__item { min-width: min-content; }
.aula-live-lousa .aula-palco__ligacao { width: auto; min-width: 36px; max-width: 84px; }
@container (max-width: 480px) {
  .aula-live-lousa .aula-palco__cena { gap: 4px; }
  .aula-live-lousa .aula-palco__ligacao { max-width: 64px; gap: 4px; }
  .aula-live-lousa .aula-palco__seta-txt { font-size: .6em; }
  .aula-live-lousa .aula-palco__rotulo { font-size: .76em; }
  .aula-live-lousa .aula-palco__linha { font-size: .7em; }
  .aula-live-lousa .aula-palco .aula-palco__val { font-size: .66em; }
}
@container (max-width: 340px) {      /* celular de 360 px: 3 palavras longas + 2 setas ainda cabem */
  .aula-live-lousa .aula-palco__cena { gap: 2px; }
  .aula-live-lousa .aula-palco__ligacao { min-width: 30px; max-width: 54px; }
  .aula-live-lousa .aula-palco__seta-txt { font-size: .55em; }
  .aula-live-lousa .aula-palco__rotulo { font-size: .68em; }
  .aula-live-lousa .aula-palco__linha { font-size: .64em; }
}
.aula-live-lousa .aula-parte > svg { position: static; width: min(100%, 420px); height: auto;
  aspect-ratio: 360 / 260; overflow: visible; color: var(--quadro-giz); }
.aula-live-lousa .aula-parte > svg.math-figure__svg--matriz { width: min(100%, 640px); aspect-ratio: auto; }
.aula-live-lousa .aula-parte > svg.aula-oculto { display: none; }
/* Dentro de um bloco a fórmula pode quebrar: estourar a borda seria pior. */
.aula-live-lousa .aula-parte .fig-solution { font-size: clamp(17px, 1.9vw, 22px); }
.aula-live-lousa .aula-parte .fig-solution__line { white-space: normal; overflow-wrap: anywhere;
  overflow: visible; }   /* a linha quebra: rolar cada uma (regra da lousa estreita) só punha setinhas */
.aula-live-lousa .aula-parte .aula-matriz { margin: 0; }
/* A parte que o professor está explicando: um fio de giz à esquerda. */
.aula-live-lousa .aula-parte--nova { border-left-color: var(--accent); }
/* B2 (id0249): o bloco que o professor está retomando (resumo da Fase 6). Só pinta: fundo suave que se estende 8px para fora + moldura de 2px
   (box-shadow não ocupa espaço, e as margens da lousa, de 16 px no celular e 48 px ou mais no computador, comportam os 10 px), então nada muda de lugar nem de tamanho. */
.aula-live-lousa .aula-parte--realce { background-color: var(--realce-fundo);
  box-shadow: 0 0 0 8px var(--realce-fundo); outline: 2px solid var(--realce-borda); outline-offset: 8px;
  scroll-margin: 14px; }   /* ao rolar até ele, sobra folga para a moldura não ficar cortada no topo nem no pé da lousa */
/* B4a (id0251): o PAINEL DE RESPOSTA da pergunta da lousa (js/18-fale-aula.js, aulaPainelMontar). Estiliza por
   CLASSE (E57), sem animação. Cores só pelos tokens da lousa, que já têm um valor por tema (E80). Cantos ARREDONDADOS
   (id0256, pedido do Beny: exceção à F4 só nos controles do painel; o resto da lousa segue reto).
   Alvo de toque de 44 px. A linha de status tem altura reservada: trocar de estado não muda o tamanho do bloco. */
.aula-live-lousa .aula-resp { display: flex; flex-direction: column; align-items: flex-start; gap: 10px;
  width: min(100%, 560px); margin-top: 14px; }
.aula-live-lousa .aula-resp__opcoes { display: flex; flex-direction: column; gap: 8px; width: 100%; }
.aula-live-lousa .aula-resp__alt, .aula-live-lousa .aula-resp__nao-sei, .aula-live-lousa .aula-resp__enviar,
.aula-live-lousa .aula-resp__input { box-sizing: border-box; min-height: 44px; padding: 8px 14px;
  font-family: var(--font-calc); font-size: clamp(17px, 1.9vw, 22px);
  color: var(--quadro-giz); background: transparent; border: 2px solid var(--realce-borda);   /* 3:1 contra o quadro nos dois temas */
  border-radius: 12px; }
.aula-live-lousa .aula-resp__alt { display: flex; align-items: baseline; gap: 12px; width: 100%; text-align: left; cursor: pointer; }
.aula-live-lousa .aula-resp__letra { flex: 0 0 auto; min-width: 1.4em; font-weight: 700; }
.aula-live-lousa .aula-resp__texto { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.aula-live-lousa .aula-resp__nao-sei { border-style: dashed; cursor: pointer; }
.aula-live-lousa .aula-resp__enviar { cursor: pointer; font-weight: 700; }
.aula-live-lousa .aula-resp__campo { display: flex; gap: 8px; width: 100%; }
.aula-live-lousa .aula-resp__input { flex: 1 1 auto; min-width: 0; }
.aula-live-lousa .aula-resp__alt:hover:not(:disabled), .aula-live-lousa .aula-resp__nao-sei:hover:not(:disabled),
.aula-live-lousa .aula-resp__enviar:hover:not(:disabled) { border-color: var(--quadro-giz); }
.aula-live-lousa .aula-resp__alt:focus-visible, .aula-live-lousa .aula-resp__nao-sei:focus-visible,
.aula-live-lousa .aula-resp__enviar:focus-visible, .aula-live-lousa .aula-resp__input:focus-visible {
  outline: 3px solid var(--quadro-giz); outline-offset: 2px; }
.aula-live-lousa .aula-resp__marcada { background-color: var(--realce-fundo); border-color: var(--quadro-giz); }
.aula-live-lousa .aula-resp__alt:disabled, .aula-live-lousa .aula-resp__nao-sei:disabled,
.aula-live-lousa .aula-resp__enviar:disabled, .aula-live-lousa .aula-resp__input:disabled { cursor: default; opacity: .55; }
.aula-live-lousa .aula-resp__marcada:disabled { opacity: 1; }
.aula-live-lousa .aula-resp__status { margin: 0; min-height: 1.5em; font-family: var(--font-calc); font-size: .9em; color: var(--quadro-giz); }
/* Veredito (id0254): o servidor diz `certa` ou `errada` e o botão que o aluno escolheu (ou o campo) ganha cor: verde com
   ✓, vermelho com ✗ (o selo só existe nas ALTERNATIVAS; o Enviar e o Não sei só mudam de cor, o selo cobriria o texto).
   Só cor, borda e um selo posicionado por cima (nada muda de tamanho); a animação só roda se o
   aluno não pediu menos movimento. Não sei, silêncio e "não entendi" ficam neutros. */
.aula-live-lousa .aula-resp__acertou, .aula-live-lousa .aula-resp__errou { position: relative; opacity: 1; }
.aula-live-lousa .aula-resp__acertou { border-color: var(--acerto); background-color: var(--acerto-fundo); }
.aula-live-lousa .aula-resp__errou { border-color: var(--erro); background-color: var(--erro-fundo); }
.aula-live-lousa .aula-resp__alt.aula-resp__acertou::after, .aula-live-lousa .aula-resp__alt.aula-resp__errou::after { position: absolute; right: 14px; top: 50%;
  transform: translateY(-50%); font-weight: 700; line-height: 1; pointer-events: none; }
.aula-live-lousa .aula-resp__alt.aula-resp__acertou::after { content: "\2713"; color: var(--acerto); }
.aula-live-lousa .aula-resp__alt.aula-resp__errou::after { content: "\2717"; color: var(--erro); }
.aula-live-lousa .aula-resp--certa .aula-resp__status { color: var(--acerto); font-weight: 700; }
.aula-live-lousa .aula-resp--errada .aula-resp__status { color: var(--erro); font-weight: 700; }
@keyframes respAcerto {
  0% { box-shadow: 0 0 0 0 var(--acerto); transform: translateY(0); }
  30% { transform: translateY(-6px); }
  60% { transform: translateY(0); }
  100% { box-shadow: 0 0 0 16px transparent; transform: none; }
}
@keyframes respErro {
  0%, 100% { transform: translateX(0); }
  18% { transform: translateX(-8px); } 36% { transform: translateX(8px); }
  54% { transform: translateX(-6px); } 72% { transform: translateX(6px); }
}
@keyframes respSelo { from { transform: translateY(-50%) scale(.2); opacity: 0; } to { transform: translateY(-50%) scale(1); opacity: 1; } }
@media (prefers-reduced-motion: no-preference) {
  .aula-live-lousa .aula-resp__acertou { animation: respAcerto 800ms ease-out; }
  .aula-live-lousa .aula-resp__errou { animation: respErro 520ms ease-in-out; }
  .aula-live-lousa .aula-resp__alt.aula-resp__acertou::after, .aula-live-lousa .aula-resp__alt.aula-resp__errou::after { animation: respSelo 420ms ease-out; }
}
@media (prefers-reduced-motion: no-preference) {
  .aula-live-lousa .aula-parte { animation: aulaParteEntra 420ms ease-out both; }
}
@keyframes aulaParteEntra { from { opacity: 0; } to { opacity: 1; } }

/* Arranjos da lousa (id0185, Fase 2): o CSS dos desenhadores de aula-arranjos.js. Tudo sob
   .aula-live-lousa: o chat não muda. Os quadrados e retângulos dos desenhos de referência só
   marcam a POSIÇÃO de cada elemento: não existem na lousa (sem moldura, sem fundo de caixa), e o
   texto é todo da cor da escrita (as legendas azuis do desenho eram só indicação). Sobram a caixa
   tracejada do `faltando` e o realce do papel `final`. Cores PROVISÓRIAS dos tokens que já
   existem (as definitivas são o próximo lote): certo = verde (✓), errado = vermelho (✗).
   Tamanho: --arr-caixa nasce da largura do bloco (cqw), sem passar do que cabe; o motor de página
   (Fase 3) passa a mandar a escala. Modo celular (data-modo): até 640 px de lousa, ou bloco com
   menos de 420 px; no máximo 2 caixas por linha, seta vertical com o rótulo à direita. */
.aula-live-lousa .aula-parte[data-arranjo] { container: arr / inline-size; flex: 1 1 100%; }
.aula-live-lousa .aula-arranjo { --arr-gap: 20px; --arr-seta: 112px; --arr-fonte: 20px;
  --cols: var(--arr-cols-d, 2); --setas: var(--arr-setas-d, 0);
  --arr-caixa: clamp(96px, calc((100cqw - 4px - (var(--cols) - 1) * var(--arr-gap) - var(--setas) * var(--arr-seta)) / var(--cols)), 300px);
  position: relative; box-sizing: border-box; width: 100%; min-width: 0; color: var(--quadro-giz); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] { --arr-gap: 12px; --arr-seta: 64px; --arr-fonte: 17px;
  --cols: var(--arr-cols-m, 2); --setas: 0; }
.aula-live-lousa .aula-arranjo *, .aula-live-lousa .aula-arranjo *::before { box-sizing: border-box; }
.aula-live-lousa .aula-arranjo .aula-setas { position: absolute; inset: 0; width: 100%; height: 100%;
  pointer-events: none; overflow: visible; color: var(--arr-traco); }

/* Texto e conta (renderCalcLine dentro de .fig-solution, como na lousa) */
.aula-live-lousa .aula-arranjo .aula-arr__txt { display: block; font-size: var(--arr-fonte); line-height: 1.35;
  min-width: 0; }
.aula-live-lousa .aula-arranjo .aula-arr__txt .fig-solution__line { white-space: normal; overflow-wrap: break-word; }
.aula-live-lousa .aula-arranjo .aula-arr__conta { font-family: var(--font-calc); }
.aula-live-lousa .aula-arranjo .aula-arr__rotulo,
.aula-live-lousa .aula-arranjo .aula-arr__titulo,
.aula-live-lousa .aula-arranjo .aula-arr__legenda,
.aula-live-lousa .aula-arranjo .aula-seta__rotulo { color: var(--quadro-giz); }
.aula-live-lousa .aula-arranjo .aula-arr__titulo,
.aula-live-lousa .aula-arranjo .aula-arr__legenda { text-align: center; max-width: 100%; }
.aula-live-lousa .aula-arranjo .aula-arr__legenda { font-size: calc(var(--arr-fonte) * .9); }
.aula-live-lousa .aula-arranjo .aula-arr__conclusao { text-align: center; }

/* A caixa: o mesmo tamanho em todo o arranjo */
.aula-live-lousa .aula-arranjo .aula-caixa { position: relative; width: var(--arr-caixa); height: calc(var(--arr-caixa) * 260 / 360);
  border-radius: 8px; overflow: hidden; }   /* o ritmo do motor de figuras (360 × 260): o espaço não é um quadrado vazio */
/* Só conta e texto na caixa (nenhuma figura): ela tem o tamanho do conteúdo, não de um quadrado vazio */
.aula-live-lousa .aula-arranjo[data-conteudo="conta"] .aula-caixa { height: auto; min-height: calc(var(--arr-caixa) * .2);
  overflow: visible; }
.aula-live-lousa .aula-arranjo[data-conteudo="conta"] .aula-caixa__corpo { height: auto; min-height: inherit; overflow: visible;
  padding: 6px 1.9em; }   /* folga dos dois lados: o ✓/✗ do canto não cobre a conta */
.aula-live-lousa .aula-arranjo .aula-item > * { max-width: 100%; min-width: 0; }
.aula-live-lousa .aula-arranjo .aula-caixa__corpo { width: 100%; height: 100%; padding: 6px; overflow: auto;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; }
.aula-live-lousa .aula-arranjo .aula-caixa__corpo > svg { position: static; width: 100%; height: 100%; flex: 1 1 auto;
  min-height: 0; overflow: visible; color: var(--quadro-giz); }   /* id0256: aresta de figura fica no giz */
.aula-live-lousa .aula-arranjo .aula-caixa__corpo .fig-solution { flex: 0 0 auto; max-width: 100%; }
.aula-live-lousa .aula-arranjo .aula-caixa__corpo .aula-arr__txt { font-size: min(var(--arr-fonte), calc(var(--arr-caixa) * .12));
  text-align: center; }
.aula-live-lousa .aula-arranjo .aula-caixa--faltando { border: 2px dashed var(--quadro-giz); }
.aula-live-lousa .aula-arranjo .aula-caixa__faltando { font-family: var(--font-calc); margin: 0; text-align: center; font-size: calc(var(--arr-fonte) * .85);
  line-height: 1.25; color: var(--text-muted, var(--quadro-giz)); overflow-wrap: anywhere; }
/* Silhuetas temáticas no lugar do tracejado: de 1 a 3 desenhos lado a lado (cada um um quadrado 100 × 100) e a descrição em giz embaixo */
.aula-live-lousa .aula-arranjo .aula-sil { display: flex; align-items: center; justify-content: center; gap: 4px; flex: 1 1 auto;
  width: 100%; min-height: 0; }
.aula-live-lousa .aula-arranjo .aula-sil__svg { position: static; display: block; flex: 0 1 auto; min-width: 0; height: 100%; width: auto;
  max-width: calc((100% - 8px * (var(--n, 1) - 1)) / var(--n, 1)); aspect-ratio: 1 / 1; overflow: hidden; }
.aula-live-lousa .aula-arranjo .aula-caixa__sil-legenda { flex: 0 0 auto; margin: 0; max-width: 100%; text-align: center;
  font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .85); line-height: 1.2; color: var(--quadro-giz); overflow-wrap: anywhere; }
.aula-live-lousa .aula-arranjo .aula-papel__marca { position: absolute; top: 2px; right: 7px; font-size: 1.35em;
  font-weight: 700; line-height: 1; }
.aula-live-lousa .aula-arranjo .aula-papel-certo .aula-papel__marca { color: var(--giz-verde); }
.aula-live-lousa .aula-arranjo .aula-papel-errado .aula-papel__marca { color: var(--giz-vermelho); }
/* final: o ponto de chegada, em destaque (um realce suave, não uma moldura) */
.aula-live-lousa .aula-arranjo .aula-papel-final { background: color-mix(in srgb, var(--giz-amarelo) 16%, transparent); }
.aula-live-lousa .aula-arranjo[data-conteudo="conta"] .aula-caixa.aula-papel-final { background: none; }
.aula-live-lousa .aula-arranjo[data-conteudo="conta"] .aula-caixa.aula-papel-final .aula-arr__txt { padding: 2px 12px; border-radius: 8px;
  background: color-mix(in srgb, var(--giz-amarelo) 16%, transparent); }

/* Áreas nomeadas (grid-template-areas de cada arranjo) */
.aula-live-lousa .aula-arranjo .aula-a-ta { grid-area: ta; } .aula-live-lousa .aula-arranjo .aula-a-ca { grid-area: ca; }
.aula-live-lousa .aula-arranjo .aula-a-se { grid-area: se; } .aula-live-lousa .aula-arranjo .aula-a-td { grid-area: td; }
.aula-live-lousa .aula-arranjo .aula-a-cd { grid-area: cd; } .aula-live-lousa .aula-arranjo .aula-a-con { grid-area: con; }
.aula-live-lousa .aula-arranjo .aula-a-tp { grid-area: tp; } .aula-live-lousa .aula-arranjo .aula-a-cp { grid-area: cp; }
.aula-live-lousa .aula-arranjo .aula-a-ts { grid-area: ts; } .aula-live-lousa .aula-arranjo .aula-a-cs { grid-area: cs; }
.aula-live-lousa .aula-arranjo .aula-a-orb { grid-area: orb; } .aula-live-lousa .aula-arranjo .aula-a-d1 { grid-area: d1; }
.aula-live-lousa .aula-arranjo .aula-a-d2 { grid-area: d2; } .aula-live-lousa .aula-arranjo .aula-a-n1 { grid-area: n1; }
.aula-live-lousa .aula-arranjo .aula-a-n2 { grid-area: n2; } .aula-live-lousa .aula-arranjo .aula-a-e1 { grid-area: e1; }
.aula-live-lousa .aula-arranjo .aula-a-e2 { grid-area: e2; } .aula-live-lousa .aula-arranjo .aula-a-jn { grid-area: jn; }
.aula-live-lousa .aula-arranjo .aula-a-res { grid-area: res; } .aula-live-lousa .aula-arranjo .aula-a-nome { grid-area: nome; }
.aula-live-lousa .aula-arranjo .aula-a-caixa { grid-area: caixa; } .aula-live-lousa .aula-arranjo .aula-a-lista { grid-area: lista; }
.aula-live-lousa .aula-arranjo .aula-unidade { display: flex; flex-direction: column; align-items: center; gap: 8px;
  min-width: 0; }

/* A seta: a célula só reserva o espaço e leva o rótulo; a seta em si é o SVG medido (.aula-setas) */
.aula-live-lousa .aula-arranjo .aula-seta { position: relative; align-self: stretch; min-width: 0;
  min-height: calc(var(--arr-fonte) * 3.6); }   /* cabe o rótulo (até 2 linhas) acima da seta */
.aula-live-lousa .aula-arranjo .aula-seta__rotulo { font-family: var(--font-calc); position: absolute; left: 0; right: 0; bottom: calc(50% + 12px);
  text-align: center; font-size: calc(var(--arr-fonte) * .9); line-height: 1.2; overflow-wrap: anywhere; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-seta { height: var(--arr-seta); width: 100%; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-seta__rotulo { left: calc(50% + 18px); right: 0; bottom: auto;
  top: 50%; transform: translateY(-50%); text-align: left; }

/* 1. sequencia_vertical.passos: rótulo à esquerda, conta à direita; o resultado em destaque */
.aula-live-lousa .aula-arr--sequencia_vertical-passos { display: grid; grid-template-columns: minmax(70px, 24%) minmax(0, 1fr);
  gap: 12px 18px; align-items: center; }
.aula-live-lousa .aula-arr--sequencia_vertical-passos .aula-faixa { border-radius: 8px; padding: 4px 12px; min-width: 0; }
.aula-live-lousa .aula-arr--sequencia_vertical-passos .aula-faixa.aula-papel-final { font-weight: 700; }
.aula-live-lousa .aula-arr--sequencia_vertical-passos[data-modo="celular"] { grid-template-columns: minmax(0, 1fr);
  gap: 4px; }
.aula-live-lousa .aula-arr--sequencia_vertical-passos[data-modo="celular"] .aula-faixa { margin-bottom: 8px; }

/* 2 e 5. comparacao.certo_errado e comparacao.tipos: itens em colunas; no celular, 2 por linha e o resto centralizado */
.aula-live-lousa .aula-arr--comparacao-certo_errado,
.aula-live-lousa .aula-arr--comparacao-tipos { display: flex; flex-wrap: nowrap; justify-content: safe center;
  align-items: flex-start; gap: 16px var(--arr-gap); }   /* safe: o que não cabe vaza só à direita, e o motor de página o vê (id0241) */
.aula-live-lousa .aula-arr--comparacao-certo_errado[data-modo="celular"],
.aula-live-lousa .aula-arr--comparacao-tipos[data-modo="celular"] { display: grid; justify-content: safe center;
  grid-template-columns: repeat(2, var(--arr-caixa)); justify-items: center; }
.aula-live-lousa .aula-arr--comparacao-certo_errado[data-modo="celular"] > .aula-item:last-of-type:nth-child(odd),
.aula-live-lousa .aula-arr--comparacao-tipos[data-modo="celular"] > .aula-item:last-of-type:nth-child(odd) {
  grid-column: 1 / -1; }   /* 3 itens: 2 em cima, o 3º embaixo, centralizado */
.aula-live-lousa .aula-arranjo .aula-item { flex: 0 0 auto; width: var(--arr-caixa); display: flex; flex-direction: column;
  align-items: center; gap: 8px; min-width: 0; }

/* 3. grade.equivalencias: tabela de 2 colunas com borda, sem cabeçalho, conteúdo centralizado */
.aula-live-lousa .aula-arr--grade-equivalencias { display: flex; justify-content: center; }
.aula-live-lousa .aula-arranjo .aula-grade { border-collapse: collapse; width: 100%; max-width: 640px; table-layout: fixed; }
.aula-live-lousa .aula-arranjo .aula-grade td { padding: 8px 18px; text-align: center; vertical-align: middle;
  overflow-wrap: anywhere; }
.aula-live-lousa .aula-arranjo .aula-grade .aula-arr__txt { text-align: center; }

/* 4. antes_depois.mudanca */
.aula-live-lousa .aula-arr--antes_depois-mudanca { display: grid; justify-content: center; align-items: center;
  grid-template-columns: var(--arr-caixa) var(--arr-seta) var(--arr-caixa); column-gap: 0; row-gap: 10px;
  grid-template-areas: "ta . td" "ca se cd" "con con con"; }
.aula-live-lousa .aula-arr--antes_depois-mudanca .aula-a-con { margin-top: 10px; }
.aula-live-lousa .aula-arr--antes_depois-mudanca[data-modo="celular"] { grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "ta" "ca" "se" "td" "cd" "con"; justify-items: center; row-gap: 8px; }

/* 6. figura_rotulo.ficha: a 2ª ficha é espelhada; no celular, nome, caixa e características em coluna */
.aula-live-lousa .aula-arr--figura_rotulo-ficha { display: flex; flex-direction: column; gap: 28px; max-width: 760px;
  margin-inline: auto; }
.aula-live-lousa .aula-arranjo .aula-ficha { display: grid; align-items: start; column-gap: var(--arr-gap); row-gap: 8px;
  grid-template-columns: var(--arr-caixa) minmax(10em, 1fr); grid-template-areas: "nome ." "caixa lista"; }
.aula-live-lousa .aula-arranjo .aula-ficha--espelhada { grid-template-columns: minmax(10em, 1fr) var(--arr-caixa);
  grid-template-areas: "lista caixa" ". nome"; }
.aula-live-lousa .aula-arranjo .aula-ficha .aula-arr__titulo { text-align: left; }
.aula-live-lousa .aula-arr--figura_rotulo-ficha[data-modo="celular"] .aula-ficha,
.aula-live-lousa .aula-arr--figura_rotulo-ficha[data-modo="celular"] .aula-ficha--espelhada {
  grid-template-columns: minmax(0, 1fr); grid-template-areas: "nome" "caixa" "lista"; justify-items: center; }
.aula-live-lousa .aula-arr--figura_rotulo-ficha[data-modo="celular"] .aula-ficha .aula-arr__titulo { text-align: center; }
.aula-live-lousa .aula-arr--figura_rotulo-ficha[data-modo="celular"] .aula-a-lista { justify-self: stretch; }
.aula-live-lousa .aula-arranjo .aula-arr__marcas { list-style: none; margin: 0; padding: 0; display: flex;
  flex-direction: column; gap: 10px; min-width: 0; }
.aula-live-lousa .aula-arranjo .aula-arr__marcas > li { display: flex; gap: 10px; align-items: baseline; min-width: 0; }
.aula-live-lousa .aula-arranjo .aula-arr__marcas > li::before { content: ""; flex: none; width: .5em; height: .5em;
  border-radius: 50%; background: var(--arr-traco); }

/* 7. setas.problema_solucao: um par por linha, os pares alinhados em duas colunas */
.aula-live-lousa .aula-arr--setas-problema_solucao { display: flex; flex-direction: column; align-items: center; gap: 24px; }
.aula-live-lousa .aula-arranjo .aula-par { display: grid; align-items: center; justify-content: center; row-gap: 10px;
  grid-template-columns: var(--arr-caixa) var(--arr-seta) var(--arr-caixa); grid-template-areas: "tp . ts" "cp se cs"; }
.aula-live-lousa .aula-arr--setas-problema_solucao[data-modo="celular"] .aula-par { grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "tp" "cp" "se" "ts" "cs"; justify-items: center; row-gap: 8px; width: 100%; }

/* 8. setas.ramificacao: a origem à esquerda, centralizada na altura, as derivadas empilhadas à direita */
.aula-live-lousa .aula-arr--setas-ramificacao { display: grid; justify-content: center; align-items: start;
  grid-template-columns: var(--arr-caixa) var(--arr-seta) var(--arr-caixa); row-gap: 8px; column-gap: 0;
  grid-template-areas: "orb . d1" "orb . n1" "orb . d2" "orb . n2"; }
.aula-live-lousa .aula-arr--setas-ramificacao .aula-a-orb { align-self: center; }
.aula-live-lousa .aula-arr--setas-ramificacao .aula-a-d2 { margin-top: 14px; }
.aula-live-lousa .aula-arr--setas-ramificacao[data-modo="celular"] { grid-template-columns: repeat(2, var(--arr-caixa));
  column-gap: var(--arr-gap); grid-template-areas: "orb orb" "d1 d2" "n1 n2"; }
.aula-live-lousa .aula-arr--setas-ramificacao[data-modo="celular"] .aula-a-orb { justify-self: center; }
.aula-live-lousa .aula-arr--setas-ramificacao[data-modo="celular"] .aula-a-d1,
.aula-live-lousa .aula-arr--setas-ramificacao[data-modo="celular"] .aula-a-d2 { margin-top: var(--arr-seta); }

/* 9. setas.convergencia: entradas à esquerda com a junção entre elas, o resultado à direita */
.aula-live-lousa .aula-arr--setas-convergencia { display: grid; justify-content: center; align-items: start;
  grid-template-columns: var(--arr-caixa) var(--arr-seta) var(--arr-caixa); row-gap: 8px; column-gap: 0;
  grid-template-areas: "n1 . res" "e1 . res" "jn . res" "e2 . res" "n2 . res"; }
.aula-live-lousa .aula-arr--setas-convergencia .aula-a-res { align-self: center; }
.aula-live-lousa .aula-arr--setas-convergencia .aula-a-e1,
.aula-live-lousa .aula-arr--setas-convergencia .aula-a-e2 { justify-self: start; }
.aula-live-lousa .aula-arranjo .aula-juncao { justify-self: center; font-size: 1.9em; line-height: 1; color: var(--arr-traco);
  font-family: var(--font-calc); }
.aula-live-lousa .aula-arr--setas-convergencia[data-modo="celular"] { --arr-seta: 52px; --setas: 1;
  grid-template-columns: var(--arr-caixa) var(--arr-seta) var(--arr-caixa);
  grid-template-areas: "e1 jn e2" "n1 . n2" "res res res"; align-items: center; }
.aula-live-lousa .aula-arr--setas-convergencia[data-modo="celular"] .aula-a-n1,
.aula-live-lousa .aula-arr--setas-convergencia[data-modo="celular"] .aula-a-n2 { align-self: start; }
.aula-live-lousa .aula-arr--setas-convergencia[data-modo="celular"] .aula-a-res { justify-self: center;
  margin-top: calc(var(--arr-seta) + 4px); }

/* 10. setas.cadeia: uma linha de estados com a seta e a ação entre eles; no celular, uma coluna */
.aula-live-lousa .aula-arr--setas-cadeia { display: grid; justify-content: center; align-items: start; row-gap: 8px;
  column-gap: 0; grid-template-columns: var(--arr-template); }
.aula-live-lousa .aula-arr--setas-cadeia > :not(.aula-setas) { grid-column: var(--gc); grid-row: var(--gr); }
.aula-live-lousa .aula-arr--setas-cadeia > .aula-caixa { align-self: center; }   /* os centros alinham: a seta fica reta */
.aula-live-lousa .aula-arr--setas-cadeia[data-modo="celular"] { grid-template-columns: minmax(0, 1fr); justify-items: center; }
.aula-live-lousa .aula-arr--setas-cadeia[data-modo="celular"] > :not(.aula-setas) { grid-column: 1; grid-row: auto; }

/* 11. bullet_points.lista: lista de texto, sem caixas */
.aula-live-lousa .aula-arr--bullet_points-lista .aula-arr__marcas { gap: 12px; }
/* Nicho Números (nichos/numeros.json): só conta e texto, sem caixas de figura. */
/* N1. expressao_camadas: uma linha por camada; a chave sob o trecho resolvido, com a regra ao lado (celular: abaixo) */
.aula-live-lousa .aula-arr--numeros-expressao_camadas { display: flex; justify-content: center; }
.aula-live-lousa .aula-camadas { display: flex; flex-direction: column; gap: 4px; width: fit-content; max-width: 100%;
  padding-right: 9em; }
.aula-live-lousa .aula-linha { padding: 2px 10px; border-radius: 8px; min-width: 0; }
.aula-live-lousa .aula-linha.aula-papel-final { width: fit-content; }
.aula-live-lousa .aula-linha--com-chave { padding-bottom: calc(var(--arr-fonte) * 1.1 + 12px); }
.aula-live-lousa .aula-linha__texto { display: flex; flex-wrap: wrap; align-items: baseline; min-width: 0; }
.aula-live-lousa .aula-linha__peca { flex: 0 0 auto; width: max-content; max-width: 100%; }
.aula-live-lousa .aula-camadas .aula-arr__txt { font-size: min(var(--arr-fonte), 3.4cqw); }   /* a conta longa encolhe em vez de quebrar */
.aula-live-lousa .aula-arr--numeros-expressao_camadas[data-modo="celular"] .aula-camadas .aula-arr__txt { font-size: min(var(--arr-fonte), 4.3cqw); }
.aula-live-lousa .aula-linha__peca--antes { padding-left: .32em; }
.aula-live-lousa .aula-linha__peca--depois { padding-right: .32em; }
.aula-live-lousa .aula-linha__dest { position: relative; display: flex; flex: 0 0 auto; color: var(--cor); }
.aula-live-lousa .aula-linha__dest .aula-linha__peca { color: var(--cor); }
.aula-live-lousa .aula-chave { position: absolute; left: 1px; right: 1px; top: 100%; height: 9px; margin-top: 2px;
  border: 2px solid var(--cor); border-top: 0; border-radius: 0 0 8px 8px; }
.aula-live-lousa .aula-linha__regra { position: absolute; top: 100%; left: calc(100% + 12px); margin-top: 0; white-space: nowrap;
  font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .85); line-height: 1.2; color: var(--cor); }
.aula-live-lousa .aula-arr--numeros-expressao_camadas[data-modo="celular"] .aula-camadas { padding-right: 0; }
.aula-live-lousa .aula-arr--numeros-expressao_camadas[data-modo="celular"] .aula-linha__regra { left: 0; top: calc(100% + 14px); }
.aula-live-lousa .aula-arr--numeros-expressao_camadas[data-modo="celular"] .aula-linha--com-chave {
  padding-bottom: calc(var(--arr-fonte) * 2 + 16px); }

/* N1b. id0335: EXPRESSÕES passo a passo (expressao_camadas, conta_adicao ... conta_decimal, expressao_mista): a sub-conta num
   retângulo, o desenho que a resolve abaixo e à direita (sem moldura), o resultado circulado e as setas medidas (.xp-setas) */
.aula-live-lousa .aula-arr--numeros-expressao_camadas.aula-xp,
.aula-live-lousa .aula-arr--numeros-conta_adicao, .aula-live-lousa .aula-arr--numeros-conta_subtracao,
.aula-live-lousa .aula-arr--numeros-conta_multiplicacao, .aula-live-lousa .aula-arr--numeros-conta_divisao,
.aula-live-lousa .aula-arr--numeros-conta_potencia, .aula-live-lousa .aula-arr--numeros-conta_raiz,
.aula-live-lousa .aula-arr--numeros-conta_fracao, .aula-live-lousa .aula-arr--numeros-conta_decimal,
.aula-live-lousa .aula-arr--numeros-expressao_mista { display: block; font-size: var(--arr-fonte); }
.aula-live-lousa .aula-xp .xp-col { display: flex; flex-direction: column; align-items: flex-start; max-width: 100%; padding-left: 2px; }
.aula-live-lousa .aula-xp .xp-linha { display: flex; max-width: 100%; padding: 2px 0; }
.aula-live-lousa .aula-xp .xp-linha__texto { align-items: center; }
.aula-live-lousa .aula-xp .xp-trecho { display: inline-flex; flex: 0 0 auto; align-items: center; padding: 1px 6px;
  border: 2.5px solid var(--xp-cor); border-radius: 6px; }
.aula-live-lousa .aula-xp .xp-volta { color: var(--xp-volta); font-weight: 700; }
.aula-live-lousa .aula-xp .xp-final { display: inline-flex; flex: 0 0 auto; align-items: center; padding: 1px 8px;
  border: 2.5px solid var(--giz-amarelo); border-radius: 6px; }
.aula-live-lousa .aula-xp .xp-lado { display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
  margin: 20px 0 22px 2.2em; max-width: calc(100% - 2.2em); min-width: 0; }
.aula-live-lousa .aula-xp .xp-h { display: flex; flex-wrap: nowrap; align-items: center; gap: .3em .45em; max-width: 100%; min-width: 0; }
.aula-live-lousa .aula-xp .xp-h > * { flex: 0 0 auto; }
.aula-live-lousa .aula-xp .xp-h > svg.xp-svg, .aula-live-lousa .aula-xp .xp-h > .xp-v { flex: 0 1 auto; min-width: 0; }
.aula-live-lousa .aula-xp .xp-v { display: flex; flex-direction: column; align-items: flex-start; gap: .3em; max-width: 100%; min-width: 0; }
.aula-live-lousa .aula-xp .xp-v.xp-h, .aula-live-lousa .aula-xp .xp-h > .xp-v { align-items: center; }
.aula-live-lousa .aula-xp svg.xp-svg { position: static; display: block; flex: 0 1 auto; max-width: 100%; height: auto; overflow: visible; }
.aula-live-lousa .aula-xp .aula-arr__txt { font-size: var(--arr-fonte); }
.aula-live-lousa .aula-xp .xp-rot { font-size: calc(var(--arr-fonte) * .82); }
.aula-live-lousa .aula-xp .xp-lado .aula-arr__txt .fig-solution__line { white-space: nowrap; }   /* no desenho, a conta não quebra: quem encolhe é o svg */
.aula-live-lousa .aula-xp .xp-fb > * { flex: 0 0 auto; }
.aula-live-lousa .aula-xp .xp-fb > svg.xp-svg { flex: 0 1 auto; min-width: 0; }
.aula-live-lousa .aula-xp .xp-apagado { opacity: .55; }
.aula-live-lousa .aula-xp span.xp-res { display: inline-flex; align-items: center; justify-content: center; min-width: 1.7em;
  padding: 0 .4em; border: 2.5px solid var(--xp-cor); border-radius: 999px; }
.aula-live-lousa .aula-xp .xp-grade { display: grid; align-items: center; font-family: var(--font-calc); font-size: var(--arr-fonte);
  line-height: 1.3; max-width: 100%; }
.aula-live-lousa .aula-xp .xp-grade__c { text-align: center; grid-row-end: span 1; }
.aula-live-lousa .aula-xp .xp-grade__c--risca { border-bottom: 2px solid var(--quadro-giz); }
.aula-live-lousa .aula-xp .xp-grade__risco { height: 0; margin: 2px 0; border-top: 2.5px solid var(--quadro-giz); }
.aula-live-lousa .aula-xp span.xp-res--anel { align-self: stretch; justify-self: stretch; min-width: 0; margin: 0 -.3em; padding: 0; }
.aula-live-lousa .aula-xp .xp-chave__divisor { align-self: stretch; display: flex; align-items: center; margin-left: .35em; padding: 0 .45em;
  border-left: 2.5px solid var(--quadro-giz); border-bottom: 2.5px solid var(--quadro-giz); }
.aula-live-lousa .aula-xp .xp-chave__q { justify-self: start; margin: 4px 0 0 .55em; }
.aula-live-lousa .aula-xp .xp-fat { display: flex; flex-direction: column; align-items: center; }
.aula-live-lousa .aula-xp .xp-fat__chave { display: block; width: 100%; height: 9px; border: 2px solid var(--xp-cor); border-top: 0;
  border-radius: 0 0 8px 8px; }
.aula-live-lousa .aula-xp .xp-fb { display: flex; align-items: center; gap: .4em; max-width: 100%; min-width: 0; }
.aula-live-lousa .aula-xp .xp-fb > .xp-op { min-width: 1.3em; }
.aula-live-lousa .aula-xp .xp-chip { display: inline-block; width: .8em; height: .8em; border-radius: 2px; background: var(--cor); opacity: .6; }
.aula-live-lousa .aula-xp .xp-setas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
/* id0344: esboços do Beny (vírgula riscada, "×10", chave de decimais, 2 ÷ 1/4, distributiva) */
.aula-live-lousa .aula-xp .xp-grade__c--virg { position: relative; }
.aula-live-lousa .aula-xp .xp-grade__c--virg::after { content: ","; position: absolute; right: -.16em; bottom: -.18em; line-height: 1; font-size: 1.2em;
  font-weight: 700; color: var(--giz-vermelho); }
.aula-live-lousa .aula-xp .xp-grade__c--virg::before { content: ""; position: absolute; right: -.02em; bottom: -.14em; height: .62em;
  border-left: 2.5px solid var(--giz-vermelho); border-radius: 2px; transform: rotate(35deg); }
.aula-live-lousa .aula-xp .xp-chave__divisor .xp-grade__c { display: inline-block; width: .64em; }
.aula-live-lousa .aula-xp .xp-colchete { align-self: stretch; margin: .4em .1em .4em 0; border: 2.5px solid var(--giz-amarelo);
  border-left: 0; border-radius: 0 .7em .7em 0; }
.aula-live-lousa .aula-xp .xp-nota { max-width: 9.5em; line-height: 1.15; }
.aula-live-lousa .aula-xp .xp-nota .fig-solution__line, .aula-live-lousa .aula-xp .xp-lado .xp-nota .fig-solution__line { white-space: normal; }
.aula-live-lousa .aula-xp .xp-mult { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .78); padding-left: .35em; white-space: nowrap; }
.aula-live-lousa .aula-xp .xp-junto { gap: .12em; }
.aula-live-lousa .aula-xp .xp-apos-seta { margin-top: 1.6em; }
.aula-live-lousa .aula-xp .xp-sinal { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5em; height: 1.5em;
  border: 2.5px solid var(--sinal, var(--quadro-giz)); border-radius: 50%; }
.aula-live-lousa .aula-xp .xp-recuo { padding: .5em 0 .5em 2.8em; }
.aula-live-lousa .aula-xp .xp-depois { margin-top: .5em; }
/* id0345: o subtítulo acima de um exemplo; id0364: o assunto (escrito pelo modelo), no giz da lousa */
.aula-live-lousa .aula-exemplo__rotulo { margin: 0 0 6px; font: inherit; font-family: var(--font-calc); font-size: 1.05em; font-weight: 700; color: var(--giz-amarelo);
  text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }

/* N2. padrao_regra: linhas alinhadas pelo "=", a seta vertical à direita com o padrão ao lado; a revelação continua as linhas */
.aula-live-lousa .aula-arr--numeros-padrao_regra { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-padrao { --off: 0; display: grid; grid-template-columns: auto auto auto 34px auto; column-gap: 0;
  row-gap: 4px; align-items: center; max-width: 100%; }
.aula-live-lousa .aula-padrao__cel { grid-row: calc(var(--gr) + var(--off)); padding: 2px 6px; min-width: 0; }
.aula-live-lousa .aula-padrao__cel--e { grid-column: 1; text-align: right; justify-self: end; }
.aula-live-lousa .aula-padrao__cel--igual { grid-column: 2; }
.aula-live-lousa .aula-padrao__cel--d { grid-column: 3; text-align: left; justify-self: start; }
.aula-live-lousa .aula-padrao__cel--toda { grid-column: 1 / 4; justify-self: center; }
.aula-live-lousa .aula-padrao__cel.aula-papel-final { padding-block: 4px; }
.aula-live-lousa .aula-padrao__cel--e.aula-papel-final { border-radius: 8px 0 0 8px; }
.aula-live-lousa .aula-padrao__cel--d.aula-papel-final { border-radius: 0 8px 8px 0; }
.aula-live-lousa .aula-padrao__seta { grid-column: 4; grid-row: calc(1 + var(--off)) / span var(--n); justify-self: center;
  align-self: stretch; position: relative; width: 0; border-left: 3px solid var(--arr-traco); margin: 6px 0 4px; }
.aula-live-lousa .aula-padrao__seta::after { content: ""; position: absolute; left: -9.5px; bottom: -3px; width: 0; height: 0;
  border: 8px solid transparent; border-top: 12px solid var(--arr-traco); border-bottom: 0; }
.aula-live-lousa .aula-padrao__label { grid-column: 5; grid-row: calc(1 + var(--off)) / span var(--n); align-self: center;
  max-width: 10em; padding-left: 8px; }
.aula-live-lousa .aula-arr--numeros-padrao_regra[data-modo="celular"] .aula-padrao { --off: 1; grid-template-columns: auto auto auto 28px; }
.aula-live-lousa .aula-arr--numeros-padrao_regra[data-modo="celular"] .aula-padrao__label { grid-column: 1 / -1; grid-row: 1;
  max-width: none; text-align: center; padding: 0 0 6px; }

/* N3. listas_encontro: uma linha por lista (nome, números igualmente espaçados, "…"); o encontro circulado em todas */
.aula-live-lousa .aula-arr--numeros-listas_encontro { display: flex; flex-direction: column; align-items: stretch; gap: 14px;
  max-width: 820px; margin-inline: auto; }
.aula-live-lousa .aula-lista { display: grid; grid-template-columns: 11em minmax(0, 1fr); column-gap: 14px;
  align-items: center; }
.aula-live-lousa .aula-lista__nums { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); text-align: center; }
.aula-live-lousa .aula-num { justify-self: center; padding: 1px .55em; border: 2px solid transparent; border-radius: 999px; min-width: 0; }
.aula-live-lousa .aula-num--encontro { border-color: var(--giz-amarelo); font-weight: 700; }
.aula-live-lousa .aula-lista__conclusao { align-self: center; text-align: center; padding: 4px 18px; margin-top: 4px; }
@container arr (max-width: 560px) {
  .aula-live-lousa .aula-lista { grid-template-columns: minmax(0, 1fr); row-gap: 4px; }
}
.aula-live-lousa .aula-arr--numeros-listas_encontro[data-modo="celular"] .aula-lista { grid-template-columns: minmax(0, 1fr); row-gap: 4px; }
.aula-live-lousa .aula-arr--numeros-listas_encontro[data-modo="celular"] .aula-lista__nums { display: flex; flex-wrap: wrap;
  gap: 4px 2px; justify-content: flex-start; }
.aula-live-lousa .aula-arr--numeros-listas_encontro[data-modo="celular"] .aula-num { min-width: 2.4em; text-align: center; }

/* N4. ida_volta: início e fim na mesma linha; arco por cima (ida) e por baixo (volta), pintados pelo SVG medido */
.aula-live-lousa .aula-arr--numeros-ida_volta { display: grid; justify-content: center; align-items: center;
  grid-template-columns: auto auto; column-gap: calc(var(--arr-seta) * 1.3); row-gap: 0;
  grid-template-areas: "ida ida" "esp1 esp1" "ini fim" "esp2 esp2" "volta volta" "con con"; }
.aula-live-lousa .aula-arr--numeros-ida_volta .aula-a-ida, .aula-live-lousa .aula-arr--numeros-ida_volta .aula-a-volta { justify-self: center; }
.aula-live-lousa .aula-arr--numeros-ida_volta .aula-a-ida { grid-area: ida; } .aula-live-lousa .aula-arr--numeros-ida_volta .aula-a-volta { grid-area: volta; }
.aula-live-lousa .aula-arr--numeros-ida_volta .aula-a-esp1 { grid-area: esp1; } .aula-live-lousa .aula-arr--numeros-ida_volta .aula-a-esp2 { grid-area: esp2; }
.aula-live-lousa .aula-arr--numeros-ida_volta .aula-a-ini { grid-area: ini; } .aula-live-lousa .aula-arr--numeros-ida_volta .aula-a-fim { grid-area: fim; }
.aula-live-lousa .aula-iv__espaco { height: 58px; }
/* id0284: o nó tem a largura do PRÓPRIO número, centrado na coluna (o rótulo do arco, que ocupa as duas colunas, as
   alarga; esticado, o nó punha o número à esquerda e a seta, que sai do centro do nó, ficava longe dele) */
.aula-live-lousa .aula-iv__no { font-size: 1.35em; padding: 2px 4px; justify-self: center; text-align: center; }
.aula-live-lousa .aula-iv__rotulo { white-space: nowrap; }
.aula-live-lousa .aula-arr--numeros-ida_volta .aula-a-con { justify-self: center; margin-top: 14px; }
.aula-live-lousa .aula-arr--numeros-ida_volta[data-modo="celular"] { column-gap: 56px; }
.aula-live-lousa .aula-arr--numeros-ida_volta[data-modo="celular"] .aula-iv__espaco { height: 44px; }
.aula-live-lousa .aula-arr--numeros-ida_volta[data-modo="celular"] .aula-iv__no { font-size: 1.15em; }

/* N5. tabela_regra: tabela com bordas; o canto e os cabeçalhos em destaque */
.aula-live-lousa .aula-arr--numeros-tabela_regra { display: flex; justify-content: center; }
.aula-live-lousa .aula-tabela { border-collapse: collapse; table-layout: fixed; width: 100%; max-width: 640px; }
.aula-live-lousa .aula-tabela th, .aula-live-lousa .aula-tabela td { border: 2px solid var(--quadro-giz); padding: 8px 10px;
  text-align: center; vertical-align: middle; overflow-wrap: anywhere; font-weight: 400; }
.aula-live-lousa .aula-tabela th { font-weight: 700; background: color-mix(in srgb, var(--arr-traco) 12%, transparent); }
.aula-live-lousa .aula-tabela .aula-arr__txt { text-align: center; }
.aula-live-lousa .aula-arr--numeros-tabela_regra[data-modo="celular"] .aula-tabela--larga { font-size: .85em; }
.aula-live-lousa .aula-arr--numeros-tabela_regra[data-modo="celular"] .aula-tabela th,
.aula-live-lousa .aula-arr--numeros-tabela_regra[data-modo="celular"] .aula-tabela td { padding: 6px 3px; }
/* Nicho Números, cobertura v2 (N6 a N11) */
/* Peças comuns: fração empilhada, trilho (linha com espaço para arcos por cima e por baixo) e rótulo de arco */
.aula-live-lousa .aula-fr { display: inline-flex; flex-direction: column; align-items: center; min-width: 0; }
.aula-live-lousa .aula-fr.aula-papel-final { padding: 2px 10px; border-radius: 8px; }
.aula-live-lousa .aula-fr__n, .aula-live-lousa .aula-fr__d { padding: 0 .3em; }
.aula-live-lousa .aula-fr__barra { align-self: stretch; border-top: 2px solid var(--quadro-giz); margin: 2px 0; }
.aula-live-lousa .aula-op { padding: 0 .1em; }
.aula-live-lousa .aula-trilho { display: grid; grid-template-columns: repeat(var(--n), auto); justify-content: center;
  align-items: center; column-gap: .5em; max-width: 100%; }
.aula-live-lousa .aula-trilho > * { grid-row: 2; min-width: 0; }
.aula-live-lousa .aula-trilho > .aula-trilho__esp { grid-column: 1 / -1; position: relative; height: 54px; }
.aula-live-lousa .aula-trilho > .aula-trilho__esp--cima { grid-row: 1; margin-top: 1.9em; }
.aula-live-lousa .aula-trilho > .aula-trilho__esp--baixo { grid-row: 3; margin-bottom: 1.9em; }
.aula-live-lousa .aula-trilho .aula-arr__txt { font-size: min(var(--arr-fonte), calc(135cqw / var(--chars, 14))); }
.aula-live-lousa .aula-trilho, .aula-live-lousa .aula-trilho * { white-space: nowrap; overflow-wrap: normal; }
.aula-live-lousa .aula-mt__div > * { flex: 0 0 auto; }
.aula-live-lousa .aula-arranjo .aula-arco__rotulo { position: absolute; left: 50%; transform: translateX(-50%); white-space: nowrap;
  overflow-wrap: normal; }
.aula-live-lousa .aula-arranjo .aula-arco__rotulo { width: max-content; }
.aula-live-lousa .aula-arranjo .aula-arco__rotulo .fig-solution__line { white-space: nowrap; overflow-wrap: normal; }
.aula-live-lousa .aula-trilho__esp--cima .aula-arco__rotulo, .aula-live-lousa .aula-dc__esp--cima .aula-arco__rotulo { bottom: calc(100% + 2px); }
.aula-live-lousa .aula-trilho__esp--baixo .aula-arco__rotulo, .aula-live-lousa .aula-dc__esp .aula-arco__rotulo { top: calc(100% + 2px); }

/* N6. fracao_operacao: as frações lado a lado; um arco liga os numeradores e outro os denominadores até o resultado */
.aula-live-lousa .aula-arr--numeros-fracao_operacao { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.aula-live-lousa .aula-fo__vao { width: 3.4em; }

/* N7. mesma_transformacao: estados com "=" entre eles; a mesma operação por cima e por baixo */
.aula-live-lousa .aula-arr--numeros-mesma_transformacao { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.aula-live-lousa .aula-mt__div { display: inline-flex; align-items: baseline; gap: .35em; padding: 2px 8px; border-radius: 8px; }
.aula-live-lousa .aula-mt__div.aula-papel-final { padding: 2px 10px; }

/* N8. porcentagem_blocos: tabela porcentagem | valor; o "como" à esquerda, ligado por arcos à linha do 100% */
.aula-live-lousa .aula-arr--numeros-porcentagem_blocos { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.aula-live-lousa .aula-pb { display: grid; grid-template-columns: 3.4em auto auto auto; column-gap: 12px; row-gap: 8px;
  align-items: center; max-width: 100%; }
.aula-live-lousa .aula-pb__tira { grid-column: 1; align-self: stretch; }
.aula-live-lousa .aula-pb__como { grid-column: 2; justify-self: end; text-align: right; }
.aula-live-lousa .aula-pb__pct { grid-column: 3; } .aula-live-lousa .aula-pb__valor { grid-column: 4; }
.aula-live-lousa .aula-pb__cel { padding: 2px 14px; border: 2px solid transparent; border-radius: 999px; text-align: center; }
.aula-live-lousa .aula-pb__cel--usado { border-color: var(--giz-amarelo); font-weight: 700; }
.aula-live-lousa .aula-pb__resposta { padding: 4px 18px; border-radius: 8px; }
.aula-live-lousa .aula-arr--numeros-porcentagem_blocos[data-modo="celular"] .aula-pb { grid-template-columns: auto auto auto; }
.aula-live-lousa .aula-arr--numeros-porcentagem_blocos[data-modo="celular"] .aula-pb__tira { display: none; }
.aula-live-lousa .aula-arr--numeros-porcentagem_blocos[data-modo="celular"] .aula-pb__pct { grid-column: 1; }
.aula-live-lousa .aula-arr--numeros-porcentagem_blocos[data-modo="celular"] .aula-pb__valor { grid-column: 2; }
.aula-live-lousa .aula-arr--numeros-porcentagem_blocos[data-modo="celular"] .aula-pb__como { grid-column: 3; justify-self: start; text-align: left; }

/* N9. decimal_casas: a conta no topo; a conta armada à esquerda e a contagem à direita; o resultado com a vírgula andando */
.aula-live-lousa .aula-arr--numeros-decimal_casas { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-dc__meio { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 20px; align-items: center;
  width: 100%;
  justify-content: center; max-width: 100%; }
.aula-live-lousa .aula-dc__contagem { display: grid; grid-template-columns: auto auto; column-gap: 12px; row-gap: 6px; align-items: center;
  justify-content: start; }
.aula-live-lousa .aula-dc__contagem .aula-arr__txt { font-size: calc(var(--arr-fonte) * .85); }
.aula-live-lousa .aula-dc__total { grid-column: 1 / -1; display: flex; align-items: baseline; gap: 10px;
  border-top: 2px solid var(--arr-traco); padding-top: 6px; margin-top: 2px; }
.aula-live-lousa .aula-dc__fim { display: flex; flex-direction: column; align-items: center; gap: 4px; max-width: 100%; }
.aula-live-lousa .aula-dc__res { display: flex; align-items: baseline; gap: .4em; padding: 4px 16px; border-radius: 8px; max-width: 100%; }
.aula-live-lousa .aula-dc__digitos { white-space: pre; }
.aula-live-lousa .aula-dc__esp { position: relative; align-self: stretch; height: 40px; margin-bottom: 1.9em; }
.aula-live-lousa .aula-arr--numeros-decimal_casas .aula-caixa,
.aula-live-lousa .aula-arr--numeros-fatora_agrupa .aula-caixa { width: 100%; max-width: 360px; height: auto; aspect-ratio: 360 / 260; }
.aula-live-lousa .aula-arr--numeros-decimal_casas[data-modo="celular"] .aula-dc__meio { grid-template-columns: minmax(0, 1fr); row-gap: 14px; }
.aula-live-lousa .aula-arr--numeros-decimal_casas[data-modo="celular"] .aula-caixa { justify-self: center; }
.aula-live-lousa .aula-arr--numeros-decimal_casas[data-modo="celular"] .aula-dc__contagem { justify-self: center; }

/* N10. fatora_agrupa: a escada à esquerda; cada grupo numa caixa com uma seta até o que sai; a sobra dentro da raiz */
.aula-live-lousa .aula-arr--numeros-fatora_agrupa { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-fa__meio { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); column-gap: 20px; align-items: center;
  width: 100%;
  justify-content: center; max-width: 100%; }
.aula-live-lousa .aula-fa__grupos { display: grid; grid-template-columns: auto 64px auto; row-gap: 10px; align-items: center; }
.aula-live-lousa .aula-fa__box { border: 2px solid var(--arr-traco); border-radius: 10px; padding: 2px 12px; justify-self: start; }
.aula-live-lousa .aula-fa__box--resto { border-style: dashed; }
.aula-live-lousa .aula-fa__sai { font-weight: 700; color: var(--giz-amarelo); }
.aula-live-lousa .aula-fa__sobra { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; margin-top: 4px; }
.aula-live-lousa .aula-raiz { display: inline-flex; align-items: flex-start; }
.aula-live-lousa .aula-raiz__ind { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .6); margin-right: -.35em; }
.aula-live-lousa .aula-raiz__sinal { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 1.7); line-height: 1; }
.aula-live-lousa .aula-raiz__corpo { border-top: 2px solid var(--quadro-giz); margin-top: .2em; padding: 0 .35em; }
.aula-live-lousa .aula-fa__resultado { padding: 4px 18px; border-radius: 8px; }
.aula-live-lousa .aula-arr--numeros-fatora_agrupa[data-modo="celular"] .aula-fa__meio { grid-template-columns: minmax(0, 1fr); row-gap: 14px; }
.aula-live-lousa .aula-arr--numeros-fatora_agrupa[data-modo="celular"] .aula-caixa { justify-self: center; }
.aula-live-lousa .aula-arr--numeros-fatora_agrupa[data-modo="celular"] .aula-fa__grupos { justify-self: center; }

/* N11. expandir_contar: expressão, por extenso com uma chave sob cada grupo de fatores, forma compacta e a regra */
.aula-live-lousa .aula-arr--numeros-expandir_contar { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-ec__linha { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; max-width: 100%; }
.aula-live-lousa .aula-ec__linha .aula-arr__txt { font-size: min(var(--arr-fonte), 4.2cqw); }
.aula-live-lousa .aula-ec__linha--solta { flex-direction: column; align-items: center; }
.aula-live-lousa .aula-ec__compacto { width: fit-content; padding: 2px 14px; border-radius: 8px; }
.aula-live-lousa .aula-ec__grupo { display: flex; flex-direction: column; align-items: center; color: var(--cor); }
.aula-live-lousa .aula-ec__grupo .aula-linha__peca { color: var(--cor); }
.aula-live-lousa .aula-ec__chave { align-self: stretch; height: 9px; margin: 2px 1px 0; border: 2px solid var(--cor); border-top: 0;
  border-radius: 0 0 8px 8px; }
.aula-live-lousa .aula-ec__rotulo { font-family: var(--font-calc); font-size: max(11px, min(calc(var(--arr-fonte) * .85), 3.4cqw)); line-height: 1.2; white-space: nowrap; }
.aula-live-lousa .aula-ec__rotulo--solto { margin-top: 4px; }
.aula-live-lousa .aula-ec__regra { border: 2px solid var(--giz-amarelo); border-radius: 10px; padding: 6px 16px; text-align: center; }
/* Nicho Números, arranjos novos (agente-numeros). Cores de função: A azul, B laranja, C verde; amarelo = ponto de partida
   (a interseção, o passo 1); verde = o resultado; vermelho = o que não pertence. Classes aula-nm__*, todas sob .aula-live-lousa. */
/* [[agente-numeros: seletores]] */
.aula-live-lousa .aula-arr--numeros-venn_tres,
.aula-live-lousa .aula-arr--numeros-venn_pesquisa,
.aula-live-lousa .aula-arr--numeros-venn_uniao,
.aula-live-lousa .aula-arr--numeros-venn_operacoes,
.aula-live-lousa .aula-arr--numeros-venn_elementos,
.aula-live-lousa .aula-arr--numeros-conjunto_subconjunto,
.aula-live-lousa .aula-arr--numeros-conjunto_pertinencia,
.aula-live-lousa .aula-arr--numeros-geratriz,
.aula-live-lousa .aula-arr--numeros-fracao_decimal_cem,
.aula-live-lousa .aula-arr--numeros-decimal_alinhar,
.aula-live-lousa .aula-arr--numeros-fracao_de_quantidade,
.aula-live-lousa .aula-arr--numeros-fracao_soma_igual_den,
.aula-live-lousa .aula-arr--numeros-fracao_tres_sentidos,
.aula-live-lousa .aula-arr--numeros-juros_comparar,
.aula-live-lousa .aula-arr--numeros-juros_compostos,
.aula-live-lousa .aula-arr--numeros-juros_simples,
.aula-live-lousa .aula-arr--numeros-lucro_prejuizo,
.aula-live-lousa .aula-arr--numeros-pct_sucessivos,
.aula-live-lousa .aula-arr--numeros-fator_multiplicativo,
.aula-live-lousa .aula-arr--numeros-pct_barra,
.aula-live-lousa .aula-arr--numeros-reta_conjuntos,
.aula-live-lousa .aula-arr--numeros-conjuntos_numericos,
.aula-live-lousa .aula-arr--numeros-valor_posicional,
.aula-live-lousa .aula-arr--numeros-significado_operacao,
.aula-live-lousa .aula-arr--numeros-notacao_cientifica,
.aula-live-lousa .aula-arr--numeros-expoente_fracionario,
.aula-live-lousa .aula-arr--numeros-qtd_divisores,
.aula-live-lousa .aula-arr--numeros-criterio_divisibilidade,
.aula-live-lousa .aula-arr--numeros-divisibilidade_grade,
.aula-live-lousa .aula-nm { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-nm__svg { position: static; inset: auto; overflow: visible; color: var(--quadro-giz); }
.aula-live-lousa .aula-nm__fig { width: 100%; }
.aula-live-lousa .aula-nm__fig > svg { max-width: calc(var(--w) * 1.3px); }
.aula-live-lousa .aula-nm__cor, .aula-live-lousa .aula-nm__cor .fig-solution { color: var(--cor); }
.aula-live-lousa .aula-nm__final { padding: 4px 18px; border-radius: 8px; width: fit-content; max-width: 100%; }
.aula-live-lousa .aula-nm__final .aula-arr__txt { text-align: center; }
.aula-live-lousa .aula-nm .aula-es__num { color: var(--cor); font-weight: 700; }
/* a figura e o texto lado a lado quando há largura; senão, um embaixo do outro */
.aula-live-lousa .aula-nm__duas { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; width: 100%; justify-items: center; align-items: center; }
@container arr (min-width: 720px) {
  .aula-live-lousa .aula-nm__duas { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
  .aula-live-lousa .aula-nm__duas--figura { grid-template-columns: minmax(0, 468px) auto; justify-content: center; column-gap: 40px; }
}
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__duas { grid-template-columns: minmax(0, 1fr); }
/* N12. venn_operacoes: as definições dos conjuntos e uma figura pequena por operação */
.aula-live-lousa .aula-nm__defs { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px 26px; max-width: 100%; }
.aula-live-lousa .aula-nm__ops { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; width: 100%; max-width: 600px; }
.aula-live-lousa .aula-nm__ops[data-n="3"] { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 680px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__ops[data-n="3"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__ops[data-n="3"] > :last-child { grid-column: 1 / -1; justify-self: center; max-width: 50%; }
.aula-live-lousa .aula-nm__op { display: flex; flex-direction: column; align-items: center; gap: 2px; margin: 0; min-width: 0; }
.aula-live-lousa .aula-nm__op .aula-nm__fig > svg { max-width: 100%; }
.aula-live-lousa .aula-nm__opres { text-align: center; max-width: 100%; }
.aula-live-lousa .aula-nm__opres .aula-arr__txt { font-size: calc(var(--arr-fonte) * .9); text-align: center; }
/* N13. venn_uniao: três barras alinhadas (a interseção nas duas primeiras, uma vez só na união) */
.aula-live-lousa .aula-nm__barras { display: flex; flex-direction: column; gap: 10px; width: 100%; min-width: 0; }
.aula-live-lousa .aula-nm__barra { display: grid; grid-template-columns: minmax(4.5em, 6.5em) minmax(0, 1fr); column-gap: 10px; align-items: center; }
.aula-live-lousa .aula-nm__barra-rot { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.1; min-width: 0; text-align: right; }
.aula-live-lousa .aula-nm__barra-nome, .aula-live-lousa .aula-nm__barra-nome .fig-solution { font-size: calc(var(--arr-fonte) * .85); color: var(--cor); }
.aula-live-lousa .aula-nm__barra-rot .aula-arr__conta { font-weight: 700; }
.aula-live-lousa .aula-nm__barra-trilho { display: flex; gap: 2px; height: 2.3em; min-width: 0; }
.aula-live-lousa .aula-nm__seg { display: flex; align-items: center; justify-content: center; min-width: 1.9em; min-height: 0; overflow: hidden;
  border: 2px solid var(--cor); background: color-mix(in srgb, var(--cor) 30%, transparent); border-radius: 6px; }
.aula-live-lousa .aula-nm__seg--vazio { border-color: transparent; background: none; }
.aula-live-lousa .aula-nm__seg .aula-arr__txt { font-size: calc(var(--arr-fonte) * .95); width: 100%; text-align: center; }
.aula-live-lousa .aula-nm__seg { min-width: 2.7em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__barra { grid-template-columns: minmax(0, 1fr); row-gap: 2px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__barra-rot { flex-direction: row; flex-wrap: wrap; align-items: baseline; justify-content: flex-start; gap: 0 .6em; text-align: left; }
.aula-live-lousa .aula-nm__barra-rot > * { flex: 0 1 auto; max-width: 100%; }
.aula-live-lousa .aula-nm__barra-rot .aula-arr__conta { flex: none; }
/* N14 e N15. venn_pesquisa e venn_tres: a lista dos passos (a bolinha é a do diagrama) */
.aula-live-lousa .aula-nm__passos { display: flex; flex-direction: column; gap: 8px; width: 100%; min-width: 0; }
.aula-live-lousa .aula-nm__passo { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
.aula-live-lousa .aula-nm__ordem { flex: none; box-sizing: border-box; width: 1.55em; height: 1.55em; margin-top: .15em; border-radius: 50%; border: 2px solid var(--cor);
  display: flex; align-items: center; justify-content: center; font-family: var(--font-calc); font-size: .85em; line-height: 1; color: var(--cor); }
.aula-live-lousa .aula-nm__passo-txt { min-width: 0; }
.aula-live-lousa .aula-nm__passo .aula-nm__regiao { color: var(--cor); font-size: calc(var(--arr-fonte) * .85); text-align: left; }
.aula-live-lousa .aula-nm__passo .aula-arr__conta { font-size: calc(var(--arr-fonte) * .95); }
/* N16 e N17. conjunto_pertinencia e conjunto_subconjunto: a figura e as relações escritas (∈ ∉ ⊂ ⊄) na cor do que dizem */
.aula-live-lousa .aula-nm__relacoes { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; }
.aula-live-lousa .aula-nm__relacao .aula-arr__conta { font-size: calc(var(--arr-fonte) * 1.1); font-weight: 700; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__relacoes { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 4px 22px; }
/* N18. geratriz: as linhas alinhadas pela vírgula, a cauda que se repete em laranja (igual nas duas, por isso some na subtração) */
.aula-live-lousa .aula-nm__dz { display: grid; grid-template-columns: auto auto auto auto auto auto; column-gap: .35em; row-gap: 2px;
  align-items: baseline; justify-content: center; max-width: 100%; padding-top: 8px; font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 1.15); }
.aula-live-lousa .aula-nm__dz-op, .aula-live-lousa .aula-nm__dz-rot, .aula-live-lousa .aula-nm__dz-int { text-align: right; }
.aula-live-lousa .aula-nm__dz-frac, .aula-live-lousa .aula-nm__dz-dif { text-align: left; }
.aula-live-lousa .aula-nm__dz-dif { font-weight: 700; }
.aula-live-lousa .aula-nm__cauda { color: var(--giz-cauda, color-mix(in srgb, var(--giz-amarelo) 62%, var(--giz-vermelho))); border-top: 2px solid currentColor; padding: 0 .05em; }
.aula-live-lousa .aula-nm__dz-aviso { grid-column: 1 / -1; height: 8px; }
.aula-live-lousa .aula-nm__dz-barra { grid-column: 1 / -1; border-top: 2px solid var(--quadro-giz); margin: 2px 0; }
.aula-live-lousa .aula-nm__gera .aula-arr__txt { text-align: center; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__dz { font-size: calc(var(--arr-fonte) * .95); column-gap: .22em; }
/* N19. fracao_decimal_cem: o quadro de 100 e as três formas */
.aula-live-lousa .aula-arr--numeros-fracao_decimal_cem .aula-nm__fig > svg { max-width: 260px; }
.aula-live-lousa .aula-arr--numeros-fracao_decimal_cem .aula-trilho .aula-arr__txt { font-size: min(calc(var(--arr-fonte) * 1.2), calc(135cqw / var(--chars, 14))); }
/* N20. decimal_alinhar: a conta armada, uma coluna por algarismo e a da vírgula em amarelo */
.aula-live-lousa .aula-nm__al { position: relative; display: grid; grid-template-columns: 1.7em repeat(var(--ni), .74em) .42em repeat(var(--nf), .74em);
  row-gap: 0; align-items: stretch; justify-content: center; font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 1.55); max-width: 100%; }
.aula-live-lousa .aula-nm__al-c { text-align: center; line-height: 1.25; min-height: 1.25em; }
.aula-live-lousa .aula-nm__al-op { text-align: left; font-weight: 700; }
.aula-live-lousa .aula-nm__al-zero { color: var(--giz-cauda, color-mix(in srgb, var(--giz-amarelo) 62%, var(--giz-vermelho))); }
.aula-live-lousa .aula-nm__al-v { background: color-mix(in srgb, var(--giz-amarelo) 24%, transparent); }
.aula-live-lousa .aula-nm__al-barra { grid-column: 1 / -1; border-top: 3px solid var(--quadro-giz); margin: 2px 0; }
.aula-live-lousa .aula-nm__al-linha { display: grid; grid-column: 1 / -1; grid-template-columns: subgrid; }
.aula-live-lousa .aula-nm__al-linha.aula-papel-final { border-radius: 8px; }
/* N21. fracao_de_quantidade: a barra do total em partes iguais (verde), as que a fração pega em azul */
.aula-live-lousa .aula-nm__qt { display: flex; flex-direction: column; align-items: center; gap: 4px; width: 100%; max-width: 560px; }
.aula-live-lousa .aula-nm__qt-topo { display: flex; flex-direction: column; align-items: center; width: 100%; }
.aula-live-lousa .aula-nm__qt-chave { align-self: stretch; height: 10px; border: 2px solid var(--quadro-giz); border-bottom: 0; border-radius: 6px 6px 0 0; }
.aula-live-lousa .aula-nm__qt-cels { display: grid; grid-template-columns: repeat(var(--den), minmax(0, 1fr)); gap: 4px; width: 100%; }
.aula-live-lousa .aula-nm__qt-cel { display: flex; align-items: center; justify-content: center; min-height: 2.6em; min-width: 0; border: 2px solid var(--giz-verde); border-radius: 6px; }
.aula-live-lousa .aula-nm__qt-cel--pega { border-color: var(--giz-azul); background: color-mix(in srgb, var(--giz-azul) 30%, transparent); }
.aula-live-lousa .aula-nm__qt-cel .aula-arr__txt { font-size: max(11px, min(calc(var(--arr-fonte) * .95), calc(100cqw / (var(--den) * 3.1)))); text-align: center; }
.aula-live-lousa .aula-nm__qt-cel .fig-solution__line { white-space: nowrap; }
/* N22. fracao_soma_igual_den: três barras no mesmo denominador, a fração de cada uma à direita */
.aula-live-lousa .aula-nm__sm { display: flex; flex-direction: column; gap: 10px; width: 100%; max-width: 560px; }
.aula-live-lousa .aula-nm__sm-linha { display: grid; grid-template-columns: 1.6em minmax(0, 1fr) 3.4em; column-gap: 10px; align-items: center; }
.aula-live-lousa .aula-nm__sm-op { text-align: center; font-family: var(--font-calc); font-size: 1.6em; line-height: 1; }
.aula-live-lousa .aula-nm__sm-bar { display: grid; grid-template-columns: repeat(var(--den), minmax(0, 1fr)); gap: 3px; }
.aula-live-lousa .aula-nm__sm-cel { height: 1.9em; border: 2px solid color-mix(in srgb, var(--quadro-giz) 55%, transparent); border-radius: 4px; }
.aula-live-lousa .aula-nm__sm-cel--on { border-color: var(--cor); background: color-mix(in srgb, var(--cor) 38%, transparent); }
.aula-live-lousa .aula-nm__sm-cel--tira { background: repeating-linear-gradient(45deg, color-mix(in srgb, var(--cor) 55%, transparent) 0 3px, transparent 3px 8px); }
.aula-live-lousa .aula-nm__sm-linha .aula-fr.aula-papel-final { padding: 2px 6px; }
/* N23. fracao_tres_sentidos: a fração e três quadros */
.aula-live-lousa .aula-nm__topo-fr { font-size: 1.9em; }
.aula-live-lousa .aula-nm__paineis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; width: 100%; max-width: 900px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__paineis { grid-template-columns: minmax(0, 1fr); }
@container arr (max-width: 640px) { .aula-live-lousa .aula-nm__paineis { grid-template-columns: minmax(0, 1fr); } }
.aula-live-lousa .aula-nm__painel { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; }
.aula-live-lousa .aula-nm__painel .aula-nm__fig > svg { max-width: 280px; }
.aula-live-lousa .aula-nm__painel .aula-arr__legenda { text-align: center; }
.aula-live-lousa .aula-nm__ptitulo { font-weight: 700; }
/* N24. pct_barra: a barra do todo (100%), a parte pintada de verde, as chaves e os rótulos (o "?" em amarelo) */
.aula-live-lousa .aula-nm__par { display: flex; align-items: baseline; justify-content: center; gap: .4em; white-space: nowrap; }
.aula-live-lousa .aula-nm__incognita, .aula-live-lousa .aula-nm__incognita .fig-solution { font-weight: 700; }
.aula-live-lousa .aula-nm__pb { display: flex; flex-direction: column; align-items: stretch; width: 100%; max-width: 560px; padding-inline: 3em; }
.aula-live-lousa .aula-nm__pb-rot { display: flex; justify-content: center; min-width: 0; }
.aula-live-lousa .aula-nm__pb-rot--baixo { width: var(--x); align-self: flex-start; }
.aula-live-lousa .aula-nm__pb-rot--esq { width: auto; justify-content: flex-start; }
.aula-live-lousa .aula-nm__par .fig-solution__line { white-space: nowrap; }
.aula-live-lousa .aula-nm__pb-barra { position: relative; height: 3em; border: 2px solid var(--quadro-giz); border-radius: 6px; overflow: hidden; }
.aula-live-lousa .aula-nm__pb-cheia { position: absolute; left: 0; top: 0; bottom: 0; width: var(--x); border-right: 3px solid var(--giz-verde);
  background: color-mix(in srgb, var(--giz-verde) 38%, transparent); }
.aula-live-lousa .aula-nm__pb-chave { height: 9px; border: 2px solid var(--quadro-giz); }
.aula-live-lousa .aula-nm__pb-chave--cima { border-bottom: 0; border-radius: 6px 6px 0 0; margin-top: 3px; }
.aula-live-lousa .aula-nm__pb-chave--baixo { border-top: 0; border-radius: 0 0 6px 6px; width: var(--x); margin-bottom: 3px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__pb { padding-inline: 1.6em; }
/* N25. fator_multiplicativo: a barra inicial (100%) e a final, com o que entra (verde) ou sai (vermelho, riscado) */
.aula-live-lousa .aula-nm__fm { display: flex; flex-direction: column; gap: 6px; width: 100%; max-width: 560px; }
.aula-live-lousa .aula-nm__fm-linha { display: grid; grid-template-columns: minmax(0, 1fr) 5.8em; column-gap: 10px; align-items: center; }
.aula-live-lousa .aula-nm__fm-barra, .aula-live-lousa .aula-nm__lp-barra { display: flex; height: 2.6em; min-width: 0; }
.aula-live-lousa .aula-nm__fm-seg, .aula-live-lousa .aula-nm__lp-seg { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; min-width: 0;
  border: 2px solid var(--cor); background: color-mix(in srgb, var(--cor) 32%, transparent); white-space: nowrap; }
.aula-live-lousa .aula-nm__fm-seg + .aula-nm__fm-seg, .aula-live-lousa .aula-nm__lp-seg + .aula-nm__lp-seg { border-left-width: 0; }
.aula-live-lousa .aula-nm__fm-seg--tira { background: repeating-linear-gradient(45deg, color-mix(in srgb, var(--cor) 55%, transparent) 0 3px, transparent 3px 8px); }
.aula-live-lousa .aula-nm__fm-seg .aula-arr__txt, .aula-live-lousa .aula-nm__lp-seg .aula-arr__txt { font-size: calc(var(--arr-fonte) * .9); text-align: center; }
.aula-live-lousa .aula-arranjo .aula-nm__fm-seg .aula-arr__txt .fig-solution__line, .aula-live-lousa .aula-arranjo .aula-nm__lp-seg .aula-arr__txt .fig-solution__line { white-space: nowrap; overflow-wrap: normal; }
.aula-live-lousa .aula-nm__fm-seg, .aula-live-lousa .aula-nm__lp-seg { position: relative; overflow: visible; }
.aula-live-lousa .aula-nm__seg--estreito > .aula-arr__txt { position: absolute; bottom: calc(100% + 1px); left: 50%; transform: translateX(-50%); }
.aula-live-lousa .aula-nm__fm-valor, .aula-live-lousa .aula-nm__lp-valor { font-weight: 700; text-align: left; }
.aula-live-lousa .aula-nm__fm-fator { font-size: 1.3em; font-weight: 700; padding-left: 1.2em; }
/* N26. pct_sucessivos: a conta errada (soma das taxas) riscada */
.aula-live-lousa .aula-nm__errada { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .5em; max-width: 100%; }
.aula-live-lousa .aula-nm__errada .aula-arr__txt { font-size: min(var(--arr-fonte), 4.6cqw); }   /* a soma errada com 4 ou 5 taxas cabe no celular */
.aula-live-lousa .aula-arr--numeros-pct_sucessivos .aula-trilho { column-gap: .3em; }
.aula-live-lousa .aula-arr--numeros-pct_sucessivos .aula-fo__vao { width: 1.6em; }   /* 4 valores numa linha: vãos mais curtos para o último (R$ 1089) caber no celular */
.aula-live-lousa .aula-arr--numeros-pct_sucessivos .aula-trilho .aula-arr__txt { font-size: min(var(--arr-fonte), 4.3cqw); }
.aula-live-lousa .aula-arranjo .aula-trilho .aula-arr__txt .fig-solution__line { white-space: nowrap; overflow-wrap: normal; }
.aula-live-lousa .aula-nm__errada .fig-solution__line { text-decoration: line-through; text-decoration-color: var(--giz-vermelho); text-decoration-thickness: 3px; }
.aula-live-lousa .aula-nm__x { color: var(--giz-vermelho); font-weight: 700; font-size: 1.4em; font-family: var(--font-calc); }
/* N27. lucro_prejuizo: custo e venda em barras, a diferença em verde (lucro) ou vermelho (prejuízo) */
.aula-live-lousa .aula-nm__lp { display: flex; flex-direction: column; gap: 8px; width: 100%; max-width: 560px; }
.aula-live-lousa .aula-nm__lp-linha { display: grid; grid-template-columns: 3.6em minmax(0, 1fr) 5.8em; column-gap: 10px; align-items: center; }
.aula-live-lousa .aula-nm__lp-nome { text-align: right; }
.aula-live-lousa .aula-nm__lp-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; width: 100%; max-width: 640px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__lp-cols { grid-template-columns: minmax(0, 1fr); }
.aula-live-lousa .aula-nm__lp-col { display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 0; }
/* N28 a N30. juros: a legenda das cores e o tempo na unidade da taxa */
.aula-live-lousa .aula-nm__legenda { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px 18px; }
.aula-live-lousa .aula-nm__legenda-item { display: flex; align-items: center; gap: .4em; }
.aula-live-lousa .aula-nm__tempo-linha { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 4px 28px; }
.aula-live-lousa .aula-nm__tempo { display: flex; align-items: baseline; gap: .5em; }
/* N31. valor_posicional: o quadro de classes e ordens; a decomposição colorida embaixo */
.aula-live-lousa .aula-nm__qd { display: grid; row-gap: 2px; width: 100%; max-width: calc(var(--n) * 2.6em); font-family: var(--font-calc); }
.aula-live-lousa .aula-nm__qd-c { text-align: center; min-width: 0; }
.aula-live-lousa .aula-nm__qd-classe { border-bottom: 2px solid var(--quadro-giz); font-size: calc(var(--arr-fonte) * .85); padding-bottom: 2px; margin-inline: 2px; }
.aula-live-lousa .aula-nm__qd-ord { color: var(--cor); font-size: calc(var(--arr-fonte) * .8); font-weight: 700; }
.aula-live-lousa .aula-nm__qd-dig { color: var(--cor); font-weight: 700; line-height: 1.2;
  font-size: min(calc(var(--arr-fonte) * 1.9), calc(100cqw / (var(--n) + 1) * .75)); }
.aula-live-lousa .aula-nm__qd-vg { align-self: end; font-size: calc(var(--arr-fonte) * 1.6); line-height: 1.2; }
.aula-live-lousa .aula-nm__qd-c--foco { background: color-mix(in srgb, var(--giz-amarelo) 26%, transparent); border-radius: 6px; }
.aula-live-lousa .aula-nm__qd-deco { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 2px .5em; max-width: 100%; }
.aula-live-lousa .aula-nm__qd-termo { font-weight: 700; border-bottom: 3px solid transparent; }
.aula-live-lousa .aula-nm__qd-termo--foco { border-bottom-color: var(--giz-amarelo); }
.aula-live-lousa .aula-nm__qd-termo .fig-solution { color: var(--cor); }
/* N32. significado_operacao: o título (o significado) e a situação */
.aula-live-lousa .aula-nm__sig-topo { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.aula-live-lousa .aula-nm__sig-topo .aula-nm__ptitulo { font-size: calc(var(--arr-fonte) * 1.15); }
/* N33. notacao_cientifica: os algarismos em fila, as duas vírgulas (laranja a antiga, verde a nova) e o arco entre elas */
.aula-live-lousa .aula-nm__nc { column-gap: 0; }
.aula-live-lousa .aula-nm__nc > * { white-space: nowrap; font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 1.7); line-height: 1.2; text-align: center; }
.aula-live-lousa .aula-nm__nc-slot { display: inline-block; width: .42em; font-weight: 700; }
.aula-live-lousa .aula-nm__nc-slot:empty { width: .14em; }
.aula-live-lousa .aula-nm__nc-velha { color: var(--giz-cauda, color-mix(in srgb, var(--giz-amarelo) 62%, var(--giz-vermelho))); }
.aula-live-lousa .aula-nm__nc-nova { color: var(--giz-verde); }
.aula-live-lousa .aula-nm__nc-dig { opacity: .45; }
.aula-live-lousa .aula-nm__nc-dig--sig { opacity: 1; color: var(--giz-azul); font-weight: 700; }
/* N34. expoente_fracionario: as três formas; m em azul, n em verde */
.aula-live-lousa .aula-nm__formas { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px .5em; max-width: 100%; }
.aula-live-lousa .aula-nm__pot { display: inline-flex; align-items: flex-start; }
.aula-live-lousa .aula-nm__sup { margin-left: .15em; position: relative; top: -.55em; }
.aula-live-lousa .aula-nm__sup .aula-arr__txt { font-size: calc(var(--arr-fonte) * .8); }
.aula-live-lousa .aula-nm__formas .aula-raiz { margin-inline: .1em; }
.aula-live-lousa .aula-nm__formas .aula-raiz__corpo { display: inline-flex; align-items: flex-start; }
.aula-live-lousa .aula-nm__expo { font-size: calc(var(--arr-fonte) * .85); margin-left: .1em; font-family: var(--font-calc); font-weight: 700; vertical-align: baseline; position: relative; top: -.3em; }
.aula-live-lousa .aula-nm__formas .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.25); }
.aula-live-lousa .aula-nm__passos-lista { display: flex; flex-direction: column; align-items: center; gap: 6px; max-width: 100%; }
/* N35. qtd_divisores: a fatoração, a tabela de divisores (linhas: potências do 1º primo; colunas: do 2º) */
.aula-live-lousa .aula-nm__fatoracao { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 0 .4em; }
.aula-live-lousa .aula-nm__fatoracao .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.25); font-weight: 700; }
.aula-live-lousa .aula-nm__div-blocos { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 22px; max-width: 100%; }
.aula-live-lousa .aula-nm__div-bloco { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.aula-live-lousa .aula-nm__div-tab { border-collapse: collapse; }
.aula-live-lousa .aula-nm__div-tab th, .aula-live-lousa .aula-nm__div-tab td { padding: 3px 10px; text-align: center; border: 2px solid color-mix(in srgb, var(--quadro-giz) 55%, transparent); }
.aula-live-lousa .aula-nm__div-tab th { background: color-mix(in srgb, var(--cor, var(--quadro-giz)) 16%, transparent); }
.aula-live-lousa .aula-nm__div-tab .aula-arr__txt { font-size: calc(var(--arr-fonte) * .95); text-align: center; }
.aula-live-lousa .aula-nm__div-tab th.aula-nm__div-canto { border-color: transparent; background: none; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__div-tab th, .aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__div-tab td { padding: 2px 5px; }
/* N36 e N37. criterio_divisibilidade e divisibilidade_grade */
.aula-live-lousa .aula-nm__cr-num { display: flex; justify-content: center; font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 2.4); line-height: 1.15; flex-wrap: wrap; }
.aula-live-lousa .aula-nm__cr-dig { padding: 0 .06em; border-radius: 8px; }
.aula-live-lousa .aula-nm__cr-dig--olha { background: color-mix(in srgb, var(--giz-amarelo) 34%, transparent); font-weight: 700; }
.aula-live-lousa .aula-nm__cr-dig--soma { color: var(--giz-azul); font-weight: 700; }
.aula-live-lousa .aula-nm__cr-fim { display: flex; align-items: center; gap: .6em; padding: 4px 18px; border-radius: 8px; max-width: 100%; }
.aula-live-lousa .aula-nm__cr-marca { font-family: var(--font-calc); font-weight: 700; font-size: 1.5em; line-height: 1; color: var(--cor); }
.aula-live-lousa .aula-nm__cr-regra { text-align: center; }
.aula-live-lousa .aula-nm__dg { width: auto; max-width: 100%; table-layout: auto; }
.aula-live-lousa .aula-nm__dg th, .aula-live-lousa .aula-nm__dg td { padding: 6px 14px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__dg th, .aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-nm__dg td { padding: 5px 7px; }
/* [[agente-numeros: fim do css]] */
/* Nicho Álgebra (nichos/algebra.json): só conta e texto, sem caixas de figura. */
/* Peças comuns: trecho realçado (a cor vem de --cor), marcas de grupo (forma e cor) e linha com quebra */
.aula-live-lousa .aula-hl { display: inline-flex; color: var(--cor); }
.aula-live-lousa .aula-hl .aula-linha__peca { color: var(--cor); }
.aula-live-lousa .aula-hl-linha { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; max-width: 100%; }
.aula-live-lousa .aula-marca { padding: 0 .3em 2px; }
.aula-live-lousa .aula-marca--circulo { border: 2px solid var(--cor); border-radius: 999px; padding: 0 .55em; }
.aula-live-lousa .aula-marca--sublinhado { border-bottom: 3px solid var(--cor); }
.aula-live-lousa .aula-marca--caixa { border: 2px solid var(--cor); border-radius: 6px; padding: 0 .35em; margin: 0 .2em; }
.aula-live-lousa .aula-marca--duplo { border-bottom: 5px double var(--cor); }
.aula-live-lousa .aula-faixa.aula-papel-final { padding: 4px 18px; border-radius: 8px; width: fit-content; max-width: 100%; }

/* A1. bhaskara: a equação com a, b e c nas cores deles; o Δ; a fórmula em dois caminhos até as raízes (com Δ < 0: o ✗ e a conclusão) */
.aula-live-lousa .aula-arr--algebra-bhaskara { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-ba__topo { display: flex; flex-direction: column; align-items: center; gap: 8px; max-width: 100%; }
.aula-live-lousa .aula-ba__eq .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.25); }
.aula-live-lousa .aula-ba__abc { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 22px; }
.aula-live-lousa .aula-ba__delta { display: flex; flex-direction: column; align-items: center; gap: 2px; max-width: 100%; }
.aula-live-lousa .aula-ba__concl { max-width: 100%; }
.aula-live-lousa .aula-ba__nao { display: flex; align-items: center; justify-content: center; gap: 12px; max-width: 100%; }
.aula-live-lousa .aula-ba__x { color: var(--giz-vermelho); font-size: 2.2em; font-weight: 700; line-height: 1; }
.aula-live-lousa .aula-ba__ramos { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 64px; max-width: 100%; }
.aula-live-lousa .aula-ba__ramo { display: flex; flex-direction: column; align-items: center; max-width: 100%; }
.aula-live-lousa .aula-ba__sinal { border: 2px solid var(--arr-traco); border-radius: 999px; padding: 0 .85em; }
.aula-live-lousa .aula-ba__vao { height: 46px; }
.aula-live-lousa .aula-ba__raiz { padding: 4px 16px; border-radius: 8px; max-width: 100%; }
.aula-live-lousa .aula-arr--algebra-bhaskara[data-modo="celular"] .aula-ba__ramos { column-gap: 22px; }
.aula-live-lousa .aula-arr--algebra-bhaskara[data-modo="celular"] .aula-ba__raiz .aula-arr__txt { font-size: calc(var(--arr-fonte) * .9); }

/* A2. sistema: as duas equações com uma chave; adição = conta armada; substituição = seta curva e a letra trocada em destaque */
.aula-live-lousa .aula-arr--algebra-sistema { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.aula-live-lousa .aula-sis__eqs { display: flex; flex-direction: column; gap: 4px; border-left: 3px solid var(--arr-traco);
  border-radius: 16px 0 0 16px; padding: 2px 52px 2px 16px; max-width: 100%; }
.aula-live-lousa .aula-sis__eq .aula-hl-linha { justify-content: flex-start; }
.aula-live-lousa .aula-sis__prep { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 4px 14px; }
.aula-live-lousa .aula-sis__comb { max-width: 100%; }
.aula-live-lousa .aula-sis__comb--soma { border-top: 3px solid var(--quadro-giz); padding: 6px 28px 0; }
.aula-live-lousa .aula-sis__passos { display: flex; flex-direction: column; align-items: center; gap: 2px; margin-top: 6px; max-width: 100%; }
.aula-live-lousa .aula-sis__volta { margin-top: 2px; }

/* A3. ruffini: o dispositivo (raiz | coeficientes, linha de baixo), o resto circulado e separado por uma barra */
.aula-live-lousa .aula-arr--algebra-ruffini { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.aula-live-lousa .aula-ru { display: grid; grid-template-columns: repeat(calc(var(--n) + 1), auto); justify-content: center; max-width: 100%; }
.aula-live-lousa .aula-ru__cel { display: flex; justify-content: center; align-items: center; padding: 4px .55em; min-width: 0; }
.aula-live-lousa .aula-ru__raiz, .aula-live-lousa .aula-ru__vazio { border-right: 3px solid var(--quadro-giz); }
.aula-live-lousa .aula-ru__coef { padding-bottom: 28px; border-bottom: 3px solid var(--quadro-giz); }
.aula-live-lousa .aula-ru__baixo { padding-top: 28px; }
.aula-live-lousa .aula-ru__resto { border-left: 3px solid var(--quadro-giz); }
.aula-live-lousa .aula-ru__resto .aula-arr__txt { border: 2px solid var(--giz-amarelo); border-radius: 999px; padding: 0 .55em; }
.aula-live-lousa .aula-ru .aula-arr__txt { font-size: min(calc(var(--arr-fonte) * 1.3), calc(100cqw / (var(--n) + 2) / 1.5)); }
.aula-live-lousa .aula-ru__legenda { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px 20px; }
.aula-live-lousa .aula-ru__fim { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 4px 12px; }

/* A4. diagrama_flechas: dois ovais por diagrama, uma flecha reta por par; a imagem destacada, o resto apagado, o que quebra a regra em vermelho */
.aula-live-lousa .aula-arr--algebra-diagrama_flechas { display: grid; grid-template-columns: repeat(var(--arr-cols-d), minmax(0, 1fr));
  gap: 28px 16px; align-items: start; }
.aula-live-lousa .aula-dg { display: flex; flex-direction: column; align-items: center; gap: 10px; min-width: 0; }
.aula-live-lousa .aula-dg__par { display: grid; grid-template-columns: auto auto; justify-content: space-between; column-gap: clamp(40px, 9cqw, 110px); width: 100%; }
.aula-live-lousa .aula-dg__conjunto { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; }
.aula-live-lousa .aula-arranjo .aula-dg__nome-conjunto, .aula-live-lousa .aula-arranjo .aula-dg__nome-conjunto .fig-solution__line { white-space: nowrap; overflow-wrap: normal; }
.aula-live-lousa .aula-dg__oval { display: flex; flex-direction: column; align-items: center; gap: 6px; border: 2px solid var(--arr-traco);
  border-radius: 999px; padding: 18px 16px; min-width: 3.6em; }
.aula-live-lousa .aula-dg__el { padding: 0 .55em; border: 2px solid transparent; border-radius: 999px; }
.aula-live-lousa .aula-dg__el--img { background: color-mix(in srgb, var(--giz-amarelo) 22%, transparent); }
.aula-live-lousa .aula-dg__el--vazio { opacity: .4; }
.aula-live-lousa .aula-dg__el--erro { border-color: var(--giz-vermelho); color: var(--giz-vermelho); }
.aula-live-lousa .aula-dg__el--erro .aula-arr__txt { color: var(--giz-vermelho); }
.aula-live-lousa .aula-dg__info { display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; max-width: 100%; }
.aula-live-lousa .aula-dg__funcao { font-family: var(--font-calc); font-weight: 700; }
.aula-live-lousa .aula-dg__funcao--sim { color: var(--giz-verde); } .aula-live-lousa .aula-dg__funcao--nao { color: var(--giz-vermelho); }
.aula-live-lousa .aula-dg__motivo { max-width: 100%; }
.aula-live-lousa .aula-arr--algebra-diagrama_flechas[data-modo="celular"] { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 8px; }
.aula-live-lousa .aula-arr--algebra-diagrama_flechas[data-modo="celular"] .aula-dg__par { column-gap: clamp(26px, 8cqw, 60px); }
.aula-live-lousa .aula-arr--algebra-diagrama_flechas[data-modo="celular"] .aula-dg__oval { padding: 14px 8px; }
.aula-live-lousa .aula-arr--algebra-diagrama_flechas[data-modo="celular"] .aula-dg__nome-conjunto { font-size: 11px; }
.aula-live-lousa .aula-arr--algebra-diagrama_flechas[data-modo="celular"] .aula-dg:nth-child(3):nth-last-child(-n+2) { grid-column: 1 / -1; justify-self: center; width: 50%; }

/* A5. dois_lados: linhas alinhadas pelo sinal; a operação duas vezes, na mesma cor, entre uma linha e a seguinte (celular: uma vez, à direita) */
.aula-live-lousa .aula-arr--algebra-dois_lados { display: flex; flex-direction: column; align-items: center; }
.aula-live-lousa .aula-dl { display: grid; grid-template-columns: auto auto auto; column-gap: .6em; justify-content: center; max-width: 100%; }
.aula-live-lousa .aula-dl > * { padding: 3px 0; min-width: 0; }
.aula-live-lousa .aula-dl__e { justify-self: end; text-align: right; } .aula-live-lousa .aula-dl__d { justify-self: start; }
.aula-live-lousa .aula-dl__s { justify-self: center; } .aula-live-lousa .aula-dl__toda { justify-self: center; text-align: center; }
.aula-live-lousa .aula-dl__op { font-size: .85em; color: var(--cor); }
.aula-live-lousa .aula-dl__op .aula-linha__peca { color: var(--cor); }
.aula-live-lousa .aula-dl__op-e { justify-self: end; } .aula-live-lousa .aula-dl__op-d { justify-self: start; }
.aula-live-lousa .aula-dl__inverte { outline: 2px solid var(--giz-vermelho); outline-offset: 1px; border-radius: 999px; padding: 0 .4em; }
.aula-live-lousa .aula-dl__nota { color: var(--giz-vermelho); justify-self: center; }
.aula-live-lousa .aula-dl__me { justify-self: end; text-align: right; } .aula-live-lousa .aula-dl__md { justify-self: start; }
.aula-live-lousa .aula-dl__ms { justify-self: center; }
.aula-live-lousa .aula-arr--algebra-dois_lados[data-modo="celular"] .aula-dl { column-gap: .4em; }
.aula-live-lousa .aula-arr--algebra-dois_lados[data-modo="celular"] .aula-dl .aula-arr__txt { font-size: min(var(--arr-fonte), 4.6cqw); }
.aula-live-lousa .aula-arr--algebra-dois_lados[data-modo="celular"] .aula-dl > * { padding: 2px 0; }

/* A6. substituir: a expressão com as letras em cores, as etiquetas dos valores (celular: acima), a conta com os números em caixinhas da cor da letra */
.aula-live-lousa .aula-arr--algebra-substituir { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.aula-live-lousa .aula-su__topo { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px 32px; max-width: 100%; }
.aula-live-lousa .aula-su__valores { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 12px; }
.aula-live-lousa .aula-su__valor { border: 2px solid var(--cor); border-radius: 999px; padding: 0 .75em; }
.aula-live-lousa .aula-su__expr .aula-arr__txt, .aula-live-lousa .aula-su__subst .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.25); }
.aula-live-lousa .aula-su__passos { display: flex; flex-direction: column; align-items: center; gap: 2px; max-width: 100%; }
.aula-live-lousa .aula-arr--algebra-substituir[data-modo="celular"] .aula-su__topo { flex-direction: column-reverse; }

/* A7. marcar_termos: uma marca (cor e forma) por grupo; semelhantes viram o `junta`; na evidência o fator sai da conta, com uma seta */
.aula-live-lousa .aula-arr--algebra-marcar_termos { display: flex; flex-direction: column; align-items: center; gap: 36px; }
.aula-live-lousa .aula-mk__expr .aula-arr__txt, .aula-live-lousa .aula-mk__juntas .aula-arr__txt,
.aula-live-lousa .aula-mk__resultado .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.25); }
.aula-live-lousa .aula-mk__resultado { padding: 4px 18px; border-radius: 8px; }

/* A8. maquina_funcao: a caixa da regra com a entrada e a saída do 1º par; a tabela x | y (inversa: no sentido contrário) */
.aula-live-lousa .aula-arr--algebra-maquina_funcao { display: flex; flex-direction: column; align-items: center; gap: 20px; }
.aula-live-lousa .aula-mq__linha { display: flex; align-items: center; justify-content: center; max-width: 100%; }
.aula-live-lousa .aula-mq__vao { width: clamp(44px, 12cqw, 104px); flex: 0 0 auto; }
.aula-live-lousa .aula-mq__caixa { border: 3px solid var(--arr-traco); border-radius: 12px; padding: 10px 22px; min-width: 0; }
.aula-live-lousa .aula-mq__caixa .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.15); }
.aula-live-lousa .aula-mq__valor { padding: 2px 8px; flex: 0 0 auto; }
.aula-live-lousa .aula-mq__primeiro td { background: color-mix(in srgb, var(--giz-amarelo) 16%, transparent); }
.aula-live-lousa .aula-arr--algebra-maquina_funcao[data-modo="celular"] .aula-mq__vao { width: clamp(28px, 9cqw, 52px); }
.aula-live-lousa .aula-arr--algebra-maquina_funcao[data-modo="celular"] .aula-mq__caixa { padding: 8px 12px; }

/* A9. sequencia_termos: os termos em linha, o índice embaixo, um arco com o passo entre vizinhos; o termo geral e o exemplo */
.aula-live-lousa .aula-arr--algebra-sequencia_termos { display: flex; flex-direction: column; align-items: center; gap: 18px; }
.aula-live-lousa .aula-arr--algebra-sequencia_termos .aula-trilho { width: 100%; justify-content: space-around; column-gap: 12px; }
.aula-live-lousa .aula-sq__termo { display: flex; flex-direction: column; align-items: center; min-width: 0; }
.aula-live-lousa .aula-arranjo .aula-sq__indice { font-size: max(11px, calc(var(--arr-fonte) * .7)); }
.aula-live-lousa .aula-sq__geral { border: 2px solid var(--arr-traco); border-radius: 10px; padding: 6px 18px; max-width: 100%; }
/* Nicho Álgebra, arranjos novos (agente-algebra): produtos notáveis, fatoração, equação do problema, raízes, log, somas, escalonamento e
   classificação. Só conta e texto (nenhuma caixa de figura). Cor com função: a azul, b amarelo, ab verde, o que se tira vermelho. */
.aula-live-lousa .aula-hl.aula-papel-final { padding: 0 .55em 2px; border-radius: 8px; }

/* A10. produto_area: o quadrado de lado a ± b em regiões coloridas, com as medidas nas bordas; ao lado, as áreas somadas */
.aula-live-lousa .aula-arr--algebra-produto_area { display: flex; justify-content: center; }
.aula-live-lousa .aula-pa { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 22px 44px; max-width: 100%; }
.aula-live-lousa .aula-pa__fig { --c1: 62fr; --c2: 38fr; display: grid; grid-template-columns: auto auto minmax(0, 1fr);
  grid-template-rows: auto auto auto; column-gap: 6px; row-gap: 4px; width: min(100%, 320px); flex: 0 0 auto; }
.aula-live-lousa .aula-pa__quadro { display: grid; grid-template-columns: var(--c1) var(--c2); grid-template-rows: var(--c1) var(--c2);
  aspect-ratio: 1; width: 100%; }
.aula-live-lousa .aula-pa__rotulos { display: grid; align-items: center; justify-items: center; min-width: 0; }
.aula-live-lousa .aula-pa__rotulos--h { grid-template-columns: var(--c1) var(--c2); }
.aula-live-lousa .aula-pa__rotulos--v { grid-template-rows: var(--c1) var(--c2); }
.aula-live-lousa .aula-pa__regua { display: flex; align-items: center; justify-content: center; }
.aula-live-lousa .aula-pa__regua--h { border-bottom: 3px solid var(--quadro-giz); padding-bottom: 1px; }
.aula-live-lousa .aula-pa__regua--v { border-right: 3px solid var(--quadro-giz); padding-right: 6px; }
.aula-live-lousa .aula-pa__reg { position: relative; display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 0;
  border: 2px solid var(--cor); background: color-mix(in srgb, var(--cor) 30%, transparent); }
.aula-live-lousa .aula-pa__reg .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.1); flex: 0 0 auto; }
.aula-live-lousa .aula-arr--algebra-produto_area[data-modo="celular"] .aula-pa__reg .aula-arr__txt { font-size: calc(var(--arr-fonte) * .85); }
.aula-live-lousa .aula-pa__reg--base { background: color-mix(in srgb, var(--cor) 20%, transparent); }
.aula-live-lousa .aula-pa__reg--sobra { border: 3px dashed var(--cor); background: transparent; }
.aula-live-lousa .aula-pa__reg--tira { background: color-mix(in srgb, var(--cor) 34%, transparent); }
.aula-live-lousa .aula-pa__reg--direita .aula-arr__txt { position: absolute; top: 31%; left: 50%; transform: translate(-50%, -50%); }
.aula-live-lousa .aula-pa__reg--baixo .aula-arr__txt { position: absolute; left: 31%; top: 50%; transform: translate(-50%, -50%); }
.aula-live-lousa .aula-pa__reg--b { background: color-mix(in srgb, var(--cor) 55%, transparent); }
.aula-live-lousa .aula-pa__contas { display: flex; flex-direction: column; align-items: center; gap: 14px; flex: 1 1 13em; min-width: 0; }
.aula-live-lousa .aula-pa__titulo .aula-arr__txt, .aula-live-lousa .aula-pa__parcelas .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.25); }
.aula-live-lousa .aula-arr--algebra-produto_area[data-modo="celular"] .aula-pa { flex-direction: column; gap: 18px; }
.aula-live-lousa .aula-arr--algebra-produto_area[data-modo="celular"] .aula-pa__fig { width: min(100%, 300px); }

/* A11. erro_quadrado: com números, o erro (vermelho) de um lado e o certo (verde) do outro; o 2ab que falta, verde nos dois */
.aula-live-lousa .aula-arr--algebra-erro_quadrado { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-eq { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 36px; width: 100%; max-width: 780px; }
.aula-live-lousa .aula-eq__col { display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 0; }
.aula-live-lousa .aula-eq__marca { font-size: 2.2em; font-weight: 700; line-height: 1; }
.aula-live-lousa .aula-eq__marca--errado { color: var(--giz-vermelho); } .aula-live-lousa .aula-eq__marca--certo { color: var(--giz-verde); }
.aula-live-lousa .aula-eq__col .aula-arr__txt { font-size: var(--arr-fonte); }
.aula-live-lousa .aula-eq__concl { max-width: 100%; }
.aula-live-lousa .aula-arr--algebra-erro_quadrado[data-modo="celular"] .aula-eq { grid-template-columns: minmax(0, 1fr); }

/* A12. diferenca_quadrados: o quadrado, o L e o retângulo em fila (setas entre eles); medidas nas bordas */
.aula-live-lousa .aula-arr--algebra-diferenca_quadrados { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-dq__fila { display: flex; align-items: center; justify-content: center; gap: clamp(8px, 2.2cqw, 28px); max-width: 100%; }
.aula-live-lousa .aula-dq__painel { position: relative; flex: 0 0 auto; width: clamp(90px, 22cqw, 190px); aspect-ratio: 1.4 / 1;
  margin: 1.7em 0 .3em clamp(36px, 7cqw, 64px); }
.aula-live-lousa .aula-dq__painel--retangulo { aspect-ratio: 1.4 / .6; }
.aula-live-lousa .aula-dq__seta { position: relative; flex: 0 0 auto; width: clamp(14px, 3cqw, 34px); height: 3px; background: var(--quadro-giz); }
.aula-live-lousa .aula-dq__seta::after { content: ""; position: absolute; right: -2px; top: 50%; transform: translateY(-50%);
  border: 7px solid transparent; border-right: 0; border-left: 11px solid var(--quadro-giz); }
.aula-live-lousa .aula-dq__reg { position: absolute; box-sizing: border-box; display: flex; align-items: center; justify-content: center;
  border: 2px solid var(--cor); background: color-mix(in srgb, var(--cor) 32%, transparent); }
.aula-live-lousa .aula-dq__reg .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1); flex: 0 0 auto; }
.aula-live-lousa .aula-dq__reg--corte { border-style: dashed; background: color-mix(in srgb, var(--cor) 55%, transparent); }
.aula-live-lousa .aula-dq__reg--vazio { border: 2px dashed var(--quadro-giz); background: none; opacity: .45; }
.aula-live-lousa .aula-dq__rot { position: absolute; white-space: nowrap; }
.aula-live-lousa .aula-dq__rot--topo { top: 0; transform: translate(-50%, -100%); }
.aula-live-lousa .aula-dq__rot--esq { left: 0; transform: translate(-100%, -50%); padding-right: 6px; }
.aula-live-lousa .aula-dq__rot--dir { transform: translateY(-50%); }
.aula-live-lousa .aula-dq__rot .aula-linha__peca { font-size: calc(var(--arr-fonte) * .95); }
.aula-live-lousa .aula-dq__igual { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; max-width: 100%; }
.aula-live-lousa .aula-dq__igual .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.25); }
.aula-live-lousa .aula-arr--algebra-diferenca_quadrados[data-modo="celular"] .aula-dq__fila { flex-direction: column; align-items: center; gap: 10px; }
.aula-live-lousa .aula-arr--algebra-diferenca_quadrados[data-modo="celular"] .aula-dq__painel { width: min(62cqw, 240px); margin-left: clamp(48px, 14cqw, 70px); }
.aula-live-lousa .aula-arr--algebra-diferenca_quadrados[data-modo="celular"] .aula-dq__seta { width: 3px; height: 22px; margin: 0; transform: none; }
.aula-live-lousa .aula-arr--algebra-diferenca_quadrados[data-modo="celular"] .aula-dq__seta::after { right: auto; left: 50%; top: auto; bottom: -2px;
  transform: translateX(-50%); border: 7px solid transparent; border-bottom: 0; border-top: 11px solid var(--quadro-giz); border-left-color: transparent; }

/* A13. distributiva: cada termo do 1º fator (uma cor) multiplica o 2º inteiro; termos opostos riscados */
.aula-live-lousa .aula-arr--algebra-distributiva { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.aula-live-lousa .aula-ds__topo .aula-arr__txt, .aula-live-lousa .aula-ds__linha .aula-arr__txt,
.aula-live-lousa .aula-ds__todos .aula-arr__txt,
.aula-live-lousa .aula-arr--algebra-distributiva .aula-faixa .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.2); }
.aula-live-lousa .aula-ds__linhas { display: flex; flex-direction: column; align-items: center; gap: 8px; max-width: 100%; }
.aula-live-lousa .aula-ds__anula .aula-arr__txt { text-decoration: line-through 3px var(--giz-vermelho); opacity: .8; }

/* A14. trinomio_quadrado: os três termos coloridos (a² azul, b² amarelo, o do meio verde), as raízes dos extremos e o teste do meio */
.aula-live-lousa .aula-arr--algebra-trinomio_quadrado { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-tq__tri .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.35); }
.aula-live-lousa .aula-tq__raizes { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 40px; }
.aula-live-lousa .aula-tq__teste .aula-arr__txt, .aula-live-lousa .aula-tq__nao .aula-arr__txt,
.aula-live-lousa .aula-tq__raizes .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.15); }
.aula-live-lousa .aula-tq__marca { font-size: 1.9em; font-weight: 700; line-height: 1; padding-left: .2em; }
.aula-live-lousa .aula-tq__marca--sim { color: var(--giz-verde); } .aula-live-lousa .aula-tq__marca--nao { color: var(--giz-vermelho); }
.aula-live-lousa .aula-tq__nao { max-width: 100%; }

/* A15. agrupamento: os termos de cada grupo marcados na expressão (cor e forma); o resto repetido em amarelo sai para fora */
.aula-live-lousa .aula-arr--algebra-agrupamento { display: flex; flex-direction: column; align-items: center; gap: 28px; }
.aula-live-lousa .aula-ag__expr .aula-arr__txt, .aula-live-lousa .aula-ag__grupos .aula-arr__txt,
.aula-live-lousa .aula-ag__fim .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.3); }
.aula-live-lousa .aula-ag__fim { padding: 4px 18px; border-radius: 8px; }

/* A16. fator_comum: cada termo em fatores; o comum (azul) sai para fora do parêntese, a sobra de cada termo na sua cor */
.aula-live-lousa .aula-arr--algebra-fator_comum { display: flex; flex-direction: column; align-items: center; gap: 22px; }
.aula-live-lousa .aula-fc__linhas { display: flex; flex-direction: column; align-items: center; gap: 12px; max-width: 100%; }
.aula-live-lousa .aula-fc__linha .aula-arr__txt, .aula-live-lousa .aula-fc__fim .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.25); }
.aula-live-lousa .aula-fc__fim { padding: 4px 18px; border-radius: 8px; }

/* A17. traduzir_problema: cada pedaço do enunciado (sublinhado) e o pedaço da equação (caixa) na mesma cor; embaixo, a equação montada */
.aula-live-lousa .aula-arr--algebra-traduzir_problema { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-tp__linhas { display: grid; grid-template-columns: minmax(0, 1.25fr) auto minmax(0, 1fr); align-items: center;
  column-gap: 12px; row-gap: 14px; width: 100%; max-width: 780px; }
.aula-live-lousa .aula-tp__texto { min-width: 0; display: flex; justify-content: flex-end; text-align: right; }   /* esticado: a largura é a da coluna */
.aula-live-lousa .aula-tp__eq { min-width: 0; display: flex; justify-content: flex-start; }
.aula-live-lousa .aula-tp__texto .aula-hl, .aula-live-lousa .aula-tp__eq .aula-hl { max-width: 100%; min-width: 0; }
.aula-live-lousa .aula-tp__seta { position: relative; width: clamp(24px, 6cqw, 48px); height: 3px; background: var(--cor); }
.aula-live-lousa .aula-tp__seta::after { content: ""; position: absolute; right: -2px; top: 50%; transform: translateY(-50%);
  border: 7px solid transparent; border-right: 0; border-left: 11px solid var(--cor); }
.aula-live-lousa .aula-tp__montada .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.35); }
.aula-live-lousa .aula-tp__montada { gap: 0 .35em; }

/* A18. soma_produto: a equação com b (azul, a soma) e c (verde, o produto); a tabela de tentativas; a que serve fica em destaque */
.aula-live-lousa .aula-arr--algebra-soma_produto { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-sp__eq .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.35); }
.aula-live-lousa .aula-sp__contas { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 40px; max-width: 100%; }
.aula-live-lousa .aula-sp__contas .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.1); }
.aula-live-lousa .aula-sp__tentativas { display: flex; flex-direction: column; align-items: center; gap: 8px; max-width: 100%; }
.aula-live-lousa .aula-sp__tent { gap: 2px .5em; padding: 2px 14px; border-radius: 8px; }
.aula-live-lousa .aula-sp__tent--serve { background: color-mix(in srgb, var(--giz-amarelo) 16%, transparent); }
.aula-live-lousa .aula-sp__marca { font-size: 1.5em; font-weight: 700; line-height: 1; }
.aula-live-lousa .aula-sp__marca--sim { color: var(--giz-verde); } .aula-live-lousa .aula-sp__marca--nao { color: var(--giz-vermelho); }

/* A19. girard: cada coeficiente (b, c, d) numa cor e a relação que o usa, na mesma cor, com a conta dos coeficientes e a das raízes */
.aula-live-lousa .aula-arr--algebra-girard { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-gi__eq .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.35); }
.aula-live-lousa .aula-gi__rels { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(15em, 100%), 1fr)); gap: 16px 24px; width: 100%; }
.aula-live-lousa .aula-gi__rel { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; }
.aula-live-lousa .aula-gi__conta .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.05); }
.aula-live-lousa .aula-arr--algebra-girard[data-modo="celular"] .aula-gi__conta .aula-arr__txt { font-size: calc(var(--arr-fonte) * .92); }

/* A20. biquadrada: 1ª fase (azul) troca x² por y; 2ª fase (verde) volta de cada y para x; y negativo = ✗ */
.aula-live-lousa .aula-arr--algebra-biquadrada { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.aula-live-lousa .aula-bi__fase { display: flex; flex-direction: column; align-items: center; gap: 8px; max-width: 100%; }
.aula-live-lousa .aula-bi__fase .aula-arr__txt, .aula-live-lousa .aula-bi__colunas .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.25); }
.aula-live-lousa .aula-bi__colunas { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 56px; max-width: 100%; }
.aula-live-lousa .aula-bi__coluna { display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 0; }
.aula-live-lousa .aula-bi__seta, .aula-live-lousa .aula-ex__seta { position: relative; width: 3px; height: 22px; background: var(--quadro-giz); flex: 0 0 auto; }
.aula-live-lousa .aula-bi__seta::after, .aula-live-lousa .aula-ex__seta::after { content: ""; position: absolute; left: 50%; bottom: -2px; transform: translateX(-50%);
  border: 7px solid transparent; border-bottom: 0; border-top: 11px solid var(--quadro-giz); }
.aula-live-lousa .aula-bi__seta--fases { height: 30px; margin: 4px 0; }
.aula-live-lousa .aula-bi__x { color: var(--giz-vermelho); font-size: 1.7em; font-weight: 700; line-height: 1; }

/* A21. exponencial: a base (azul) e os expoentes (verde) dos dois lados; mesma base, expoentes iguais */
.aula-live-lousa .aula-arr--algebra-exponencial { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.aula-live-lousa .aula-ex__linha .aula-arr__txt, .aula-live-lousa .aula-ex__mesma .aula-arr__txt,
.aula-live-lousa .aula-ex__expoentes .aula-arr__txt, .aula-live-lousa .aula-arr--algebra-exponencial .aula-arr__conta { font-size: calc(var(--arr-fonte) * 1.3); }
.aula-live-lousa .aula-pot { display: inline-flex; align-items: flex-start; font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 1.3); }
.aula-live-lousa .aula-pot__exp { color: var(--cor); font-size: .7em; font-weight: 700; line-height: 1; margin: .1em 0 0 1px; white-space: nowrap; }

/* A22. log_definicao: log com a base embaixo ⇔ a potência; base azul, logaritmando verde, logaritmo (o expoente) amarelo */
.aula-live-lousa .aula-arr--algebra-log_definicao { --tam: calc(var(--arr-fonte) * 1.7); display: flex; flex-direction: column; align-items: center; gap: 18px; }
.aula-live-lousa .aula-ld__formas { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px 28px; max-width: 100%; }
.aula-live-lousa .aula-ld__forma { display: inline-flex; align-items: baseline; }
.aula-live-lousa .aula-lg { display: inline-block; white-space: nowrap; font-family: var(--font-calc); font-size: var(--tam); }
.aula-live-lousa .aula-lg > .aula-hl { vertical-align: baseline; }
.aula-live-lousa .aula-lg__txt { font-family: var(--font-calc); white-space: pre; font-size: var(--tam); line-height: 1.35; }
.aula-live-lousa .aula-lg__base { font-size: .62em; line-height: 1; color: var(--cor, inherit); font-weight: 700; margin-right: .2em; }
.aula-live-lousa .aula-arr--algebra-log_definicao .aula-arr__txt, .aula-live-lousa .aula-arr--algebra-log_definicao .aula-pot { font-size: var(--tam); }
.aula-live-lousa .aula-arr--algebra-log_definicao .aula-papel-final .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.2); }
.aula-live-lousa .aula-ld__equiv { font-size: calc(var(--arr-fonte) * 2.2); line-height: 1; color: var(--arr-traco); }
.aula-live-lousa .aula-arr--algebra-log_definicao .aula-pot__exp .aula-arr__txt, .aula-live-lousa .aula-lp__col .aula-pot__exp .aula-arr__txt { font-size: 1em; }
.aula-live-lousa .aula-arr--algebra-log_definicao[data-modo="celular"] .aula-ld__formas { flex-direction: column; }
/* a fração própria dos desenhos de log (fora do .fig-solution, que é quem dá o traço às frações do motor) */
.aula-live-lousa .aula-fn { display: inline-flex; flex-direction: column; align-items: center; align-self: center; vertical-align: middle; margin: .2em .16em;
  line-height: 1.06; font-size: .85em; }
.aula-live-lousa .aula-fn__n { padding: 0 .24em; }
.aula-live-lousa .aula-fn__d { padding: 0 .24em; border-top: .075em solid currentColor; align-self: stretch; text-align: center; }
.aula-live-lousa .aula-fn .aula-arr__txt { font-size: inherit; }
.aula-live-lousa .aula-ld__leitura { max-width: 100%; }
.aula-live-lousa .aula-arr--algebra-log_definicao[data-modo="celular"] { --tam: calc(var(--arr-fonte) * 1.5); }

/* A23. log_propriedades: a regra com letras e o exemplo com os números do pedido, nas mesmas cores, uma propriedade embaixo da outra */
.aula-live-lousa .aula-arr--algebra-log_propriedades { --tam: calc(var(--arr-fonte) * 1.25); }
.aula-live-lousa .aula-lp__cols { display: flex; flex-direction: column; align-items: center; gap: 26px; width: 100%; }
.aula-live-lousa .aula-lp__col { display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 0; max-width: 100%; }
.aula-live-lousa .aula-lp__col .aula-arr__txt, .aula-live-lousa .aula-lp__col .aula-pot { font-size: var(--tam); }
.aula-live-lousa .aula-lp__col .aula-lg__base { margin-right: .15em; }
.aula-live-lousa .aula-lp__regra .aula-hl .aula-arr__txt { font-style: italic; }
.aula-live-lousa .aula-lp__total { padding: 0 .55em 2px; border-radius: 8px; }
.aula-live-lousa .aula-arr--algebra-log_propriedades[data-modo="celular"] { --tam: calc(var(--arr-fonte) * 1.05); }

/* A24. mudanca_base: a fórmula com letras e com números; a azul, b verde, nova base amarela */
.aula-live-lousa .aula-arr--algebra-mudanca_base { --tam: calc(var(--arr-fonte) * 1.5); display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-arr--algebra-mudanca_base .aula-arr__txt, .aula-live-lousa .aula-arr--algebra-mudanca_base .aula-lg { font-size: var(--tam); }
.aula-live-lousa .aula-arr--algebra-mudanca_base .aula-lg__txt { font-size: var(--tam); }
.aula-live-lousa .aula-mb__formula, .aula-live-lousa .aula-mb__numeros, .aula-live-lousa .aula-mb__valores, .aula-live-lousa .aula-mb__fim { align-items: center; }
.aula-live-lousa .aula-arr--algebra-mudanca_base[data-modo="celular"] { --tam: calc(var(--arr-fonte) * 1.2); }

/* A25. soma_pa: S escrita nos dois sentidos (azul e verde); embaixo de cada coluna o par (amarelo), sempre igual */
.aula-live-lousa .aula-arr--algebra-soma_pa { display: flex; flex-direction: column; align-items: center; gap: 18px; }
.aula-live-lousa .aula-sa { display: grid; grid-template-columns: auto repeat(calc(var(--k) * 2 - 1), auto); column-gap: 0; row-gap: 8px;
  justify-content: center; align-items: center; max-width: 100%; }
.aula-live-lousa .aula-sa .aula-arr__txt { font-size: min(calc(var(--arr-fonte) * 1.3), calc(100cqw / (var(--k) * 2.1 + 3))); }
.aula-live-lousa .aula-sa__rotulo { padding-right: .4em; }
.aula-live-lousa .aula-sa__cel, .aula-live-lousa .aula-sa__mais { display: flex; justify-content: center; min-width: 0; padding: 0 .16em; }
.aula-live-lousa .aula-sa__soma { border-top: 3px solid var(--quadro-giz); padding-top: 6px; }
.aula-live-lousa .aula-sa__calculo { display: flex; flex-direction: column; align-items: center; gap: 2px; max-width: 100%; }

/* A26. soma_pg_infinita: as somas parciais em barras (azul) e, convergindo, a linha tracejada verde do limite */
.aula-live-lousa .aula-arr--algebra-soma_pg_infinita { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.aula-live-lousa .aula-pgi__svg { position: static; display: block; width: min(100%, 560px); height: auto; overflow: visible; color: var(--quadro-giz); }
.aula-live-lousa .aula-pgi__condicao .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.15); }
.aula-live-lousa .aula-pgi__marca { font-size: 1.7em; font-weight: 700; line-height: 1; padding-left: .15em; }
.aula-live-lousa .aula-pgi__marca--sim { color: var(--giz-verde); } .aula-live-lousa .aula-pgi__marca--nao { color: var(--giz-vermelho); }

/* A27. soma_pg: S (azul) e qS (verde) em colunas deslocadas; os termos do meio, repetidos, riscados; sobram o 1º e o último vezes q */
.aula-live-lousa .aula-arr--algebra-soma_pg { display: flex; flex-direction: column; align-items: center; gap: 18px; }
.aula-live-lousa .aula-sg { display: grid; grid-template-columns: auto repeat(calc(var(--k) * 2 - 1), auto); column-gap: 0; row-gap: 8px; justify-content: center;
  align-items: center; max-width: 100%; }
.aula-live-lousa .aula-sg .aula-arr__txt { font-size: min(calc(var(--arr-fonte) * 1.3), calc(100cqw / (var(--k) * 2.6 + 4))); }
.aula-live-lousa .aula-sg__rotulo { padding-right: .4em; white-space: nowrap; }
.aula-live-lousa .aula-sg__rotulo .fig-solution__line { white-space: nowrap; }
.aula-live-lousa .aula-sg__cel, .aula-live-lousa .aula-sg__mais { display: flex; justify-content: center; min-width: 0; padding: 0 .16em; }
.aula-live-lousa .aula-sg__soma { border-top: 3px solid var(--quadro-giz); padding-top: 6px; }
.aula-live-lousa .aula-sg__anula .aula-arr__txt { text-decoration: line-through 3px var(--giz-vermelho); opacity: .75; }
.aula-live-lousa .aula-sg__calculo { display: flex; flex-direction: column; align-items: center; gap: 2px; max-width: 100%; }

/* A28. classificacao_sistema: uma coluna por sistema (1ª equação azul, 2ª verde), o tipo e as duas retas */
.aula-live-lousa .aula-arr--algebra-classificacao_sistema { display: block; }
.aula-live-lousa .aula-cs { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 22px 26px; width: 100%; }
.aula-live-lousa .aula-cs__col { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; text-align: center; }
.aula-live-lousa .aula-cs__eq .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.1); }
.aula-live-lousa .aula-cs__tipo { white-space: normal; max-width: 100%; text-align: center; }
.aula-live-lousa .aula-cs__col > .aula-hl-linha { max-width: 100%; min-width: 0; }
.aula-live-lousa .aula-cs__tipo .aula-hl { max-width: 100%; min-width: 0; }
.aula-live-lousa .aula-cs__tipo .aula-arr__conta { white-space: normal; overflow-wrap: break-word; }
.aula-live-lousa .aula-cs__tipo .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.05); font-weight: 700; }
.aula-live-lousa .aula-cs__svg { position: static; display: block; width: min(100%, 190px); height: auto; margin-top: 4px; color: var(--quadro-giz); }
.aula-live-lousa .aula-arr--algebra-classificacao_sistema[data-modo="celular"] .aula-cs { grid-template-columns: minmax(0, 1fr); }

/* A29. escalonamento: a matriz ampliada com colchetes e barra; a operação (esquerda) e a linha que mudou têm a mesma cor */
.aula-live-lousa .aula-arr--algebra-escalonamento { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.aula-live-lousa .aula-es__passo { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; column-gap: 20px; width: 100%; }
.aula-live-lousa .aula-es__op { grid-column: 1; justify-self: end; text-align: right; }
.aula-live-lousa .aula-es__quadro { grid-column: 2; }
.aula-live-lousa .aula-es__mat, .aula-live-lousa .aula-es__vars { display: grid; grid-template-columns: repeat(var(--col), minmax(2.4em, auto)); }
.aula-live-lousa .aula-es__mat { border-left: 3px solid var(--quadro-giz); border-right: 3px solid var(--quadro-giz); border-radius: 10px; padding: 2px 8px; position: relative; }
.aula-live-lousa .aula-es__vars { padding: 0 11px; }
.aula-live-lousa .aula-es__cel { display: flex; justify-content: center; padding: 1px 6px; }
.aula-live-lousa .aula-es__ult { border-left: 2px dashed var(--quadro-giz); }
.aula-live-lousa .aula-es__mudou .aula-arr__txt { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-es__cel .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.2); }
.aula-live-lousa .aula-es__vars .aula-arr__txt { font-size: calc(var(--arr-fonte) * .95); opacity: .85; }
.aula-live-lousa .aula-es__op .aula-arr__txt { font-size: var(--arr-fonte); }
.aula-live-lousa .aula-es__volta { display: flex; flex-direction: column; align-items: center; gap: 2px; margin-top: 6px; }
.aula-live-lousa .aula-es__tipo .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.1); }
.aula-live-lousa .aula-arr--algebra-escalonamento[data-modo="celular"] .aula-es__passo { grid-template-columns: minmax(0, 1fr); row-gap: 4px; justify-items: center; }
.aula-live-lousa .aula-arr--algebra-escalonamento[data-modo="celular"] .aula-es__op, .aula-live-lousa .aula-arr--algebra-escalonamento[data-modo="celular"] .aula-es__quadro { grid-column: 1; justify-self: center; text-align: center; }
/* fim: algebra novos (agente-algebra) */
/* Nicho Geometria (nichos/geometria.json): a figura (do catálogo, ou o triângulo desenhado pelo arranjo) à esquerda e as
   contas à direita; no celular, a figura em cima. A caixa de figura acompanha a coluna (até --arr-caixa, no ritmo
   360 × 260), nunca em px fixos: o motor de página amplia o bloco. A cor de um elemento vem de --cor (.aula-geo__cor). */
.aula-live-lousa .aula-arr--geometria-trig_triangulo,
.aula-live-lousa .aula-arr--geometria-lei_triangulo,
.aula-live-lousa .aula-arr--geometria-triangulo_escondido,
.aula-live-lousa .aula-arr--geometria-inscrito_circunscrito,
.aula-live-lousa .aula-arr--geometria-semelhanca,
.aula-live-lousa .aula-arr--geometria-contar_elementos,
.aula-live-lousa .aula-arr--geometria-vistas,
.aula-live-lousa .aula-arr--geometria-planificar_area,
.aula-live-lousa .aula-arr--geometria-decompor_area,
.aula-live-lousa .aula-arr--geometria-figura_regra_conta { display: flex; flex-direction: column;
  align-items: center; gap: 16px; }
.aula-live-lousa .aula-arranjo[class*="aula-arr--geometria-"] .aula-caixa { width: 100%; max-width: var(--arr-caixa); height: auto;
  aspect-ratio: 360 / 260; }
.aula-live-lousa .aula-geo__duas { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); column-gap: 24px;
  row-gap: 14px; align-items: center; width: 100%; }
.aula-live-lousa .aula-geo__duas--texto { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-geo__duas { grid-template-columns: minmax(0, 1fr); }
.aula-live-lousa .aula-geo__fig { display: flex; justify-content: center; min-width: 0; }
.aula-live-lousa .aula-geo__col { display: flex; flex-direction: column; align-items: center; gap: 12px; min-width: 0; max-width: 100%; }
.aula-live-lousa .aula-geo__passos { display: flex; flex-direction: column; align-items: center; gap: 2px; max-width: 100%; }
.aula-live-lousa .aula-geo__cor { color: var(--cor); }
.aula-live-lousa .aula-geo__cor .fig-solution { color: var(--cor); }
.aula-live-lousa .aula-geo__incognita .fig-solution { color: var(--giz-amarelo); font-weight: 700; }
.aula-live-lousa .aula-geo__tri { color: var(--quadro-giz); }
.aula-live-lousa .aula-geo__razao { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0 .4em; max-width: 100%; }
.aula-live-lousa .aula-geo__eq { max-width: 100%; }
/* G1. trig_triangulo e G2. lei_triangulo: o triângulo do motor; a razão por extenso / a lei numa caixa, nas cores dos lados */
.aula-live-lousa .aula-geo__lei { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0 .4em;
  border: 2px solid var(--arr-traco); border-radius: 10px; padding: 6px 16px; max-width: 100%; }
.aula-live-lousa .aula-geo__lei .aula-hl-linha .aula-arr__txt { font-family: var(--font-calc); }
/* G3. triangulo_escondido: a figura e o triângulo lado a lado (celular também), a seta curva "tira de dentro" por cima */
.aula-live-lousa .aula-te__topo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16px, .12fr) minmax(0, 1fr);
  align-items: center; width: 100%; }
.aula-live-lousa .aula-te__topo > .aula-caixa { justify-self: center; }
.aula-live-lousa .aula-te__esp { grid-column: 1 / -1; position: relative; height: 54px; margin-top: 1.9em; }
.aula-live-lousa .aula-te__esp .aula-arco__rotulo { bottom: calc(100% + 2px); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-te__esp { height: 46px; }
.aula-live-lousa .aula-te__onde { max-width: 100%; }
/* G4. inscrito_circunscrito: a "ponte" numa caixa, os dois elementos na cor do segmento compartilhado */
.aula-live-lousa .aula-ic__ponte { border: 2px solid var(--arr-traco); border-radius: 10px; padding: 6px 14px; max-width: 100%; }
/* G5. semelhanca: as duas figuras lado a lado e alinhadas pela base (a menor na proporção real); os pares embaixo */
.aula-live-lousa .aula-se__figs { display: flex; align-items: flex-end; justify-content: center; gap: 20px; width: 100%; }
.aula-live-lousa .aula-arr--geometria-semelhanca .aula-se__figs .aula-caixa { flex: 0 1 auto;
  width: calc(var(--arr-caixa) * var(--esc, 1)); max-width: calc((100% - 20px) / 2 * var(--esc, 1)); }
.aula-live-lousa .aula-se__pares { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 28px; max-width: 100%; }
.aula-live-lousa .aula-se__par { display: inline-flex; align-items: baseline; gap: .45em; }
.aula-live-lousa .aula-se__marca { font-family: var(--font-calc); font-weight: 700; letter-spacing: 1px; font-size: var(--arr-fonte); }
.aula-live-lousa .aula-se__liga { font-size: var(--arr-fonte); }
.aula-live-lousa .aula-se__contas { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 4px 28px; }
/* G6. contar_elementos: a tabela nome | letra | quantidade (cada linha na sua cor); a relação com um ✓ */
.aula-live-lousa .aula-ce__tabela { max-width: 420px; table-layout: auto; }
.aula-live-lousa .aula-ce__tabela .fig-solution__line { overflow-wrap: normal; word-break: normal; }
.aula-live-lousa .aula-ce__tabela td { padding: 6px 8px; }
.aula-live-lousa .aula-ce__tabela td { border-color: color-mix(in srgb, var(--quadro-giz) 55%, transparent); }
.aula-live-lousa .aula-ce__fim { display: flex; align-items: center; justify-content: center; gap: 12px; max-width: 100%; }
.aula-live-lousa .aula-ce__relacao { display: flex; flex-direction: column; align-items: center; min-width: 0; }
.aula-live-lousa .aula-ce__ok { color: var(--giz-verde); font-weight: 700; font-size: calc(var(--arr-fonte) * 1.4); }
/* G7. vistas: o sólido com uma setinha colorida por direção (frente embaixo à esquerda, cima em cima, lado à direita);
   as vistas em coluna (celular: lado a lado embaixo) */
.aula-live-lousa .aula-vi__topo { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); column-gap: 28px; row-gap: 16px;
  align-items: center; width: 100%; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-vi__topo { grid-template-columns: minmax(0, 1fr); }
/* o sólido no meio de uma grade 3 × 3: as setinhas encostam na caixa (cima em cima, lado à direita, frente embaixo à esquerda) */
.aula-live-lousa .aula-vi__solido { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-rows: auto auto auto;
  align-items: center; justify-items: center; gap: 2px 4px; min-width: 0; }
.aula-live-lousa .aula-vi__solido > .aula-caixa { grid-column: 2; grid-row: 2; }
.aula-live-lousa .aula-vi__olho { display: inline-flex; align-items: center; gap: .2em; color: var(--cor);
  font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .8); line-height: 1; white-space: nowrap; }
.aula-live-lousa .aula-vi__seta { font-size: 1.7em; font-weight: 700; }
.aula-live-lousa .aula-vi__olho--frente { grid-column: 1; grid-row: 3; flex-direction: column-reverse; justify-self: end; align-self: start; }
.aula-live-lousa .aula-vi__olho--cima { grid-column: 2; grid-row: 1; }
.aula-live-lousa .aula-vi__olho--lado { grid-column: 3; grid-row: 2; flex-direction: column; }
.aula-live-lousa .aula-vi__vistas { display: flex; flex-direction: column; align-items: center; gap: 10px; min-width: 0; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-vi__vistas { display: grid; grid-template-columns: repeat(min(var(--n), 2), minmax(0, 1fr));
  gap: 12px; width: 100%; justify-items: center; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-vi__vistas > .aula-vi__vista:last-child:nth-child(odd) { grid-column: 1 / -1; }
.aula-live-lousa .aula-vi__vista { display: flex; flex-direction: column; align-items: center; gap: 2px; width: 100%; min-width: 0; }
.aula-live-lousa .aula-vi__vistas .aula-caixa { max-width: min(var(--arr-caixa), 260px); }
.aula-live-lousa .aula-vi__titulo { display: inline-flex; align-items: center; gap: .3em; color: var(--cor); font-family: var(--font-calc);
  font-size: calc(var(--arr-fonte) * .9); }
.aula-live-lousa .aula-vi__titulo .aula-vi__seta { font-size: 1.2em; }
/* G8. planificar_area: o sólido, a seta "abre" e a planificação na mesma linha (celular também); uma linha por tipo de face */
.aula-live-lousa .aula-pl__topo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(48px, .22fr) minmax(0, 1fr);
  align-items: center; width: 100%; }
.aula-live-lousa .aula-pl__topo > .aula-caixa { justify-self: center; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-pl__topo .aula-seta { height: auto; width: auto; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-pl__topo .aula-seta__rotulo { left: 0; right: 0; top: auto; bottom: calc(50% + 12px);
  transform: none; text-align: center; }
.aula-live-lousa .aula-pl__faces, .aula-live-lousa .aula-da__partes { display: flex; flex-direction: column; align-items: flex-start;
  gap: 6px; max-width: 100%; }
.aula-live-lousa .aula-pl__face, .aula-live-lousa .aula-da__parte { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 .55em;
  color: var(--cor); max-width: 100%; }
.aula-live-lousa .aula-pl__face .aula-arr__txt, .aula-live-lousa .aula-da__parte .aula-arr__txt { color: var(--cor); }
.aula-live-lousa .aula-pl__face .fig-solution, .aula-live-lousa .aula-da__parte .fig-solution { color: var(--cor); }
/* G9. decompor_area: a amostra da cor da parte (a que se tira, hachurada), o sinal, o nome e a conta */
.aula-live-lousa .aula-da__cor { flex: 0 0 auto; align-self: center; width: .9em; height: .9em; border-radius: 3px;
  background: color-mix(in srgb, var(--cor) 55%, transparent); border: 2px solid var(--cor); font-size: var(--arr-fonte); }
.aula-live-lousa .aula-da__parte--tira .aula-da__cor { background: repeating-linear-gradient(45deg, var(--cor) 0 2px, transparent 2px 6px); }
.aula-live-lousa .aula-da__sinal { min-width: .8em; text-align: center; }
.aula-live-lousa .aula-pl__nome { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .9); }
.aula-live-lousa .aula-pl__vezes { font-family: var(--font-calc); font-size: var(--arr-fonte); font-weight: 700; white-space: nowrap; }
.aula-live-lousa .aula-pl__faces { align-items: center; }
/* G10. figura_regra_conta: a regra numa caixa; a substituída com cada medida na sua cor */
.aula-live-lousa .aula-fg__regra { border: 2px solid var(--arr-traco); border-radius: 10px; padding: 6px 16px; max-width: 100%; }
/* geometria: arranjos de conceito (agente-geometria) INICIO */
/* Arranjos de conceito do nicho Geometria (tipos_de_angulo, posicao_de_retas, classificar_triangulo, ponto_notavel,
   circunferencia_elementos, plano_quadrantes, quadriláteros, sólidos de revolução...): o desenho é do motor (SVG em
   360 × 260, na caixa de sempre; só a árvore e a tabela são largas). Painéis em grade: a caixa e, embaixo, a legenda (o nome
   na cor do desenho, o resto na cor da escrita). A cor de cada elemento vem de --cor (.aula-geo__cor, no envoltório). */
.aula-live-lousa .aula-arr--geometria-tipos_de_angulo,
.aula-live-lousa .aula-arr--geometria-angulos_relacao,
.aula-live-lousa .aula-arr--geometria-posicao_de_retas,
.aula-live-lousa .aula-arr--geometria-paralelas_pares,
.aula-live-lousa .aula-arr--geometria-paralelas_tipos,
.aula-live-lousa .aula-arr--geometria-classificar_triangulo,
.aula-live-lousa .aula-arr--geometria-desigualdade_triangular,
.aula-live-lousa .aula-arr--geometria-ponto_notavel,
.aula-live-lousa .aula-arr--geometria-pontos_notaveis_quatro,
.aula-live-lousa .aula-arr--geometria-quadrilateros_hierarquia,
.aula-live-lousa .aula-arr--geometria-quadrilatero_propriedades,
.aula-live-lousa .aula-arr--geometria-quadrilateros_tabela,
.aula-live-lousa .aula-arr--geometria-circunferencia_elementos,
.aula-live-lousa .aula-arr--geometria-reta_e_circunferencia,
.aula-live-lousa .aula-arr--geometria-revolucao_tres,
.aula-live-lousa .aula-arr--geometria-revolucao_um,
.aula-live-lousa .aula-arr--geometria-solido_obliquo,
.aula-live-lousa .aula-arr--geometria-plano_quadrantes,
.aula-live-lousa .aula-arr--geometria-par_ordenado { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.aula-live-lousa .aula-gx__grade { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 18px var(--arr-gap);
  width: 100%; justify-items: center; align-items: start; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gx__grade { grid-template-columns: repeat(var(--nm), minmax(0, 1fr)); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gx__grade > .aula-gx__painel:last-child:nth-child(odd) { grid-column: 1 / -1; }
.aula-live-lousa .aula-gx__painel { display: flex; flex-direction: column; align-items: center; gap: 6px; width: 100%; min-width: 0; }
.aula-live-lousa .aula-gx__leg { display: flex; flex-direction: column; align-items: center; text-align: center; max-width: 100%; }
.aula-live-lousa .aula-gx__nome .fig-solution { font-weight: 700; }
.aula-live-lousa .aula-gx__dica { line-height: 1.2; }
/* legenda pareada: uma linha por elemento (amostra da cor, nome na cor, definição na cor da escrita) */
.aula-live-lousa .aula-gx__lista { display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: baseline; gap: 7px .55em;
  max-width: 100%; }
.aula-live-lousa .aula-gx__lista--2 { grid-template-columns: auto minmax(0, 1fr); }
.aula-live-lousa .aula-gx__lista--afirm { grid-template-columns: auto minmax(0, 1fr) auto; }
.aula-live-lousa .aula-gx__item { display: contents; }
.aula-live-lousa .aula-gx__amostra { align-self: center; width: 1.1em; height: .5em; border-radius: 3px; background: var(--cor); font-size: var(--arr-fonte); }
.aula-live-lousa .aula-gx__lista .aula-arr__txt { text-align: left; }
.aula-live-lousa .aula-gx__lista .aula-gx__def .fig-solution { color: var(--quadro-giz); }
.aula-live-lousa .aula-gx__vale { font-weight: 700; font-size: calc(var(--arr-fonte) * 1.3); line-height: 1; }
.aula-live-lousa .aula-gx__vale--sim { color: var(--giz-verde); }
.aula-live-lousa .aula-gx__vale--nao { color: var(--giz-vermelho); }
/* desigualdade_triangular: a soma com cada número na cor do seu lado */
.aula-live-lousa .aula-gx__soma { display: flex; align-items: baseline; justify-content: center; flex-wrap: wrap; font-family: var(--font-calc);
  font-size: var(--arr-fonte); line-height: 1.3; }
.aula-live-lousa .aula-gx__n { font-weight: 700; }
.aula-live-lousa .aula-gx__soma span { white-space: pre; }
/* quadrilateros_hierarquia: a árvore larga */
.aula-live-lousa .aula-gx__arvore { width: 100%; max-width: 640px; }
.aula-live-lousa .aula-gx__arvore > svg { position: static; display: block; width: 100%; height: auto; aspect-ratio: 560 / 312; color: var(--quadro-giz); overflow: visible; }
/* quadrilateros_tabela: figura × propriedade; o ✓ na cor da coluna */
.aula-live-lousa .aula-gx__tabela { width: 100%; max-width: 700px; table-layout: auto; }
.aula-live-lousa .aula-gx__tabela th, .aula-live-lousa .aula-gx__tabela td { padding: 6px 4px; border-color: color-mix(in srgb, var(--quadro-giz) 55%, transparent); }
.aula-live-lousa .aula-gx__tabela .aula-gx__cab { font-size: calc(var(--arr-fonte) * .8); line-height: 1.15; }
.aula-live-lousa .aula-gx__tabela .aula-gx__cab .fig-solution { font-weight: 700; }
.aula-live-lousa .aula-gx__fig { text-align: left; }
.aula-live-lousa .aula-gx__fig > svg { position: static; display: block; width: 4.4em; max-width: 100%; height: auto; margin: 0 auto 2px; color: var(--quadro-giz); font-size: var(--arr-fonte); }
.aula-live-lousa .aula-gx__fig .aula-arr__txt { text-align: center; }
.aula-live-lousa .aula-gx__vale-tab { font-weight: 700; font-size: calc(var(--arr-fonte) * 1.35); color: var(--cor); }
.aula-live-lousa .aula-gx__cel:not(.aula-gx__cel--sim) .aula-gx__vale-tab { color: var(--quadro-giz); opacity: .35; font-weight: 400; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gx__tabela th, .aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gx__tabela td { padding: 4px 2px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gx__tabela .aula-gx__cab { font-size: calc(var(--arr-fonte) * .75); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gx__tabela th .aula-gx__cab { writing-mode: vertical-rl; transform: rotate(180deg); white-space: nowrap; margin: 0 auto; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gx__tabela .aula-gx__fig > svg { width: 3em; }
/* sólidos de revolução: uma coluna por sólido (figura plana, "gira", sólido); no celular, uma linha por sólido */
.aula-live-lousa .aula-gx__rev { display: flex; flex-direction: column; align-items: center; gap: 8px; width: 100%; min-width: 0; }
.aula-live-lousa .aula-gx__rev-fig { display: flex; flex-direction: column; align-items: center; gap: 2px; width: 100%; }
.aula-live-lousa .aula-gx__rev-leg { display: flex; flex-direction: column; align-items: center; text-align: center; max-width: 100%; }
.aula-live-lousa .aula-gx__gira { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .9); line-height: 1.2; text-align: center; }
.aula-live-lousa .aula-gx__gira-h { display: none; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gx__rev-fig { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; column-gap: 4px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gx__gira-v { display: none; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gx__gira-h { display: inline; }
.aula-live-lousa .aula-gx__medidas { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 .9em; }
.aula-live-lousa .aula-gx__medida .fig-solution { font-weight: 700; }
.aula-live-lousa .aula-gx__rev1-topo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(48px, .22fr) minmax(0, 1fr); align-items: center; width: 100%; }
.aula-live-lousa .aula-gx__rev1-topo > .aula-caixa { justify-self: center; }
/* solido_obliquo (id0316): como a revolucao_um (sólido, seta e triângulo lado a lado); no bloco estreito (< 420 px) só o sólido, na largura toda */
.aula-live-lousa .aula-obl--estreito .aula-obl__tri, .aula-live-lousa .aula-obl--estreito .aula-gx__rev1-topo .aula-seta { display: none; }
.aula-live-lousa .aula-obl--estreito .aula-gx__rev1-topo { grid-template-columns: minmax(0, 1fr); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gx__rev1-topo .aula-seta { height: auto; width: auto; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gx__rev1-topo .aula-seta__rotulo { left: 0; right: 0; top: auto; bottom: calc(50% + 12px);
  transform: none; text-align: center; }
.aula-live-lousa .aula-gx__par { font-size: 1.25em; }
.aula-live-lousa .aula-gx__rel { font-size: 1.1em; }
/* contas e trechos que não quebram no meio (o 'd = 2r' da legenda, as contas do ponto notável) */
.aula-live-lousa .aula-gx__nowrap { white-space: nowrap; }
.aula-live-lousa .aula-gx__contas { display: flex; flex-direction: column; align-items: center; gap: .35em; width: 100%; min-width: 0; }
.aula-live-lousa .aula-gx__conta { font-size: .82em; max-width: 100%; }
.aula-live-lousa .aula-gx__conta, .aula-live-lousa .aula-gx__conta * { white-space: nowrap; }
.aula-live-lousa .aula-arranjo .aula-gx__conta .fig-solution__line { white-space: nowrap; overflow-wrap: normal; font-size: .9em; }
.aula-live-lousa .aula-gx__linha { display: block; white-space: nowrap; }
/* geometria: arranjos de conceito (agente-geometria) FIM */
/* Nicho Estatística (nichos/estatistica.json): só conta e texto. Verde = o que conta (favorável, caminho seguido, destaque,
   evento); azul = o todo (espaço amostral, total da condição). As linhas da árvore e da cascata são um SVG por cima
   (.aula-es__linhas), medido pelo DOM. A cor de um número pintado vem de --cor. */
.aula-live-lousa .aula-arr--contagem-casas,
.aula-live-lousa .aula-arr--contagem-qual_formula,
.aula-live-lousa .aula-arr--probabilidade-arvore,
.aula-live-lousa .aula-arr--probabilidade-espaco_amostral,
.aula-live-lousa .aula-arr--probabilidade-tabela_contingencia { display: flex; flex-direction: column; align-items: safe center; gap: 16px; }
.aula-live-lousa .aula-es__t { font-family: var(--font-calc); font-size: var(--arr-fonte); line-height: 1.2; white-space: nowrap; }
.aula-live-lousa .aula-es__num, .aula-live-lousa .aula-es__cor .fig-solution { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-es__linhas { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.aula-live-lousa .aula-es__prob { display: flex; align-items: center; gap: .5em; }
/* E1. casas: as casinhas com o número grande, o × entre elas; o divisor sob um traço; '= conta = resultado' à direita */
.aula-live-lousa .aula-ca__tudo { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px 16px; max-width: 100%; }
.aula-live-lousa .aula-ca__fileira { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: center; gap: 10px 8px; max-width: 100%; }
.aula-live-lousa .aula-ca__casa { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; }
.aula-live-lousa .aula-ca__caixinha { display: flex; align-items: center; justify-content: center; min-width: 2.6em; height: 2.6em;
  padding: 0 .3em; border: 2px solid var(--arr-traco); border-radius: 8px; }
.aula-live-lousa .aula-ca__n { font-size: calc(var(--arr-fonte) * 1.45); font-weight: 700; }
.aula-live-lousa .aula-arranjo .aula-ca__rot { font-size: calc(var(--arr-fonte) * .78); max-width: 6.5em; text-align: center; }
.aula-live-lousa .aula-ca__vezes { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 1.2); line-height: 2.6em; }
.aula-live-lousa .aula-ca__quebra { display: none; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ca__quebra { display: block; flex-basis: 100%; height: 0; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ca__fileira { gap: 10px 5px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ca__caixinha { min-width: 2.3em; height: 2.3em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ca__vezes { line-height: 2.3em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ca__rot { width: min-content; max-width: none; }
.aula-live-lousa .aula-arranjo .aula-ca__rot .fig-solution__line { overflow-wrap: normal; word-break: keep-all; }   /* quebra entre palavras, nunca no meio */
.aula-live-lousa .aula-ca__fracao { display: flex; flex-direction: column; align-items: center; max-width: 100%; }
.aula-live-lousa .aula-ca__barra { align-self: stretch; border-top: 2px solid var(--quadro-giz); margin: 6px 0; }
.aula-live-lousa .aula-arranjo[data-modo="computador"] .aula-ca__fileira { flex-wrap: nowrap; }
.aula-live-lousa .aula-ca__igual { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px .5em; max-width: 100%; }
.aula-live-lousa .aula-ca__grupo { display: flex; align-items: center; gap: .5em; max-width: 100%; }
/* E2. qual_formula: a cascata das duas perguntas até as três contagens; o caminho seguido em verde, o resto apagado */
.aula-live-lousa .aula-qf { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-areas: "q1 q1 q1" ". q2 q2" "p a c"; column-gap: 18px; row-gap: 3.4em; justify-items: center; width: 100%; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-qf { grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-areas: "q1 q1" "p q2" "a c"; column-gap: 12px; }
.aula-live-lousa .aula-qf__no { position: relative; z-index: 1; border: 2px solid var(--arr-traco); border-radius: 10px; padding: 6px 12px;
  display: flex; flex-direction: column; align-items: center; gap: 4px; max-width: 100%; min-width: 0; }
.aula-live-lousa .aula-qf__no--p, .aula-live-lousa .aula-qf__no--a, .aula-live-lousa .aula-qf__no--c { align-self: start; }
.aula-live-lousa .aula-qf__no--q1 { grid-area: q1; } .aula-live-lousa .aula-qf__no--q2 { grid-area: q2; }
.aula-live-lousa .aula-qf__no--p { grid-area: p; } .aula-live-lousa .aula-qf__no--a { grid-area: a; } .aula-live-lousa .aula-qf__no--c { grid-area: c; }
.aula-live-lousa .aula-qf__no--seguido { border-color: var(--giz-verde); }
.aula-live-lousa .aula-qf__no--apagado { opacity: .38; }
.aula-live-lousa .aula-qf__no--p.aula-qf__no--seguido, .aula-live-lousa .aula-qf__no--a.aula-qf__no--seguido,
.aula-live-lousa .aula-qf__no--c.aula-qf__no--seguido { border-width: 3px; background: color-mix(in srgb, var(--giz-verde) 12%, transparent); }
.aula-live-lousa .aula-arranjo .aula-qf__nome { font-weight: 700; }
.aula-live-lousa .aula-qf__formula { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 .35em; max-width: 100%; }
.aula-live-lousa .aula-arranjo .aula-qf__formula .fig-solution__line { white-space: nowrap; overflow-wrap: normal; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-qf__formula .aula-arr__txt { font-size: calc(var(--arr-fonte) * .8); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-qf__no { padding: 6px 8px; }
.aula-live-lousa .aula-qf__resp { position: absolute; z-index: 1; font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .9);
  line-height: 1.2; white-space: nowrap; color: var(--quadro-giz); opacity: .45; }
.aula-live-lousa .aula-qf__resp--seguido { color: var(--giz-verde); font-weight: 700; opacity: 1; }
.aula-live-lousa .aula-qf__sit { max-width: 100%; text-align: center; }
.aula-live-lousa .aula-qf__fim { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 22px; max-width: 100%; }
.aula-live-lousa .aula-qf__fim .aula-arr__txt { text-align: center; }
/* E3. arvore: um nível por coluna (celular: por linha, quando cabe); a posição de cada peça vem de --e (nível),
   --f e --s (as folhas que ela cobre); a probabilidade fica sobre o trecho reto do ramo */
.aula-live-lousa .aula-ar { position: relative; display: grid; max-width: 100%;
  grid-template-columns: auto repeat(var(--niveis), minmax(1.2em, auto) auto) auto;
  grid-template-rows: auto repeat(var(--folhas), minmax(2.5em, auto)); column-gap: 20px; align-items: center; }
.aula-live-lousa .aula-ar > :not(svg) { grid-column: var(--e); grid-row: var(--f) / span var(--s); position: relative; z-index: 1; }
.aula-live-lousa .aula-ar__nivel { align-self: end; justify-self: center; font-size: calc(var(--arr-fonte) * .8); opacity: .8; padding-bottom: 4px; }
.aula-live-lousa .aula-ar__raiz { justify-self: center; width: 10px; height: 10px; border-radius: 50%; background: var(--arr-traco); }
.aula-live-lousa .aula-ar__no { justify-self: start; padding: 0 2px; }
.aula-live-lousa .aula-ar__p { justify-self: center; font-size: calc(var(--arr-fonte) * .82); }
.aula-live-lousa .aula-ar__no--destaque, .aula-live-lousa .aula-ar__p--destaque, .aula-live-lousa .aula-ar__prod { color: var(--giz-verde); font-weight: 700; }
.aula-live-lousa .aula-ar__prod { justify-self: start; padding: 0 6px 0 4px; }   /* o giz inclinado passa da caixa do texto */
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar[data-cima="1"] {
  grid-template-rows: auto repeat(var(--niveis), minmax(2.9em, auto) auto) auto;
  grid-template-columns: auto repeat(var(--folhas), minmax(0, auto)); column-gap: 8px; row-gap: 0; align-items: center; justify-items: center; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar[data-cima="1"] > :not(svg) { grid-row: var(--e); grid-column: var(--f) / span var(--s); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar[data-cima="1"] .aula-ar__nivel { justify-self: start; align-self: center; padding: 0 6px 0 0; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar[data-cima="1"] .aula-ar__no,
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar[data-cima="1"] .aula-ar__prod { justify-self: center; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar[data-cima="1"] .aula-ar__p { align-self: end; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar:not([data-cima="1"]) { column-gap: 8px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar:not([data-cima="1"]) .aula-es__t { font-size: calc(var(--arr-fonte) * .9); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar:not([data-cima="1"]) .aula-ar__nivel { white-space: normal; text-align: center;
  width: min-content; font-size: calc(var(--arr-fonte) * .78); }   /* o nome do nível não alarga a coluna */
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar--densa { font-size: .85em; column-gap: 14px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar--densa .aula-es__t { font-size: calc(var(--arr-fonte) * .85); }
/* E4. espaco_amostral: fichas (lista) ou tabela de dupla entrada (o motor faz as células); o todo em azul, o favorável em verde */
.aula-live-lousa .aula-ea__lista { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; max-width: 100%;
  border: 2px solid var(--giz-azul); border-radius: 14px; padding: 12px 14px; }
.aula-live-lousa .aula-ea__ficha { border: 2px solid transparent; border-radius: 999px; padding: 2px 12px; }
.aula-live-lousa .aula-ea__ficha--fav { border-color: var(--giz-verde); background: color-mix(in srgb, var(--giz-verde) 16%, transparent); }
.aula-live-lousa .aula-ea__ficha--fav .fig-solution { color: var(--giz-verde); font-weight: 700; }
.aula-live-lousa .aula-ea__tabela { width: auto; max-width: 100%; table-layout: auto; outline: 3px solid var(--giz-azul); outline-offset: -1px; }
.aula-live-lousa .aula-ea__tabela th, .aula-live-lousa .aula-ea__tabela td { padding: 5px 10px; }
.aula-live-lousa .aula-ea__tabela td.aula-ea__fav { background: color-mix(in srgb, var(--giz-verde) 30%, transparent); }
.aula-live-lousa .aula-ea__tabela td.aula-ea__fav .fig-solution { color: var(--giz-verde); font-weight: 700; }
.aula-live-lousa .aula-ea__op .fig-solution { font-weight: 700; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ea__tabela--larga { width: 100%; table-layout: fixed; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ea__tabela--larga th,
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ea__tabela--larga td { padding: 4px 2px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ea__tabela--larga .aula-arr__txt { font-size: calc(var(--arr-fonte) * .85); }
.aula-live-lousa .aula-ea__evento { max-width: 100%; }
/* E5. tabela_contingencia: títulos, totais do motor; o universo da condição em azul, o resto apagado, o evento circulado */
.aula-live-lousa .aula-ct__tabela { width: auto; max-width: 100%; table-layout: auto; }
.aula-live-lousa .aula-ct__tabela th, .aula-live-lousa .aula-ct__tabela td { padding: 6px 12px; }
.aula-live-lousa .aula-ct__tabela .aula-ct__canto { border: 0; background: none; }
.aula-live-lousa .aula-ct__tabela .aula-ct__titulo { font-weight: 400; font-style: italic; }
.aula-live-lousa .aula-ct__tabela .aula-ct__total { background: color-mix(in srgb, var(--arr-traco) 8%, transparent); }
.aula-live-lousa .aula-ct__tabela .aula-ct__univ { background: color-mix(in srgb, var(--giz-azul) 22%, transparent); }
.aula-live-lousa .aula-ct__tabela .aula-ct__apagado { opacity: .35; }
.aula-live-lousa .aula-ct__tabela .aula-ct__evento .fig-solution,
.aula-live-lousa .aula-ct__tabela .aula-ct__denominador .fig-solution { border: 3px solid var(--giz-verde); border-radius: 999px; padding: 0 .45em;
  font-weight: 700; color: var(--giz-verde); }
.aula-live-lousa .aula-ct__tabela .aula-ct__denominador .fig-solution { border-color: var(--giz-azul); color: var(--giz-azul); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ct__tabela th,
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ct__tabela td { padding: 4px 5px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ct__tabela .aula-arr__txt { font-size: calc(var(--arr-fonte) * .85); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ct__tabela--larga th,
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ct__tabela--larga td { padding: 3px 3px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ct__tabela--larga .aula-arr__txt { font-size: calc(var(--arr-fonte) * .72); }
/* Os arranjos novos de contagem e probabilidade (id0228) e os ícones de giz do campo `desenho` */
.aula-live-lousa .aula-arr--contagem-casos,
.aula-live-lousa .aula-arr--contagem-caminhos,
.aula-live-lousa .aula-arr--contagem-ligacoes,
.aula-live-lousa .aula-arr--contagem-circular,
.aula-live-lousa .aula-arr--contagem-barras,
.aula-live-lousa .aula-arr--contagem-binomio,
.aula-live-lousa .aula-arr--probabilidade-sem_ordem,
.aula-live-lousa .aula-arr--probabilidade-complemento { display: flex; flex-direction: column; align-items: safe center; gap: 16px; }
/* `safe center`: o que não cabe vaza só para a direita, e o motor de página (que mede o scrollWidth) vê e reduz a escala;
   com `center` a metade da esquerda vazava escondida */
/* `.math-figure__drawing svg` (06-lousa.css) põe TODO svg da lousa em absoluto, esticado: os desenhos daqui voltam ao fluxo */
.aula-live-lousa .aula-ic, .aula-live-lousa .aula-cm__malha, .aula-live-lousa .aula-lg__roda, .aula-live-lousa .aula-ci__mesa,
.aula-live-lousa .aula-cp__venn { position: static; inset: auto; }
.aula-live-lousa .aula-ic { width: 1.9em; height: 1.9em; flex: 0 0 auto; overflow: visible; color: var(--arr-traco); }
.aula-live-lousa .aula-com-ic { display: inline-flex; align-items: center; gap: .25em; }
.aula-live-lousa .aula-ca__casa > .aula-ic { width: 2.3em; height: 2.3em; }
.aula-live-lousa .aula-ar__no.aula-com-ic .aula-ic { width: 1.6em; height: 1.6em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar__no.aula-com-ic .aula-ic { width: 1.15em; height: 1.15em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar__no.aula-com-ic { gap: .12em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ar--densa .aula-ar__no .aula-ic { display: none; }   /* mais de 12 folhas: só o texto */
.aula-live-lousa .aula-ea__moedas { display: inline-flex; gap: 1px; }
.aula-live-lousa .aula-ea__moedas .aula-ic { width: 1.6em; height: 1.6em; }
/* o dado (ou as moedas) em cima do texto: um invólucro DENTRO da célula (a célula da tabela continua célula) */
.aula-live-lousa .aula-ea__dado, .aula-live-lousa .aula-ea__ficha:has(> .aula-ea__moedas) { display: inline-flex; flex-direction: column;
  align-items: center; gap: 0; }
.aula-live-lousa .aula-ea__tabela th .aula-ic { width: 1.7em; height: 1.7em; }
.aula-live-lousa .aula-arranjo .aula-ea__sob { font-size: calc(var(--arr-fonte) * .7); line-height: 1; opacity: .8; }
.aula-live-lousa .aula-ea__com { display: inline-flex; align-items: center; gap: .3em; }
/* C1. casos: a casa com regra em destaque, a regra em cima, a ordem num numerozinho redondo; os casos um embaixo do outro */
.aula-live-lousa .aula-cs__conj { max-width: 100%; text-align: center; }
.aula-live-lousa .aula-cs__casos { display: flex; flex-direction: column; align-items: center; gap: 18px; max-width: 100%; }
.aula-live-lousa .aula-cs__caso { display: flex; flex-direction: column; align-items: center; gap: 4px; max-width: 100%; }
.aula-live-lousa .aula-arranjo .aula-cs__nome { font-style: italic; opacity: .85; }
.aula-live-lousa .aula-cs__linha { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 14px; max-width: 100%; }
.aula-live-lousa .aula-cs__fileira { align-items: flex-start; column-gap: 10px; }
.aula-live-lousa .aula-cs__fileira .aula-ca__caixinha { margin-left: .5em; }   /* o lugar do numerozinho da ordem, longe do × */
/* o × na altura do meio da casinha (em cima dela há a linha da regra, vazia ou não) */
.aula-live-lousa .aula-cs__fileira .aula-ca__vezes { margin-top: calc(var(--arr-fonte) * .75 + 4px); }
.aula-live-lousa .aula-arranjo .aula-cs__regra { min-height: 1.3em; font-size: calc(var(--arr-fonte) * .78); color: var(--giz-amarelo); font-weight: 700;
  text-align: center; white-space: nowrap; }
.aula-live-lousa .aula-arranjo .aula-cs__regra .fig-solution { color: var(--giz-amarelo); }
.aula-live-lousa .aula-ca__caixinha { position: relative; }
.aula-live-lousa .aula-cs__restrita { border-color: var(--giz-amarelo); border-width: 3px; background: color-mix(in srgb, var(--giz-amarelo) 14%, transparent); }
.aula-live-lousa .aula-cs__ordem { position: absolute; top: -.75em; left: -.75em; width: 1.45em; height: 1.45em; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .7);
  background: var(--quadro-bg); border: 2px solid var(--arr-traco); line-height: 1; }
.aula-live-lousa .aula-cs__restrita .aula-cs__ordem { border-color: var(--giz-amarelo); color: var(--giz-amarelo); font-weight: 700; }
/* C2. caminhos: a malha do motor com o exemplo na cor chamativa; a legenda, o anagrama colorido e quantos passos */
.aula-live-lousa .aula-cm__fig { display: flex; justify-content: center; min-width: 0; width: 100%; }
.aula-live-lousa .aula-cm__fig > svg { width: 100%; max-width: calc(var(--w) * 1px); height: auto; overflow: visible; color: var(--quadro-giz); }
.aula-live-lousa .aula-cm__malha text, .aula-live-lousa .aula-lg__roda text, .aula-live-lousa .aula-cp__venn text,
.aula-live-lousa .aula-ci__mesa text { font-family: var(--font-calc); }
.aula-live-lousa .aula-cm__legenda { display: flex; flex-direction: column; gap: 2px; }
.aula-live-lousa .aula-cm__passo { display: flex; align-items: baseline; gap: .45em; color: var(--cor); }
.aula-live-lousa .aula-cm__passo .fig-solution { color: var(--cor); }
.aula-live-lousa .aula-cm__seta { font-size: 1.3em; font-weight: 700; }
.aula-live-lousa .aula-cm__letra { font-family: var(--font-calc); font-weight: 700; font-size: calc(var(--arr-fonte) * 1.1); }
.aula-live-lousa .aula-cm__anagrama { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; max-width: 100%; }
.aula-live-lousa .aula-cm__ficha { display: inline-flex; flex-direction: column; align-items: center; min-width: 1.6em; padding: 2px 4px;
  border: 2px solid var(--cor); border-radius: 6px; color: var(--cor); font-family: var(--font-calc); }
.aula-live-lousa .aula-cm__l { font-weight: 700; font-size: calc(var(--arr-fonte) * 1.1); line-height: 1.1; }
.aula-live-lousa .aula-cm__i { font-size: calc(var(--arr-fonte) * .62); line-height: 1; color: var(--quadro-giz); opacity: .75; }
.aula-live-lousa .aula-cm__num text { font-weight: 700; }
/* C3. ligações e C4. mesa redonda: os desenhos do motor; a amostra da ligação */
.aula-live-lousa .aula-lg__lig { display: flex; align-items: center; gap: .5em; }
.aula-live-lousa .aula-lg__amostra { width: 2em; border-top: 4px solid color-mix(in srgb, var(--giz-amarelo) 62%, var(--giz-vermelho)); border-radius: 2px; }
.aula-live-lousa .aula-ci__mesas { display: grid; grid-template-columns: minmax(120px, 1fr) auto minmax(120px, 1fr); align-items: center; gap: 8px; width: 100%; }
.aula-live-lousa .aula-ci__mesa { width: 100%; min-width: 120px; max-width: 280px; height: auto; justify-self: center; overflow: visible; color: var(--quadro-giz); }
.aula-live-lousa .aula-ci__mesas .aula-op { font-size: 1.6em; }
/* C5. barras: bolinhas e barras; embaixo de cada trecho o grupo (na cor dele) e quantas recebeu */
.aula-live-lousa .aula-br__fila { display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; gap: 10px 6px; max-width: 100%; }
.aula-live-lousa .aula-br__trecho { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 2.6em; }
.aula-live-lousa .aula-br__bolas { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; min-height: 1.3em; max-width: 7.5em; }
.aula-live-lousa .aula-br__bola { width: 1.05em; height: 1.05em; border-radius: 50%; background: var(--cor); border: 2px solid var(--arr-traco); font-size: var(--arr-fonte); }
.aula-live-lousa .aula-br__barra { width: 0; border-left: 4px solid var(--arr-traco); border-radius: 2px; align-self: stretch; margin: 0 4px; }
.aula-live-lousa .aula-br__nome { color: var(--cor); }
.aula-live-lousa .aula-br__nome .fig-solution { color: var(--cor); }
.aula-live-lousa .aula-arranjo .aula-br__qtd { font-weight: 700; }
/* C6. binômio: o triângulo de Pascal (a linha n em azul, o termo k circulado); a expansão com os coeficientes em azul */
.aula-live-lousa .aula-bn__pascal { display: flex; flex-direction: column; align-items: center; gap: 2px; font-family: var(--font-calc); }
.aula-live-lousa .aula-bn__linha { display: flex; justify-content: center; gap: .5em; font-size: calc(var(--arr-fonte) * .95); }
.aula-live-lousa .aula-bn__c { min-width: 1.7em; text-align: center; border: 2px solid transparent; border-radius: 999px; padding: 0 .1em; }
.aula-live-lousa .aula-bn__linha--n { color: var(--giz-azul); font-weight: 700; background: color-mix(in srgb, var(--giz-azul) 14%, transparent); border-radius: 8px; }
.aula-live-lousa .aula-bn__c--k { border-color: color-mix(in srgb, var(--giz-amarelo) 62%, var(--giz-vermelho)); }
.aula-live-lousa .aula-bn__expansao { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px .3em; max-width: 100%; }
.aula-live-lousa .aula-bn__termo { border: 2px solid transparent; border-radius: 8px; padding: 0 .2em; }
.aula-live-lousa .aula-bn__termo--k { border-color: color-mix(in srgb, var(--giz-amarelo) 62%, var(--giz-vermelho)); }
.aula-live-lousa .aula-bn__tabela { width: auto; max-width: 100%; table-layout: auto; }
.aula-live-lousa .aula-bn__tabela th, .aula-live-lousa .aula-bn__tabela td { padding: 4px 8px; }
.aula-live-lousa .aula-bn__tabela .aula-bn__col--k { background: color-mix(in srgb, var(--giz-amarelo) 22%, transparent); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-bn__tabela th, .aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-bn__tabela td { padding: 3px 3px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-bn__linha { gap: .2em; font-size: calc(var(--arr-fonte) * .82); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-bn__c { min-width: 1.45em; }
/* (agente-contagem) inicio: complementar, fatorial, bloco, separados, grupos, pelo menos, restricoes */
/* Cores com função nestes arranjos: azul = o todo (total, o fatorial que se corta), vermelho = o que se tira (nenhum), verde = o que se
   quer (o tipo desejado, o resultado), amarelo = o que se multiplica ou se expande. Tudo sob .aula-live-lousa. */
.aula-live-lousa .aula-arr--contagem-complementar_grupo,
.aula-live-lousa .aula-arr--contagem-complementar_casas,
.aula-live-lousa .aula-arr--contagem-fatorial,
.aula-live-lousa .aula-arr--contagem-fatorial_fracao,
.aula-live-lousa .aula-arr--contagem-fatorial_algebrico { display: flex; flex-direction: column; align-items: safe center; gap: 16px; }
/* peças comuns: um número pintado, um grupo de objetos (bonecos, bolas, fichas) com o nome embaixo, o ✕ do que sai */
.aula-live-lousa .aula-ctg__num { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-ctg__pool { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 6px 28px; max-width: 100%; }
.aula-live-lousa .aula-ctg__grupo { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; max-width: 100%; }
.aula-live-lousa .aula-ctg__objs { display: flex; flex-wrap: wrap; gap: 2px; max-width: 100%; }
.aula-live-lousa .aula-ctg__obj { position: relative; display: inline-flex; align-items: center; justify-content: center; }
.aula-live-lousa .aula-ctg__obj .aula-ic { width: 2.5em; height: 2.5em; }
.aula-live-lousa .aula-ctg__ficha { display: inline-flex; align-items: center; justify-content: center; width: 1.9em; height: 1.9em; border-radius: 50%;
  background: color-mix(in srgb, var(--cor) 40%, transparent); border: 2px solid var(--cor); font-family: var(--font-calc); font-weight: 700; }
.aula-live-lousa .aula-ctg__obj--fora > * { opacity: .28; }
.aula-live-lousa .aula-ctg__obj--fora::after { content: '✕'; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  color: var(--giz-vermelho); font-family: var(--font-calc); font-size: 1.7em; font-weight: 700; line-height: 1; }
.aula-live-lousa .aula-arranjo .aula-ctg__nome { color: var(--cor); font-size: calc(var(--arr-fonte) * .85); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ctg__obj .aula-ic { width: 1.9em; height: 1.9em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ctg__ficha { width: 1.4em; height: 1.4em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ctg__pool { gap: 6px 16px; }
/* complementar_grupo: Total / Sem / Pelo menos 1 */
.aula-live-lousa .aula-cpg__sit { max-width: 100%; text-align: center; }
.aula-live-lousa .aula-cpg__linha { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 16px; row-gap: 4px; align-items: center;
  width: 100%; max-width: 640px; }
.aula-live-lousa .aula-cpg__linha > .aula-ctg__pool { grid-column: 1 / -1; }
.aula-live-lousa .aula-arranjo .aula-cpg__titulo { font-weight: 700; color: var(--cor); }
.aula-live-lousa .aula-cpg__conta > .aula-arr__txt { color: var(--cor); }
.aula-live-lousa .aula-cpg__conta > .aula-faixa { width: fit-content; max-width: 100%; }
/* complementar_casas: as fileiras de casinhas alinhadas, cada uma na cor da linha */
.aula-live-lousa .aula-cpg__linha > .aula-cpc__fileira { grid-column: 1 / -1; justify-self: start; }
.aula-live-lousa .aula-cpg__linha .aula-ca__n { color: var(--cor); text-align: center; line-height: 1.1; }
.aula-live-lousa .aula-cpg__linha .aula-ca__n .fig-solution__line { text-align: center; }
.aula-live-lousa .aula-cpg__linha .aula-ca__caixinha { border-color: var(--cor); }
.aula-live-lousa .aula-arranjo .aula-cpc__fantasma { height: 0; margin-top: -4px; visibility: hidden; overflow: hidden; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-cpc__fileira { row-gap: 4px; }
/* fatorial: as fichas n × (n − 1) × … × 1; as de fora em amarelo, as do fatorial guardado em azul com a chave embaixo */
.aula-live-lousa .aula-fat__linha { --fh: calc(var(--arr-fonte) * 2.4); display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: center;
  gap: 8px 6px; max-width: 100%; }
.aula-live-lousa .aula-fat__fichas { display: flex; flex-wrap: nowrap; align-items: flex-start; gap: 6px; }
.aula-live-lousa .aula-fat__ficha { display: inline-flex; align-items: center; justify-content: center; min-width: var(--fh); height: var(--fh);
  padding: 0 .3em; border: 2px solid var(--cor, var(--arr-traco)); border-radius: 10px; color: var(--cor, var(--quadro-giz)); font-family: var(--font-calc);
  font-size: calc(var(--arr-fonte) * 1.15); font-weight: 700; background: color-mix(in srgb, var(--cor, transparent) 14%, transparent); }
.aula-live-lousa .aula-fat__vezes { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 1.2); line-height: var(--fh); }
.aula-live-lousa .aula-fat__guardado { display: flex; flex-direction: column; align-items: stretch; }
.aula-live-lousa .aula-fat__chave { margin-top: 4px; border: 2px solid var(--giz-azul); border-top: none; border-radius: 0 0 12px 12px; text-align: center;
  color: var(--giz-azul); font-family: var(--font-calc); font-weight: 700; font-size: calc(var(--arr-fonte) * 1.05); padding: 0 .4em 1px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-fat__linha { --fh: calc(var(--arr-fonte) * 1.9); gap: 8px 3px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-fat__fichas { gap: 3px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-fat__ficha { padding: 0 .15em; font-size: var(--arr-fonte); border-radius: 8px; }
/* fatorial_fracao e fatorial_algebrico: a fração em linhas, cada uma depois de um "="; o fatorial cortado em azul, o resto em amarelo */
.aula-live-lousa .aula-fat__passos { display: grid; grid-template-columns: auto minmax(0, auto); justify-content: center; align-items: center;
  column-gap: .6em; row-gap: 14px; max-width: 100%; }
.aula-live-lousa .aula-fat__igual { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 1.4); justify-self: end; }
.aula-live-lousa .aula-fat__passos > .aula-faixa { justify-self: start; }
.aula-live-lousa .aula-fat__prod { display: inline-flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 0 .35em; min-width: 0;
  font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 1.3); }
.aula-live-lousa .aula-fat__fr { display: inline-flex; flex-direction: column; align-items: center; justify-self: start; min-width: 0; max-width: 100%; }
.aula-live-lousa .aula-fat__barra { align-self: stretch; border-top: 2px solid var(--quadro-giz); margin: 3px 0; }
.aula-live-lousa .aula-fat__termo--corta { color: var(--giz-azul); font-weight: 700; text-decoration: line-through; text-decoration-thickness: 2px; }
.aula-live-lousa .aula-fat__termo--resto { color: var(--giz-amarelo); font-weight: 700; }
.aula-live-lousa .aula-fat__ponto { opacity: .7; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-fat__prod { font-size: calc(var(--arr-fonte) * 1.15); }
.aula-live-lousa .aula-fat__item { display: inline-flex; align-items: baseline; gap: 0 .35em; white-space: nowrap; }
.aula-live-lousa .aula-fat__grupo { display: inline-flex; align-items: baseline; gap: 0 .35em; }
.aula-live-lousa .aula-fat__grupo::before { content: '('; color: var(--giz-amarelo); }
.aula-live-lousa .aula-fat__grupo::after { content: ')'; color: var(--giz-amarelo); }
.aula-live-lousa .aula-fat__passos > .aula-fat__prod { justify-self: start; }
.aula-live-lousa .aula-fat__passos > .aula-faixa .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.3); }
.aula-live-lousa .aula-fat__passos > .aula-faixa .fig-solution__line { white-space: nowrap; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-fat__passos > .aula-faixa .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.05); }
/* bloco_junto, separados_complementar e separados_encaixe: a fila de pessoas (boneco e nome), o bloco com a chave embaixo, as
   casinhas de cada fator na cor dele (azul = os que se arrumam à parte, laranja = os que ficam juntos ou se encaixam, vermelho = o que se tira) */
.aula-live-lousa .aula-arr--contagem-bloco_junto,
.aula-live-lousa .aula-arr--contagem-separados_complementar,
.aula-live-lousa .aula-arr--contagem-separados_encaixe { display: flex; flex-direction: column; align-items: safe center; gap: 16px; }
.aula-live-lousa .aula-ctg__fator--cima { align-items: flex-end; }
.aula-live-lousa .aula-arranjo[data-modo="computador"] .aula-ctg__fator { flex-wrap: wrap; }
.aula-live-lousa .aula-ctg__fator .aula-ca__caixinha, .aula-live-lousa .aula-cpc__fileira .aula-ca__caixinha {
  height: calc(var(--arr-fonte) * 2.6); min-width: calc(var(--arr-fonte) * 2.6); }
.aula-live-lousa .aula-ctg__fator .aula-ca__vezes, .aula-live-lousa .aula-cpc__fileira .aula-ca__vezes { line-height: calc(var(--arr-fonte) * 2.6); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ctg__fator .aula-ca__caixinha,
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-cpc__fileira .aula-ca__caixinha { height: calc(var(--arr-fonte) * 2.3); min-width: calc(var(--arr-fonte) * 2.3); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-ctg__fator .aula-ca__vezes,
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-cpc__fileira .aula-ca__vezes { line-height: calc(var(--arr-fonte) * 2.3); }
.aula-live-lousa .aula-ctg__fator .aula-ca__caixinha { border-color: var(--cor); }
.aula-live-lousa .aula-ctg__fator .aula-ca__n { color: var(--cor); text-align: center; line-height: 1.1; }
.aula-live-lousa .aula-ctg__fator .aula-ca__n .fig-solution__line { text-align: center; }
.aula-live-lousa .aula-arranjo .aula-ctg__valor { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-blo__linha { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 26px; max-width: 100%; }
.aula-live-lousa .aula-blo__passo { display: flex; flex-direction: column; align-items: center; gap: 4px; max-width: 100%; }
.aula-live-lousa .aula-blo__fila { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 6px 8px; min-width: 0; max-width: 100%; }
.aula-live-lousa .aula-cpg__linha > .aula-blo__fila { grid-column: 1 / -1; }
.aula-live-lousa .aula-blo__fator { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 0; max-width: 100%; }
.aula-live-lousa .aula-blo__pessoa { display: inline-flex; flex-direction: column; align-items: center; }
.aula-live-lousa .aula-blo__pessoa .aula-ic { width: 2.6em; height: 2.6em; }
.aula-live-lousa .aula-arranjo .aula-blo__nome { color: var(--cor, var(--quadro-giz)); font-size: calc(var(--arr-fonte) * .8); line-height: 1.1; }
.aula-live-lousa .aula-blo__pessoa--ficha { border: 2px solid var(--cor, var(--arr-traco)); border-radius: 999px; padding: 1px .7em; }
.aula-live-lousa .aula-blo__bloco { display: inline-flex; align-items: flex-end; gap: 6px; padding: 0 .4em .3em; border: 3px solid var(--cor);
  border-top: none; border-radius: 0 0 14px 14px; }
.aula-live-lousa .aula-blo__ordens { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 0; max-width: 100%; }
.aula-live-lousa .aula-blo__ordem { display: inline-flex; align-items: flex-end; gap: 4px; padding: 0 .7em; }
.aula-live-lousa .aula-blo__ordem:not(:last-of-type) { border-right: 2px dotted var(--cor); }
.aula-live-lousa .aula-blo__ordem .aula-ic { width: 2em; height: 2em; }
.aula-live-lousa .aula-blo__espaco { display: inline-flex; align-items: center; justify-content: center; align-self: center; width: 1.8em; height: 1.8em;
  border: 2px dashed var(--cor); border-radius: 50%; color: var(--cor); font-family: var(--font-calc); font-weight: 700; font-size: calc(var(--arr-fonte) * .85); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-blo__pessoa .aula-ic { width: 2.1em; height: 2.1em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-blo__ordem .aula-ic { width: 1.7em; height: 1.7em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-blo__ordem { padding: 0 .4em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-blo__linha { gap: 10px 14px; }
/* grupos, pelo_menos e combinacao_fixos: grupos de objetos escolhidos (em destaque) ou não (apagados), os dois caminhos do "pelo menos" e os
   obrigatórios (verde, ✓) e excluídos (vermelho, ✕). */
.aula-live-lousa .aula-arr--contagem-grupos,
.aula-live-lousa .aula-arr--contagem-pelo_menos,
.aula-live-lousa .aula-arr--contagem-combinacao_fixos { display: flex; flex-direction: column; align-items: safe center; gap: 16px; }
.aula-live-lousa .aula-grp__grupos { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: center; gap: 12px 14px; max-width: 100%; }
.aula-live-lousa .aula-grp__grupo { display: flex; flex-direction: column; align-items: center; gap: 2px; max-width: min(100%, 26em); }
.aula-live-lousa .aula-grp__grupo .aula-ctg__obj .aula-ic { width: 2.2em; height: 2.2em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-grp__grupos { flex-direction: column; align-items: center; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-grp__grupo .aula-ctg__obj .aula-ic { width: 1.8em; height: 1.8em; }
.aula-live-lousa .aula-grp__grupo .aula-ctg__objs { justify-content: center; }
.aula-live-lousa .aula-grp__vezes { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 1.6); align-self: center; }
.aula-live-lousa .aula-grp__fora > * { opacity: .3; }
.aula-live-lousa .aula-grp__conta { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-grp__conta .aula-ctg__num { color: var(--cor); }
/* pelo_menos: duas colunas, uma linha por caso; embaixo as duas respostas com um = entre elas */
.aula-live-lousa .aula-plm__colunas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px 30px; width: 100%; align-items: start; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-plm__colunas { grid-template-columns: minmax(0, 1fr); }
.aula-live-lousa .aula-plm__coluna { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; max-width: 100%; }
.aula-live-lousa .aula-plm__linha { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; max-width: 100%; }
.aula-live-lousa .aula-plm__linha .aula-arr__txt { color: var(--cor); }
.aula-live-lousa .aula-arranjo .aula-plm__linha .aula-arr__txt .fig-solution__line { white-space: nowrap; overflow-wrap: normal; }
.aula-live-lousa .aula-plm__comp { display: flex; flex-wrap: nowrap; gap: 1px; }
.aula-live-lousa .aula-plm__comp .aula-ic { width: 1.7em; height: 1.7em; }
.aula-live-lousa .aula-plm__comp .aula-ctg__ficha { width: 1.5em; height: 1.5em; }
.aula-live-lousa .aula-arranjo .aula-plm__resp { background: color-mix(in srgb, var(--giz-amarelo) 16%, transparent); padding: 4px 18px; border-radius: 8px;
  width: fit-content; max-width: 100%; }
.aula-live-lousa .aula-plm__iguais { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 14px; max-width: 100%; }
.aula-live-lousa .aula-plm__iguais .aula-op { font-size: 1.5em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-plm__iguais { flex-direction: column; align-items: stretch; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-plm__comp .aula-ic { width: 1.45em; height: 1.45em; }
/* combinacao_fixos: dentro, fora e livres */
.aula-live-lousa .aula-cfx__pool { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: center; gap: 12px 30px; max-width: 100%; }
.aula-live-lousa .aula-cfx__grupo { display: flex; flex-direction: column; align-items: center; gap: 4px; max-width: min(100%, 16em); }
.aula-live-lousa .aula-arranjo .aula-cfx__titulo { font-weight: 700; color: var(--cor); }
.aula-live-lousa .aula-cfx__itens { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: center; gap: 4px 8px; }
.aula-live-lousa .aula-cfx__um { display: inline-flex; flex-direction: column; align-items: center; }
.aula-live-lousa .aula-arranjo .aula-cfx__nome { color: var(--cor); font-size: calc(var(--arr-fonte) * .85); line-height: 1.1; }
.aula-live-lousa .aula-cfx__dentro::after { content: '✓'; position: absolute; top: -.2em; right: -.3em; color: var(--giz-verde); font-family: var(--font-calc); font-size: 1.3em;
  font-weight: 700; line-height: 1; }
.aula-live-lousa .aula-cfx__fora > * { opacity: .3; }
.aula-live-lousa .aula-cfx__fora::after { content: '✕'; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--giz-vermelho);
  font-family: var(--font-calc); font-size: 1.7em; font-weight: 700; line-height: 1; }
.aula-live-lousa .aula-arranjo .aula-cfx__vagas { text-align: center; max-width: 100%; }
/* (agente-contagem) fim */
/* P1. sem_ordem: os objetos de cada grupo; uma ordem; todas as ordens; probabilidade = ordens × uma ordem */
.aula-live-lousa .aula-so__urna { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px; max-width: 100%; }
.aula-live-lousa .aula-so__urna--figura { width: 100%; }
.aula-live-lousa .aula-so__urna--figura .aula-caixa { width: 100%; max-width: min(var(--arr-caixa), 420px); height: auto; aspect-ratio: 360 / 260; }
.aula-live-lousa .aula-so__grupo { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.aula-live-lousa .aula-so__objs { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px; max-width: 12em; }
.aula-live-lousa .aula-so__objs .aula-ic { width: 1.7em; height: 1.7em; }
.aula-live-lousa .aula-arranjo .aula-so__nome { color: var(--cor); }
.aula-live-lousa .aula-arranjo .aula-so__nome .fig-solution { color: var(--cor); }
.aula-live-lousa .aula-so__chip { display: inline-flex; align-items: center; justify-content: center; width: 1.5em; height: 1.5em; border-radius: 50%;
  background: color-mix(in srgb, var(--cor) 45%, transparent); border: 2px solid var(--cor); font-family: var(--font-calc); font-weight: 700; }
.aula-live-lousa .aula-so__seq { display: inline-flex; gap: 2px; align-items: center; }
.aula-live-lousa .aula-so__seq .aula-ic { width: 1.5em; height: 1.5em; }
.aula-live-lousa .aula-so__uma { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 14px; max-width: 100%;
  padding: 4px 12px; border: 2px dashed var(--arr-traco); border-radius: 10px; }
.aula-live-lousa .aula-so__todas { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 16px; max-width: 100%; }
.aula-live-lousa .aula-so__ordens { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 14px; max-width: 30em; }
.aula-live-lousa .aula-so__mais { font-family: var(--font-calc); font-size: 1.3em; align-self: center; }
/* P2. complemento: o Venn do motor; as partes com a cor de cada uma */
.aula-live-lousa .aula-cp__partes { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; max-width: 100%; }
.aula-live-lousa .aula-cp__parte { display: flex; align-items: center; flex-wrap: wrap; gap: 0 .55em; max-width: 100%; }
.aula-live-lousa .aula-arranjo .aula-cp__nome { font-size: calc(var(--arr-fonte) * .9); }
/* Probabilidade, arranjos novos (agente-probabilidade): exclusivos, uniao_fichas, uniao, variavel_aleatoria, valor_esperado,
   esperado_equilibrio e a geométrica (alvo, segmento, ponteiro). Cor com função: A azul, B verde, o que é dos dois laranja
   (--pr-laranja); azul = a probabilidade e o todo, verde = o que conta e o favorável, vermelho = o negativo. O tamanho das
   barras, do alvo, da régua e das fatias vem do motor (SVG). */
.aula-live-lousa .aula-arr--probabilidade-exclusivos,
.aula-live-lousa .aula-arr--probabilidade-uniao_fichas,
.aula-live-lousa .aula-arr--probabilidade-uniao,
.aula-live-lousa .aula-arr--probabilidade-variavel_aleatoria,
.aula-live-lousa .aula-arr--probabilidade-valor_esperado,
.aula-live-lousa .aula-arr--probabilidade-esperado_equilibrio,
.aula-live-lousa .aula-arr--probabilidade-geometrica_alvo,
.aula-live-lousa .aula-arr--probabilidade-geometrica_segmento,
.aula-live-lousa .aula-arr--probabilidade-geometrica_ponteiro { display: flex; flex-direction: column; align-items: safe center; gap: 16px;
  --pr-laranja: color-mix(in srgb, var(--giz-amarelo) 62%, var(--giz-vermelho)); }
.aula-live-lousa .aula-pr__svg { position: static; inset: auto; }
.aula-live-lousa .aula-pr__svg text { font-family: var(--font-calc); }
.aula-live-lousa .aula-pr__alvo text, .aula-live-lousa .aula-pr__regua text { paint-order: stroke; stroke: var(--quadro-bg); stroke-width: 4px; stroke-linejoin: round; }
.aula-live-lousa .aula-arranjo .aula-pr__cor, .aula-live-lousa .aula-arranjo .aula-pr__cor .fig-solution { color: var(--cor); }
/* a conta cortada nos "=": a linha quebra entre os lados (só parte um lado se ele sozinho passa da largura), e o operador de um termo anda junto com ele */
.aula-live-lousa .aula-pr__lados { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0 .45em; max-width: 100%; }
.aula-live-lousa .aula-pr__grupo { display: inline-flex; align-items: center; gap: .4em; white-space: nowrap; }
.aula-live-lousa .aula-arranjo .aula-pr__lados > .aula-arr__txt, .aula-live-lousa .aula-arranjo .aula-pr__fim > .aula-arr__txt,
.aula-live-lousa .aula-arranjo .aula-pr__grupo > .aula-arr__txt, .aula-live-lousa .aula-arranjo .aula-pr__formula > .aula-arr__txt { flex: 0 1 auto; }
.aula-live-lousa .aula-pr__formula, .aula-live-lousa .aula-pr__fim { display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: 2px .4em; max-width: 100%; }
.aula-live-lousa .aula-pr__fim { padding: 4px 18px; border-radius: 8px; width: fit-content; }
.aula-live-lousa .aula-pr__contas { display: flex; flex-direction: column; align-items: center; gap: 8px; max-width: 100%; }
.aula-live-lousa .aula-arranjo .aula-pr__variavel { text-align: center; }
/* exclusivos: um caso por coluna (celular: um embaixo do outro) */
.aula-live-lousa .aula-pr__casos { display: grid; grid-template-columns: repeat(var(--arr-cols-d, 2), minmax(0, 1fr)); gap: 20px 32px;
  width: 100%; align-items: start; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-pr__casos { grid-template-columns: minmax(0, 1fr); }
.aula-live-lousa .aula-pr__caso { display: flex; flex-direction: column; align-items: center; gap: 10px; min-width: 0; }
.aula-live-lousa .aula-arranjo .aula-pr__caso .aula-arr__txt { font-size: calc(var(--arr-fonte) * .85); }
.aula-live-lousa .aula-arranjo .aula-pr__caso .aula-arr__titulo, .aula-live-lousa .aula-arranjo .aula-pr__caso .aula-pr__titulo { font-size: calc(var(--arr-fonte) * 1.1); }
.aula-live-lousa .aula-arranjo .aula-pr__titulo { font-weight: 700; text-align: center; }
/* uniao_fichas: cada ficha na cor de quem ela é (a moldura da lista é o espaço todo, no giz: o azul aqui é o evento A) */
.aula-live-lousa .aula-pr__lista { border-color: var(--quadro-giz); }
.aula-live-lousa .aula-pr__ficha--a { border-color: var(--giz-azul); background: color-mix(in srgb, var(--giz-azul) 20%, transparent); }
.aula-live-lousa .aula-pr__ficha--a .fig-solution { color: var(--giz-azul); font-weight: 700; }
.aula-live-lousa .aula-pr__ficha--b { border-color: var(--giz-verde); background: color-mix(in srgb, var(--giz-verde) 20%, transparent); }
.aula-live-lousa .aula-pr__ficha--b .fig-solution { color: var(--giz-verde); font-weight: 700; }
.aula-live-lousa .aula-pr__ficha--ab { border-color: var(--pr-laranja); border-width: 3px; background: color-mix(in srgb, var(--pr-laranja) 30%, transparent); }
.aula-live-lousa .aula-pr__ficha--ab .fig-solution { color: var(--pr-laranja); font-weight: 700; }
.aula-live-lousa .aula-pr__ficha--nenhum { opacity: .5; }
.aula-live-lousa .aula-pr__legenda { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 22px; max-width: 100%; }
.aula-live-lousa .aula-pr__item { display: flex; align-items: center; gap: .45em; }
.aula-live-lousa .aula-arranjo .aula-pr__nome { font-size: calc(var(--arr-fonte) * .9); }
/* variavel_aleatoria: uma coluna por valor de X, cada uma na sua cor */
.aula-live-lousa .aula-pr__colunas { display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; gap: 14px 22px; max-width: 100%; }
.aula-live-lousa .aula-pr__coluna { display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 3.4em; }
.aula-live-lousa .aula-arranjo .aula-pr__coluna > .aula-arr__txt, .aula-live-lousa .aula-pr__coluna > .aula-pr__lados { flex: 0 0 auto; }
.aula-live-lousa .aula-arranjo .aula-pr__valor { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-pr__fichas { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; flex: 1 1 auto; gap: 4px; }
.aula-live-lousa .aula-pr__f { padding: 0 8px; }
.aula-live-lousa .aula-arranjo .aula-pr__quantos { font-size: calc(var(--arr-fonte) * .85); }
/* valor_esperado: a probabilidade em azul, valor × probabilidade em verde (vermelho se é negativo) */
.aula-live-lousa .aula-pr__tabela { width: auto; max-width: 100%; table-layout: auto; }
.aula-live-lousa .aula-pr__tabela th, .aula-live-lousa .aula-pr__tabela td { padding: 5px 14px; text-align: center; }
.aula-live-lousa .aula-pr__tabela th { font-family: var(--font-calc); font-size: var(--arr-fonte); }
.aula-live-lousa .aula-pr__tabela .aula-pr__p, .aula-live-lousa .aula-pr__tabela .aula-pr__p .fig-solution { color: var(--giz-azul); }
.aula-live-lousa .aula-pr__tabela .aula-pr__vp, .aula-live-lousa .aula-pr__tabela .aula-pr__vp .fig-solution { color: var(--cor, var(--giz-verde)); }
.aula-live-lousa .aula-pr__tabela th.aula-pr__vp { color: var(--giz-verde); }
.aula-live-lousa .aula-pr__tabela .aula-pr__soma .fig-solution { font-weight: 700; }
.aula-live-lousa .aula-pr__tabela .fig-solution { align-items: center; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-pr__tabela th, .aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-pr__tabela td { padding: 4px 8px; }
/* fim: probabilidade novos (agente-probabilidade) */

/* Fase C: estatística (tabelas, medidas, desvios, leitura de gráfico) */
.aula-live-lousa .aula-arr--estatistica-tabela_frequencia,
.aula-live-lousa .aula-arr--estatistica-medidas_centrais,
.aula-live-lousa .aula-arr--estatistica-media_ponderada,
.aula-live-lousa .aula-arr--estatistica-desvios,
.aula-live-lousa .aula-arr--estatistica-ler_grafico { display: flex; flex-direction: column; align-items: safe center; gap: 16px; }
.aula-live-lousa .aula-arr--estatistica-ler_grafico .aula-caixa,
.aula-live-lousa .aula-arr--estatistica-tabela_frequencia .aula-caixa { width: 100%; max-width: var(--arr-caixa); height: auto; aspect-ratio: 360 / 260; }
.aula-live-lousa .aula-tf__duas { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
/* S1. tabela_frequencia: a cor de cada classe numa amostra; a linha de total */
.aula-live-lousa .aula-tf__tabela, .aula-live-lousa .aula-mp__tabela, .aula-live-lousa .aula-dv__tabela { width: auto; max-width: 100%; table-layout: auto; }
.aula-live-lousa .aula-tf__tabela th, .aula-live-lousa .aula-tf__tabela td, .aula-live-lousa .aula-mp__tabela th, .aula-live-lousa .aula-mp__tabela td,
.aula-live-lousa .aula-dv__tabela th, .aula-live-lousa .aula-dv__tabela td { padding: 5px 14px; }
.aula-live-lousa .aula-tf__classe { white-space: nowrap; }
.aula-live-lousa .aula-tf__classe .aula-da__cor { display: inline-block; margin-right: .45em; vertical-align: middle; }
.aula-live-lousa .aula-mp__cab { font-family: var(--font-calc); font-size: var(--arr-fonte); }
.aula-live-lousa .aula-tf__classe > .fig-solution { display: inline-block; vertical-align: middle; }
.aula-live-lousa .aula-tf__total th, .aula-live-lousa .aula-tf__total td { background: color-mix(in srgb, var(--arr-traco) 10%, transparent); font-weight: 700; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-tf__tabela th, .aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-tf__tabela td,
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mp__tabela th, .aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mp__tabela td,
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-dv__tabela th, .aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-dv__tabela td { padding: 4px 6px; }
/* S2. medidas_centrais: fichas; a moda pintada, o meio circulado; uma coluna por medida (celular: uma embaixo da outra) */
.aula-live-lousa .aula-mc__fileira { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; max-width: 100%; }
.aula-live-lousa .aula-mc__ficha { min-width: 2em; padding: 2px 10px; border: 2px solid color-mix(in srgb, var(--arr-traco) 45%, transparent);
  border-radius: 8px; text-align: center; }
.aula-live-lousa .aula-mc__ficha--moda { border-color: var(--cor); background: color-mix(in srgb, var(--cor) 26%, transparent); }
.aula-live-lousa .aula-mc__ficha--moda .fig-solution { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-mc__ficha--meio { border: 3px solid color-mix(in srgb, var(--giz-amarelo) 62%, var(--giz-vermelho)); border-radius: 999px; font-weight: 700; }
.aula-live-lousa .aula-arranjo .aula-mc__legenda { margin-bottom: -8px; opacity: .8; }
.aula-live-lousa .aula-mc__medidas { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; gap: 12px 28px; max-width: 100%; }
.aula-live-lousa .aula-mc__medida { display: flex; flex-direction: column; align-items: center; gap: 6px; max-width: 100%; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mc__medidas { flex-direction: column; align-items: center; }
/* S3. media_ponderada: as duas colunas somadas nas cores da fração */
.aula-live-lousa .aula-mp__tabela .aula-mp__vp { color: var(--giz-verde); }
.aula-live-lousa .aula-mp__tabela .aula-mp__vp .fig-solution { color: var(--giz-verde); }
.aula-live-lousa .aula-mp__tabela .aula-mp__peso { color: var(--giz-azul); }
.aula-live-lousa .aula-mp__tabela .aula-mp__peso .fig-solution { color: var(--giz-azul); }
.aula-live-lousa .aula-mp__fim { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px .6em; width: 100%; }
/* S4. desvios: o menor e o maior; a média em destaque; a soma; a divisão por n ou n − 1 */
.aula-live-lousa .aula-dv__menor { border-color: var(--giz-azul); background: color-mix(in srgb, var(--giz-azul) 22%, transparent); }
.aula-live-lousa .aula-dv__maior { border-color: var(--giz-verde); background: color-mix(in srgb, var(--giz-verde) 22%, transparent); }
.aula-live-lousa .aula-dv__menor .fig-solution, .aula-live-lousa .aula-dv__maior .fig-solution { font-weight: 700; }
.aula-live-lousa .aula-dv__media { padding: 2px 14px; border: 2px solid var(--giz-azul); border-radius: 10px; }
.aula-live-lousa .aula-dv__tabela .aula-dv__soma .fig-solution { color: var(--giz-verde); font-weight: 700; }
.aula-live-lousa .aula-dv__div { display: flex; flex-direction: column; align-items: center; gap: 0; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mp__fim { flex-direction: column; }
/* S5. ler_grafico: as leituras numeradas, cada uma na sua cor; a armadilha numa caixinha de alerta */
.aula-live-lousa .aula-lgf__pergunta { max-width: 100%; text-align: center; font-style: italic; }
.aula-live-lousa .aula-lgf__leituras { display: flex; flex-direction: column; gap: 4px; max-width: 100%; }
.aula-live-lousa .aula-lgf__leitura { display: flex; align-items: center; flex-wrap: wrap; gap: 2px .5em; color: var(--cor); }
.aula-live-lousa .aula-lgf__leitura .fig-solution { color: var(--cor); }
.aula-live-lousa .aula-lgf__num { display: inline-flex; align-items: center; justify-content: center; width: 1.5em; height: 1.5em; border-radius: 50%;
  border: 2px solid var(--cor); font-family: var(--font-calc); font-weight: 700; font-size: calc(var(--arr-fonte) * .8); }
.aula-live-lousa .aula-lgf__seta { font-family: var(--font-calc); }
.aula-live-lousa .aula-lgf__alerta { display: flex; align-items: center; gap: .6em; max-width: 100%; padding: 6px 14px; border: 2px solid var(--giz-vermelho);
  border-radius: 10px; background: color-mix(in srgb, var(--giz-vermelho) 10%, transparent); }
.aula-live-lousa .aula-lgf__icone { color: var(--giz-vermelho); font-size: 1.3em; line-height: 1; }
/* Nicho Estatística, arranjos novos (agente-estatistica): população e amostra, tipos de variável, médias geométrica e
   harmônica, coeficiente de variação. Só conta, texto e desenho de giz. A cor de cada peça vem de --cor: o todo é azul e a
   parte é verde; o tipo de variável tem sempre a mesma cor; cada grupo, período ou trecho tem a dele nas três pontas. */
.aula-live-lousa .aula-arr--estatistica-populacao_amostra,
.aula-live-lousa .aula-arr--estatistica-censo_ou_amostra,
.aula-live-lousa .aula-arr--estatistica-amostra_representativa,
.aula-live-lousa .aula-arr--estatistica-tipos_variavel,
.aula-live-lousa .aula-arr--estatistica-classificar_variaveis,
.aula-live-lousa .aula-arr--estatistica-discreta_continua,
.aula-live-lousa .aula-arr--estatistica-media_geometrica,
.aula-live-lousa .aula-arr--estatistica-geometrica_ou_aritmetica,
.aula-live-lousa .aula-arr--estatistica-media_geometrica_area,
.aula-live-lousa .aula-arr--estatistica-velocidade_media,
.aula-live-lousa .aula-arr--estatistica-media_harmonica,
.aula-live-lousa .aula-arr--estatistica-coef_variacao,
.aula-live-lousa .aula-arr--estatistica-cv_dados { display: flex; flex-direction: column; align-items: safe center; gap: 16px; }
/* `.math-figure__drawing svg` (06-lousa.css) põe todo svg da lousa em absoluto: os desenhos daqui voltam ao fluxo */
.aula-live-lousa .aula-pop__nuvem, .aula-live-lousa .aula-cen__pontos, .aula-live-lousa .aula-gmq__fig { position: static; inset: auto; }
.aula-live-lousa .aula-gmq__fig { width: 100%; max-width: calc(var(--w) * 1px); height: auto; overflow: visible; color: var(--quadro-giz); }
/* NE1. populacao_amostra: duas nuvens de giz (a população em azul, a amostra em verde) com a seta do sorteio entre elas */
.aula-live-lousa .aula-pop__duas { display: flex; align-items: center; justify-content: center; gap: 72px; width: 100%; }
.aula-live-lousa .aula-pop__no { display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 0; }
.aula-live-lousa .aula-pop__no:first-child { flex: 320 1 0; max-width: 340px; }
.aula-live-lousa .aula-pop__no:last-child { flex: 220 1 0; max-width: 240px; }
.aula-live-lousa .aula-pop__nuvem { width: 100%; max-width: calc(var(--w) * 1px); height: auto; overflow: visible; color: var(--quadro-giz); }
.aula-live-lousa .aula-arranjo .aula-pop__termo { color: var(--cor); font-weight: 700; text-align: center; }
.aula-live-lousa .aula-arranjo .aula-pop__termo .fig-solution { color: var(--cor); }
.aula-live-lousa .aula-pop__quem { text-align: center; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-pop__duas { flex-direction: column; gap: 44px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-pop__no { flex: 0 1 auto; width: 100%; }
/* NE2. censo_ou_amostra: os mesmos 12 pontos, todos acesos (censo, azul) ou só alguns (amostra, verde) */
.aula-live-lousa .aula-cen__colunas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 32px; width: 100%; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-cen__colunas { grid-template-columns: minmax(0, 1fr); }
.aula-live-lousa .aula-cen__col { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.aula-live-lousa .aula-cen__cab { display: flex; align-items: center; gap: 12px; }
.aula-live-lousa .aula-cen__pontos { flex: 0 0 auto; width: 4.6em; height: auto; overflow: visible; color: var(--quadro-giz); }
.aula-live-lousa .aula-arranjo .aula-cen__titulo, .aula-live-lousa .aula-arranjo .aula-cen__titulo .fig-solution { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-arranjo .aula-cen__def { font-size: calc(var(--arr-fonte) * .88); opacity: .85; }
.aula-live-lousa .aula-cen__lista { display: flex; flex-direction: column; gap: 8px; }
.aula-live-lousa .aula-cen__item { border-left: 4px solid var(--cor); padding-left: .6em; }
.aula-live-lousa .aula-arranjo .aula-cen__motivo { font-size: calc(var(--arr-fonte) * .85); opacity: .85; }
/* NE3. amostra_representativa: três barras de 100%; cada grupo na mesma cor nas três */
.aula-live-lousa .aula-rep__legenda { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; }
.aula-live-lousa .aula-rep__chip { display: inline-flex; align-items: center; gap: .4em; }
.aula-live-lousa .aula-rep__linha { display: grid; grid-template-columns: minmax(7em, 15em) minmax(0, 1fr) 1.5em; align-items: center; gap: 4px 12px; width: 100%; }
.aula-live-lousa .aula-rep__quem { min-width: 0; }
.aula-live-lousa .aula-arranjo .aula-rep__titulo { font-weight: 700; text-align: left; }
.aula-live-lousa .aula-arranjo .aula-rep__sub { font-size: calc(var(--arr-fonte) * .82); opacity: .85; text-align: left; }
.aula-live-lousa .aula-rep__barra { display: flex; height: 2.2em; border-radius: 8px; overflow: hidden; min-width: 0;
  border: 2px solid color-mix(in srgb, var(--quadro-giz) 45%, transparent); }
.aula-live-lousa .aula-rep__seg { min-width: 0; display: flex; align-items: center; justify-content: center; border-right: 2px solid var(--cor);
  background: color-mix(in srgb, var(--cor) 55%, transparent); }
.aula-live-lousa .aula-rep__seg:last-child { border-right: 0; }
.aula-live-lousa .aula-rep__pct { font-family: var(--font-calc); font-weight: 700; white-space: nowrap; font-size: calc(var(--arr-fonte) * .9); }
.aula-live-lousa .aula-rep__marca { font-size: 1.5em; line-height: 1; font-weight: 700; }
.aula-live-lousa .aula-rep__linha--boa .aula-rep__marca { color: var(--giz-verde); }
.aula-live-lousa .aula-rep__linha--ruim .aula-rep__marca { color: var(--giz-vermelho); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-rep__linha { grid-template-columns: minmax(0, 1fr) 1.4em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-rep__quem { grid-column: 1 / -1; }
/* NE4. tipos_variavel: a árvore de perguntas; as quatro folhas na cor do tipo; o que não está no caminho escolhido fica apagado */
.aula-live-lousa .aula-tpv { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; max-width: 46em;
  grid-template-areas: "q1 q1 q1 q1" "ql ql qq qq" "nom ord dis con"; column-gap: 14px; row-gap: 3.2em; justify-items: center; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-tpv { column-gap: 6px; }
.aula-live-lousa .aula-tpv__no { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; min-width: 0; max-width: 100%; padding: 2px 6px; }
.aula-live-lousa .aula-tpv__no--q1 { grid-area: q1; } .aula-live-lousa .aula-tpv__no--ql { grid-area: ql; } .aula-live-lousa .aula-tpv__no--qq { grid-area: qq; }
.aula-live-lousa .aula-tpv__no--nominal { grid-area: nom; } .aula-live-lousa .aula-tpv__no--ordinal { grid-area: ord; }
.aula-live-lousa .aula-tpv__no--discreta { grid-area: dis; } .aula-live-lousa .aula-tpv__no--continua { grid-area: con; }
.aula-live-lousa .aula-tpv__no--nominal, .aula-live-lousa .aula-tpv__no--ordinal, .aula-live-lousa .aula-tpv__no--discreta, .aula-live-lousa .aula-tpv__no--continua {
  width: 100%; padding: 6px 4px; border: 2px solid var(--cor); border-radius: 10px; background: color-mix(in srgb, var(--cor) 14%, transparent); align-self: start; }
.aula-live-lousa .aula-tpv__no--folha { border-width: 3px; background: color-mix(in srgb, var(--cor) 30%, transparent); }
.aula-live-lousa .aula-tpv__no--apagado { opacity: .38; }
.aula-live-lousa .aula-arranjo .aula-tpv__familia { font-weight: 700; }
.aula-live-lousa .aula-arranjo .aula-tpv__tipo, .aula-live-lousa .aula-arranjo .aula-tpv__tipo .fig-solution { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-arranjo .aula-tpv__ex { font-size: calc(var(--arr-fonte) * .86); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-tpv__ex { font-size: calc(var(--arr-fonte) * .76); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-tpv__tipo { font-size: calc(var(--arr-fonte) * .9); }
.aula-live-lousa .aula-tpv__resp { position: absolute; z-index: 1; font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .85); line-height: 1.2; white-space: nowrap; }
.aula-live-lousa .aula-tpv__resp--apagada { opacity: .38; }
/* NE5. classificar_variaveis: o nome, os valores em fichas, a seta e a etiqueta do tipo (sempre a mesma cor) */
.aula-live-lousa .aula-clv { display: flex; flex-direction: column; gap: 14px; width: 100%; max-width: 46em; }
.aula-live-lousa .aula-clv__linha { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(7.8em, auto); align-items: center; gap: 4px 12px; }
.aula-live-lousa .aula-clv__quem { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.aula-live-lousa .aula-arranjo .aula-clv__nome { font-weight: 700; text-align: left; }
.aula-live-lousa .aula-clv__fichas { display: flex; flex-wrap: wrap; gap: 4px 6px; }
.aula-live-lousa .aula-clv__ficha { padding: 0 10px; border: 2px solid color-mix(in srgb, var(--cor) 55%, transparent); border-radius: 999px; }
.aula-live-lousa .aula-clv__seta { color: var(--cor); font-family: var(--font-calc); font-size: 1.5em; line-height: 1; }
.aula-live-lousa .aula-clv__etiqueta { display: flex; flex-direction: column; align-items: center; padding: 2px 12px; border: 2px solid var(--cor); border-radius: 10px;
  background: color-mix(in srgb, var(--cor) 20%, transparent); text-align: center; }
.aula-live-lousa .aula-arranjo .aula-clv__familia { font-size: calc(var(--arr-fonte) * .78); line-height: 1.15; }
.aula-live-lousa .aula-arranjo .aula-clv__tipo, .aula-live-lousa .aula-arranjo .aula-clv__tipo .fig-solution { color: var(--cor); font-weight: 700; line-height: 1.15; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-clv__linha { grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "quem quem" "seta etiqueta"; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-clv__quem { grid-area: quem; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-clv__seta { grid-area: seta; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-clv__etiqueta { grid-area: etiqueta; justify-self: start; }
/* NE6. discreta_continua: duas retas; pontos isolados e um ✗ no vão × o intervalo todo preenchido */
.aula-live-lousa .aula-dsc__bloco { width: 100%; max-width: 46em; display: flex; flex-direction: column; gap: 4px; }
.aula-live-lousa .aula-dsc__cab { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 14px; }
.aula-live-lousa .aula-arranjo .aula-dsc__tipo, .aula-live-lousa .aula-arranjo .aula-dsc__tipo .fig-solution { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-dsc__eixo { position: relative; height: calc(var(--arr-fonte) * 6); margin: 0 1.8em; }
.aula-live-lousa .aula-dsc__cab > .fig-solution, .aula-live-lousa .aula-cfv__cab > .fig-solution, .aula-live-lousa .aula-cvd__resnome > .fig-solution { flex: 0 0 auto; text-align: left; }
.aula-live-lousa .aula-dsc__reta { position: absolute; left: -1.4em; right: -1.4em; top: 62%; border-top: 3px solid var(--quadro-giz); }
.aula-live-lousa .aula-dsc__p { position: absolute; font-family: var(--font-calc); font-size: var(--arr-fonte); line-height: 1; white-space: nowrap; }
.aula-live-lousa .aula-dsc__ponto { top: 62%; width: .95em; height: .95em; border-radius: 50%; background: var(--cor); transform: translate(-50%, -50%); }
.aula-live-lousa .aula-dsc__num { top: 62%; margin-top: .85em; transform: translateX(-50%); }
.aula-live-lousa .aula-dsc__fim { margin-top: 1.25em; }
.aula-live-lousa .aula-dsc__nao { top: 62%; transform: translate(-50%, -50%); color: var(--giz-vermelho); font-weight: 700; font-size: calc(var(--arr-fonte) * 1.6); }
.aula-live-lousa .aula-dsc__naonum { top: 24%; transform: translateX(-50%); color: var(--giz-vermelho); font-weight: 700; }
.aula-live-lousa .aula-dsc__faixa { top: 62%; height: .95em; transform: translateY(-50%); border: 3px solid var(--cor); border-radius: .5em;
  background: color-mix(in srgb, var(--cor) 45%, transparent); }
.aula-live-lousa .aula-dsc__marca { top: 62%; width: 3px; height: 1.8em; background: var(--quadro-giz); transform: translate(-50%, -50%); }
.aula-live-lousa .aula-dsc__medida { transform: translateX(-50%); color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-dsc__medida--0 { top: 26%; }
.aula-live-lousa .aula-dsc__medida--1 { top: 3%; }
/* NE7. media_geometrica: uma coluna por período (taxa, 1 + taxa, fator, na cor do período); o produto e a raiz de índice n */
.aula-live-lousa .aula-mgm__periodos { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 26px; max-width: 100%; }
.aula-live-lousa .aula-mgm__per { display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 4.2em; }
.aula-live-lousa .aula-arranjo .aula-mgm__rot { font-size: calc(var(--arr-fonte) * .85); opacity: .85; }
.aula-live-lousa .aula-mgm__taxa { font-family: var(--font-calc); font-weight: 700; color: var(--cor); padding: 0 .6em; border: 2px solid var(--cor); border-radius: 999px; }
.aula-live-lousa .aula-mgm__passo { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .8); opacity: .85; }
.aula-live-lousa .aula-mgm__seta { font-family: var(--font-calc); color: var(--cor); line-height: 1; }
.aula-live-lousa .aula-mgm__fator { font-family: var(--font-calc); font-weight: 700; color: var(--cor); font-size: calc(var(--arr-fonte) * 1.2); padding: 0 .5em;
  border-radius: 8px; background: color-mix(in srgb, var(--cor) 20%, transparent); }
.aula-live-lousa .aula-mgm__linha { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px .45em; max-width: 100%;
  font-family: var(--font-calc); font-size: var(--arr-fonte); }
.aula-live-lousa .aula-mgm__num { color: var(--cor); font-weight: 700; font-size: 1.15em; }
.aula-live-lousa .aula-mgm__par { display: inline-flex; align-items: center; gap: .45em; white-space: nowrap; }
.aula-live-lousa .aula-mgm__raiz { display: inline-flex; align-items: flex-end; font-size: 1.15em; }
.aula-live-lousa .aula-mgm__indice { font-size: .65em; margin-right: -.2em; align-self: flex-start; }
.aula-live-lousa .aula-mgm__sinal { font-size: 1.45em; line-height: 1; }
.aula-live-lousa .aula-mgm__radicando { font-weight: 700; border-top: 2px solid var(--quadro-giz); padding: 0 .25em; margin-bottom: .12em; line-height: 1.25; }
/* NE8. geometrica_ou_aritmetica: três fileiras na mesma escala de altura */
.aula-live-lousa .aula-gar__linha { width: 100%; max-width: 40em; display: flex; flex-direction: column; gap: 4px; }
.aula-live-lousa .aula-gar__cab { display: flex; align-items: center; flex-wrap: wrap; gap: 2px 12px; }
.aula-live-lousa .aula-gar__cab > .aula-gar__titulo { flex: 0 0 auto; width: auto; text-align: left; }
.aula-live-lousa .aula-arranjo .aula-gar__titulo, .aula-live-lousa .aula-arranjo .aula-gar__titulo .fig-solution { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-gar__sub { font-family: var(--font-calc); color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-gar__marca { font-size: 1.4em; line-height: 1; font-weight: 700; }
.aula-live-lousa .aula-gar__marca--ok { color: var(--giz-verde); }
.aula-live-lousa .aula-gar__marca--no { color: var(--giz-vermelho); }
.aula-live-lousa .aula-gar__cols { display: flex; align-items: flex-end; justify-content: space-between; border-bottom: 2px solid color-mix(in srgb, var(--quadro-giz) 55%, transparent); }
.aula-live-lousa .aula-gar__col { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; flex: 0 0 auto; width: 3.4em; }
.aula-live-lousa .aula-gar__valor { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .85); line-height: 1.15; white-space: nowrap; }
.aula-live-lousa .aula-gar__barra { width: 2.2em; background: color-mix(in srgb, var(--cor) 45%, transparent); border: 2px solid var(--cor); border-bottom: 0; border-radius: 6px 6px 0 0; }
.aula-live-lousa .aula-gar__col--fim .aula-gar__valor { font-weight: 700; }
.aula-live-lousa .aula-gar__col--fim .aula-gar__barra { border-width: 3px; background: color-mix(in srgb, var(--cor) 75%, transparent); }
.aula-live-lousa .aula-gar__gap { flex: 1 1 0; min-width: 2.4em; text-align: center; font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .8); line-height: 1.1;
  align-self: flex-end; padding-bottom: 1em; }
.aula-live-lousa .aula-gar__gap::after { content: '→'; display: block; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gar__col { width: 2.4em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gar__barra { width: 1.5em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gar__valor { font-size: calc(var(--arr-fonte) * .76); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-gar__gap { min-width: 2em; font-size: calc(var(--arr-fonte) * .68); }
/* NE9. velocidade_media: a fita de trechos iguais, o tempo de cada um, o total e o teste da média aritmética (✗) */
.aula-live-lousa .aula-vlm__fita { display: flex; gap: 4px; width: 100%; max-width: 40em; }
.aula-live-lousa .aula-vlm__trecho { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 3px; }
.aula-live-lousa .aula-vlm__vel { font-family: var(--font-calc); font-weight: 700; color: var(--cor); text-align: center; white-space: nowrap; }
.aula-live-lousa .aula-vlm__rua { position: relative; align-self: stretch; height: 1.2em; border: 2px solid var(--cor); border-radius: 6px;
  background: color-mix(in srgb, var(--cor) 28%, transparent); }
.aula-live-lousa .aula-vlm__rua::after { content: ''; position: absolute; left: 6%; right: 6%; top: 50%; border-top: 2px dashed var(--cor); }
.aula-live-lousa .aula-vlm__dist { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .85); white-space: nowrap; }
.aula-live-lousa .aula-vlm__tempos, .aula-live-lousa .aula-vlm__totais { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; max-width: 100%; }
.aula-live-lousa .aula-vlm__tempo { display: flex; align-items: center; gap: .5em; }
.aula-live-lousa .aula-vlm__txt { font-family: var(--font-calc); }
.aula-live-lousa .aula-vlm__media { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px .5em; max-width: 100%; }
.aula-live-lousa .aula-vlm__erro { display: flex; align-items: center; gap: .6em; color: var(--giz-vermelho); max-width: 100%; }
.aula-live-lousa .aula-vlm__x { font-size: 1.7em; font-weight: 700; line-height: 1; }
.aula-live-lousa .aula-vlm__erros { display: flex; flex-direction: column; min-width: 0; }
/* NE10. media_harmonica: quatro degraus (valores, inverso de cada um, média dos inversos, inverso da média) */
.aula-live-lousa .aula-mhm__degrau { display: grid; grid-template-columns: minmax(7em, 13em) minmax(0, 1fr); align-items: center; gap: 4px 14px; width: 100%; max-width: 44em; }
.aula-live-lousa .aula-arranjo .aula-mhm__legenda { text-align: right; font-size: calc(var(--arr-fonte) * .82); opacity: .85; }
.aula-live-lousa .aula-mhm__conteudo { display: flex; flex-wrap: wrap; align-items: center; gap: 4px .6em; min-width: 0; }
.aula-live-lousa .aula-mhm__ficha { font-family: var(--font-calc); font-weight: 700; color: var(--cor); padding: 0 .6em; border: 2px solid var(--cor); border-radius: 999px;
  background: color-mix(in srgb, var(--cor) 16%, transparent); white-space: nowrap; }
.aula-live-lousa .aula-mhm__op { font-family: var(--font-calc); }
.aula-live-lousa .aula-mhm__desce { font-family: var(--font-calc); font-size: 1.3em; line-height: 1; opacity: .7; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mhm__degrau { grid-template-columns: minmax(0, 1fr); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mhm__legenda { text-align: left; }
/* NE11. coef_variacao: a barra vale a média; a fatia do desvio é o CV */
.aula-live-lousa .aula-cfv__colunas { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px 36px; width: 100%; }
.aula-live-lousa .aula-cfv__grupo { flex: 1 1 14em; max-width: 22em; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.aula-live-lousa .aula-cfv__cab { display: flex; align-items: center; gap: .5em; }
.aula-live-lousa .aula-arranjo .aula-cfv__nome, .aula-live-lousa .aula-arranjo .aula-cfv__nome .fig-solution { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-cfv__ok { color: var(--giz-verde); font-size: 1.4em; font-weight: 700; line-height: 1; }
.aula-live-lousa .aula-cfv__barra { height: 1.5em; border: 2px solid var(--cor); border-radius: 8px; overflow: hidden; background: color-mix(in srgb, var(--cor) 10%, transparent); }
.aula-live-lousa .aula-cfv__fatia { height: 100%; background: color-mix(in srgb, var(--cor) 70%, transparent); }
.aula-live-lousa .aula-cfv__legenda { display: flex; justify-content: space-between; gap: 1em; font-family: var(--font-calc); }
.aula-live-lousa .aula-cfv__s { color: var(--cor); font-weight: 700; }
/* NE12. cv_dados: os dados do grupo, x̄ e s do motor, a reta comum (dado ÷ média) e a conta do CV */
.aula-live-lousa .aula-cvd__grupos { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 32px; width: 100%; }
.aula-live-lousa .aula-cvd__grupo { display: flex; flex-direction: column; align-items: center; gap: 4px; flex: 1 1 14em; max-width: 24em; min-width: 0; }
.aula-live-lousa .aula-arranjo .aula-cvd__nome, .aula-live-lousa .aula-arranjo .aula-cvd__nome .fig-solution { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-cvd__fichas { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; }
.aula-live-lousa .aula-cvd__ficha { font-family: var(--font-calc); padding: 0 .55em; border: 2px solid var(--cor); border-radius: 8px; }
.aula-live-lousa .aula-cvd__medidas { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px 1em; font-family: var(--font-calc); }
.aula-live-lousa .aula-cvd__eixo { width: 100%; max-width: 44em; display: flex; flex-direction: column; gap: 6px; }
.aula-live-lousa .aula-arranjo .aula-cvd__legenda { font-size: calc(var(--arr-fonte) * .85); opacity: .85; text-align: center; }
.aula-live-lousa .aula-cvd__reta { display: flex; flex-direction: column; gap: 8px; }
.aula-live-lousa .aula-cvd__linha { display: grid; grid-template-columns: 5.5em minmax(0, 1fr); align-items: center; gap: 10px; }
.aula-live-lousa .aula-arranjo .aula-cvd__rotulo, .aula-live-lousa .aula-arranjo .aula-cvd__rotulo .fig-solution { color: var(--cor); text-align: right; font-weight: 700; }
.aula-live-lousa .aula-cvd__fila { position: relative; border-bottom: 2px solid color-mix(in srgb, var(--quadro-giz) 55%, transparent); }
.aula-live-lousa .aula-cvd__fila--eixo { border-bottom: 0; height: 1.3em; }
.aula-live-lousa .aula-cvd__faixa { position: absolute; top: 0; bottom: 0; border-left: 2px dashed var(--cor); border-right: 2px dashed var(--cor);
  background: color-mix(in srgb, var(--cor) 20%, transparent); }
.aula-live-lousa .aula-cvd__tique { position: absolute; top: -3px; bottom: -3px; border-left: 2px solid var(--quadro-giz); opacity: .65; }
.aula-live-lousa .aula-cvd__ponto { position: absolute; width: .7em; height: .7em; border-radius: 50%; background: var(--cor); transform: translateX(-50%); }
.aula-live-lousa .aula-cvd__media { position: absolute; top: 0; transform: translateX(-50%); font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .85); }
.aula-live-lousa .aula-cvd__resultados { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 32px; width: 100%; }
.aula-live-lousa .aula-cvd__res { display: flex; flex-direction: column; align-items: center; gap: 4px; max-width: 100%; }
.aula-live-lousa .aula-cvd__resnome { display: flex; align-items: center; gap: .5em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-cvd__linha { grid-template-columns: 3.6em minmax(0, 1fr); gap: 6px; }
/* Nicho Grandezas e medidas (nichos/grandezas.json, id0238): a tabela de unidades é a do aula-unidades.js. Azul = a
   partida, verde = a chegada (e o salto que cai num número redondo); a escada fora do caminho fica apagada. As setas, a
   passarela e os arcos são SVG medido pelo DOM (.aula-es__linhas, por cima). */
.aula-live-lousa .aula-arr--grandezas-escada_unidades,
.aula-live-lousa .aula-arr--grandezas-cancelar_unidades,
.aula-live-lousa .aula-arr--grandezas-formula_triangulo,
.aula-live-lousa .aula-arr--grandezas-conta_sexagesimal,
.aula-live-lousa .aula-arr--grandezas-saltos { display: flex; flex-direction: column; align-items: safe center; gap: 16px; }
/* GR1. escada_unidades: grade com a posição de cada degrau em --cd/--rd (computador) e --cm/--rm (celular) */
.aula-live-lousa .aula-eu__tudo { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px 32px; max-width: 100%; }
.aula-live-lousa .aula-eu__escada { position: relative; display: grid; grid-auto-columns: minmax(3em, auto);
  grid-auto-rows: minmax(2.3em, auto); column-gap: 6px; row-gap: 4px; }
.aula-live-lousa .aula-eu__escada > :not(svg) { grid-column: var(--cd); grid-row: var(--rd); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-eu__escada { grid-auto-rows: auto; row-gap: 2px; column-gap: 4px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-eu__escada > :not(svg) { grid-column: var(--cm); grid-row: var(--rm); }
.aula-live-lousa .aula-eu__deg { display: flex; align-items: center; justify-content: center; min-width: 3em; height: 2.2em; padding: 0 .35em;
  border: 2px solid var(--arr-traco); border-radius: 6px; font-family: var(--font-calc); font-size: var(--arr-fonte); line-height: 1;
  white-space: nowrap; position: relative; z-index: 1; }
.aula-live-lousa .aula-eu__deg--fora { opacity: .32; }
.aula-live-lousa .aula-eu__deg--de { border: 3px solid var(--giz-azul); color: var(--giz-azul); font-weight: 700; }
.aula-live-lousa .aula-eu__deg--para { border: 3px solid var(--giz-verde); color: var(--giz-verde); font-weight: 700;
  background: color-mix(in srgb, var(--giz-verde) 14%, transparent); }
.aula-live-lousa .aula-eu__fator { align-self: end; justify-self: start; font-size: calc(var(--arr-fonte) * .8); padding: 0 0 2px 4px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-eu__fator { align-self: center; display: flex; align-items: center;
  min-height: 2.1em; padding: 0 0 0 2px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-eu__tudo { gap: 14px 14px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-eu__deg { min-width: 2.6em; padding: 0 .2em; }
.aula-live-lousa .aula-eu__ponte { align-self: end; justify-self: center; font-size: calc(var(--arr-fonte) * .8); color: var(--giz-amarelo);
  font-weight: 700; padding-bottom: 2px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-eu__ponte { align-self: start; padding: 2px 0 0; }
.aula-live-lousa .aula-eu__valores { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.aula-live-lousa .aula-eu__valor--de { color: var(--giz-azul); font-weight: 700; }
.aula-live-lousa .aula-eu__desce { font-family: var(--font-calc); opacity: .6; line-height: 1; }
/* GR2. cancelar_unidades: frações numa linha (quebra quando não cabe), as unidades canceladas riscadas na cor do par */
.aula-live-lousa .aula-cu__linha { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 12px; max-width: 100%; }
.aula-live-lousa .aula-cu__parte { display: inline-flex; align-items: baseline; gap: .25em; }
.aula-live-lousa .aula-cu__op { font-size: calc(var(--arr-fonte) * 1.15); }
.aula-live-lousa .aula-cu__fim { display: inline-flex; align-items: center; gap: 12px; }
.aula-live-lousa .aula-cu__risco { color: var(--cor); text-decoration: line-through; text-decoration-color: var(--cor);
  text-decoration-thickness: 3px; font-weight: 700; }
/* GR3. formula_triangulo: o triângulo do motor (a caixa de figura) e a legenda embaixo dele; as contas à direita */
.aula-live-lousa .aula-arr--grandezas-formula_triangulo .aula-caixa { width: 100%; max-width: var(--arr-caixa); height: auto; aspect-ratio: 360 / 260; }
.aula-live-lousa .aula-ft__fig { display: flex; flex-direction: column; align-items: center; gap: 8px; width: 100%; min-width: 0; }
.aula-live-lousa .aula-ft__tri { color: var(--quadro-giz); }
.aula-live-lousa .aula-ft__legenda { display: flex; flex-direction: column; align-items: flex-start; gap: 0; max-width: 100%; }
.aula-live-lousa .aula-ft__legenda .aula-arr__txt { font-size: calc(var(--arr-fonte) * .85); }
/* GR4. conta_sexagesimal: a conta armada (uma coluna por unidade); as trocas ao lado (celular: embaixo) */
.aula-live-lousa .aula-sx__tudo { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px 32px; max-width: 100%; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-sx__tudo { flex-direction: column; }
.aula-live-lousa .aula-sx__conta { position: relative; padding-top: 4px; }
.aula-live-lousa .aula-sx__tabela { width: auto; table-layout: auto; }
.aula-live-lousa .aula-sx__tabela th, .aula-live-lousa .aula-sx__tabela td { border: none; padding: 4px 14px; text-align: center; min-width: 3.2em; }
.aula-live-lousa .aula-sx__tabela th { background: none; border-bottom: 2px solid color-mix(in srgb, var(--quadro-giz) 45%, transparent); }
.aula-live-lousa .aula-sx__tabela td.aula-sx__sinal, .aula-live-lousa .aula-sx__tabela th.aula-sx__sinal { min-width: 0; padding: 4px 6px; text-align: right; }
.aula-live-lousa .aula-sx__tabela td.aula-sx__sinal .aula-es__t { font-size: calc(var(--arr-fonte) * .8); }
.aula-live-lousa .aula-sx__tabela tr.aula-sx__vai td { padding-top: 26px; }
.aula-live-lousa .aula-sx__conv tr:not(.aula-sx__cab) + tr td { padding-top: 22px; }   /* a seta da conversão cabe entre as linhas */
.aula-live-lousa .aula-sx__vai td .aula-es__t { font-size: calc(var(--arr-fonte) * .8); color: var(--giz-amarelo); font-weight: 700; }
.aula-live-lousa .aula-sx__riscado .aula-es__t { text-decoration: line-through; opacity: .55; }
.aula-live-lousa .aula-sx__res td { border-top: 2px solid var(--quadro-giz); font-weight: 700; }
.aula-live-lousa .aula-sx__trocas { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; max-width: 100%; }
.aula-live-lousa .aula-sx__troca { display: flex; align-items: center; gap: 8px; }
.aula-live-lousa .aula-sx__troca .fig-solution { color: var(--cor); }
/* GR5. saltos: os arcos em cima da reta, o tamanho no alto de cada arco; no celular, mais de 3 saltos quebram em duas retas */
.aula-live-lousa .aula-sl__linha { position: relative; width: 100%; max-width: 100%; }
.aula-live-lousa .aula-sl__linha--m { display: none; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-sl__linha--m { display: block; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-sl__linha--d { display: none; }
.aula-live-lousa .aula-sl__arcos { position: relative; height: calc(var(--arr-fonte) * 3.6); }
.aula-live-lousa .aula-sl__tam { position: absolute; top: 0; left: 0; color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-sl__tam--baixo { top: calc(var(--arr-fonte) * 1.35); }   /* encostaria no vizinho: desce um degrau */
.aula-live-lousa .aula-sl__pontos { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); column-gap: 6px; }
.aula-live-lousa .aula-sl__ponto { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; }
.aula-live-lousa .aula-sl__tique { display: block; width: 3px; height: 16px; background: var(--arr-traco); border-radius: 2px; }
.aula-live-lousa .aula-sl__rot { white-space: normal; text-align: center; overflow-wrap: anywhere; max-width: 100%; }
.aula-live-lousa .aula-sl__ponto--inicio .aula-sl__rot { color: var(--giz-azul); font-weight: 700; }
/* id0242 (caminho A): os relógios do início e da chegada, ou o troco em dinheiro, em cima da reta, num tamanho de figura de apoio */
.aula-live-lousa .aula-sl__fig { display: flex; justify-content: center; width: 100%; }
.aula-live-lousa .aula-sl__fig .aula-caixa { width: min(100%, var(--arr-caixa), 420px); height: auto; aspect-ratio: 360 / 260; }
.aula-live-lousa .aula-sl__soma { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 10px; max-width: 100%; }












/* Grandezas, proporcionalidade (nichos/grandezas.json, agente-grandezas): razao_silhuetas, proporcao_cruzada, direta_inversa_tabela
   e _cenas, regra_tres_setas, _unidade e _composta, partes_proporcionais. A 1ª grandeza azul, a 2ª roxa, o x amarelo; a relação
   verde (direta) ou vermelha (inversa). Os arcos, as setas e as diagonais são SVG medido pelo DOM (.aula-es__linhas, por cima). */
.aula-live-lousa .aula-arr--grandezas-razao_silhuetas,
.aula-live-lousa .aula-arr--grandezas-proporcao_cruzada,
.aula-live-lousa .aula-arr--grandezas-direta_inversa_tabela,
.aula-live-lousa .aula-arr--grandezas-direta_inversa_cenas,
.aula-live-lousa .aula-arr--grandezas-regra_tres_setas,
.aula-live-lousa .aula-arr--grandezas-regra_tres_unidade,
.aula-live-lousa .aula-arr--grandezas-regra_tres_composta,
.aula-live-lousa .aula-arr--grandezas-partes_proporcionais { display: flex; flex-direction: column; align-items: safe center; gap: 16px; }
/* GP0. peças comuns: o termo colorido, o x, o operador, a linha de conta, a silhueta e o cabeçalho da grandeza */
.aula-live-lousa .aula-pr__t { color: var(--cor, var(--quadro-giz)); font-weight: 700; }
.aula-live-lousa .aula-pr__x { padding: 0 .3em; border-radius: 6px; background: color-mix(in srgb, var(--giz-amarelo) 22%, transparent); }
.aula-live-lousa .aula-pr__op { opacity: .85; }
.aula-live-lousa .aula-pr__linha { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px .5em; max-width: 100%; }
/* `.math-figure__drawing svg` (06-lousa.css) põe todo svg da lousa em absoluto, esticado: as silhuetas voltam ao fluxo */
.aula-live-lousa .aula-pr__ic { position: static; inset: auto; width: 2.1em; height: 2.1em; flex: 0 0 auto; overflow: visible; }
.aula-live-lousa .aula-pr__frac .aula-es__t { padding: 0 .1em; }
.aula-live-lousa .aula-pr__fator { position: absolute; transform: translate(-50%, -50%); font-size: calc(var(--arr-fonte) * .85); font-weight: 700;
  color: var(--cor); }
.aula-live-lousa .aula-pr__cab { display: flex; align-items: center; gap: .4em; min-width: 0; }
.aula-live-lousa .aula-pr__nomeg { white-space: normal; overflow-wrap: break-word; color: var(--cor); font-weight: 700; line-height: 1.1; }
.aula-live-lousa .aula-pr__leg { display: inline-flex; align-items: center; gap: .45em; }
.aula-live-lousa .aula-pr__leg .aula-da__cor { font-size: var(--arr-fonte); }
/* GP1. razao_silhuetas: duas fileiras de silhuetas (grupos do tamanho do divisor comum), a fração e os arcos ÷ */
.aula-live-lousa .aula-rz__fileiras { display: flex; flex-direction: column; gap: 10px; max-width: 100%; }
.aula-live-lousa .aula-rz__fileira { display: flex; align-items: center; gap: .9em; max-width: 100%; }
.aula-live-lousa .aula-rz__nome { flex: 0 0 9em; color: var(--cor); font-weight: 700; line-height: 1.15; }
.aula-live-lousa .aula-rz__n { font-size: 1.3em; }
.aula-live-lousa .aula-rz__obj { white-space: normal; }
.aula-live-lousa .aula-rz__icones { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 1em; min-width: 0; }
.aula-live-lousa .aula-rz__grupo { display: inline-flex; gap: 2px; }
.aula-live-lousa .aula-rz__icones .aula-pr__ic { width: var(--ic, 1.8em); height: var(--ic, 1.8em); }
.aula-live-lousa .aula-rz__escala { align-self: flex-end; opacity: .85; }
.aula-live-lousa .aula-rz__leitura { white-space: normal; text-align: center; max-width: 100%; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-rz__fileira { flex-direction: column; align-items: flex-start; gap: 4px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-rz__nome { flex: 0 0 auto; }
/* GP2. proporcao_cruzada e as proporções da regra de três: as frações com as duas diagonais cruzadas por cima */
.aula-live-lousa .aula-pc__zona { position: relative; padding: 6px 4px; }
.aula-live-lousa .aula-pc__prop { gap: 0 1.7em; flex-wrap: nowrap; }
.aula-live-lousa .aula-pc__prop .aula-es__t { font-size: calc(var(--arr-fonte) * 1.35); }
.aula-live-lousa .aula-pc__prop .aula-pr__op { position: relative; z-index: 2; }   /* o = fica por cima das diagonais */
.aula-live-lousa .aula-pc__legenda { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 1.6em; }
/* GP3. direta_inversa_tabela e a unidade: a grade de valores, o espaço dos arcos em cima e embaixo, os fatores sobre os arcos */
.aula-live-lousa .aula-dt__zona { position: relative; display: grid; grid-template-columns: auto repeat(var(--n), minmax(3.2em, 1fr)); align-items: center;
  column-gap: 10px; row-gap: 4px; width: min(100%, calc(10em + var(--n) * 6em)); }
.aula-live-lousa .aula-dt__esp { grid-column: 1 / -1; height: 2.9em; }
.aula-live-lousa .aula-dt__cel { text-align: center; padding: .2em 0; border-radius: 8px; }
.aula-live-lousa .aula-dt__zona .aula-pr__cab { justify-content: flex-start; padding-right: .3em; }
.aula-live-lousa .aula-dt__const { gap: 4px .45em; }
.aula-live-lousa .aula-dt__prod { gap: 0 .3em; flex-wrap: nowrap; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-dt__zona { column-gap: 4px; width: 100%; grid-template-columns: auto repeat(var(--n), minmax(2.4em, 1fr)); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-dt__zona .aula-pr__ic { display: none; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-dt__zona .aula-pr__nomeg { font-size: calc(var(--arr-fonte) * .8); max-width: 7.6em; }
/* GP4. direta_inversa_cenas: uma cena por situação; no computador as cenas em colunas (a 1ª grandeza em cima, a 2ª embaixo) e os
   fatores entre elas; no celular as cenas empilham, em duas colunas (1ª e 2ª grandeza) */
.aula-live-lousa .aula-cn__grade { display: grid; grid-auto-flow: column; grid-template-rows: auto auto; grid-auto-columns: auto; column-gap: 14px;
  row-gap: 16px; align-items: center; justify-items: center; max-width: 100%; }
.aula-live-lousa .aula-cn__a, .aula-live-lousa .aula-cn__b { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; }
.aula-live-lousa .aula-cn__icones { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px; max-width: calc(4 * 2.7em); }
.aula-live-lousa .aula-cn__icones .aula-pr__ic { width: 2.6em; height: 2.6em; }
.aula-live-lousa .aula-cn__num { display: flex; align-items: center; justify-content: center; gap: .35em; flex-wrap: wrap; color: var(--cor); }
.aula-live-lousa .aula-cn__un { white-space: normal; text-align: center; line-height: 1.1; color: var(--cor); }
.aula-live-lousa .aula-cn__f { position: static; transform: none; white-space: nowrap; }
.aula-live-lousa .aula-cn__f::after { content: ' →'; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-cn__grade { grid-auto-flow: row; grid-template-rows: none; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-cn__f::after { content: ' ↓'; }
/* GP5. regra_tres_setas: a tabela de duas colunas com a seta de cada uma ao lado (↑ aumenta, ↓ diminui) */
.aula-live-lousa .aula-r3__tab { position: relative; display: grid; grid-template-columns: 2em minmax(6.5em, 1fr) minmax(6.5em, 1fr) 2em; align-items: end;
  column-gap: 6px; row-gap: 6px; width: min(100%, 30em); }
.aula-live-lousa .aula-r3__tab .aula-pr__cab { flex-direction: column; justify-content: flex-end; text-align: center; gap: .1em; }
.aula-live-lousa .aula-r3__cel { text-align: center; padding: .15em 0; align-self: center; }
.aula-live-lousa .aula-r3__cel .aula-es__t { font-size: calc(var(--arr-fonte) * 1.2); }
/* GP6. regra_tres_unidade: conhecida | 1 | pedida; a coluna do 1 em destaque */
.aula-live-lousa .aula-un__zona { position: relative; display: grid; grid-template-columns: auto repeat(3, minmax(3.6em, 1fr)); align-items: center;
  column-gap: 10px; row-gap: 4px; width: min(100%, 32em); }
.aula-live-lousa .aula-un__zona .aula-dt__esp { height: 2.9em; }
.aula-live-lousa .aula-un__zona .aula-pr__cab { justify-content: flex-start; padding-right: .3em; }
.aula-live-lousa .aula-un__um .aula-pr__t { padding: 0 .55em; border-radius: 8px; background: color-mix(in srgb, var(--quadro-giz) 13%, transparent); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-un__zona { column-gap: 4px; width: 100%; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-un__zona .aula-pr__ic { display: none; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-un__zona .aula-pr__nomeg { font-size: calc(var(--arr-fonte) * .8); max-width: 7.6em; }
.aula-live-lousa .aula-pc__prop .aula-pr__op { background: var(--quadro-bg); border-radius: 6px; padding: 0 .1em; }
/* GP7. regra_tres_composta: uma coluna por grandeza (faixa da seta + valores), a relação em palavra e cor, a proporção em colunas (ícone em cima) */
.aula-live-lousa .aula-r3c__tab { position: relative; display: grid; grid-template-columns: repeat(var(--n), 1.4em minmax(3.6em, 1fr)); align-items: end;
  column-gap: 4px; row-gap: 6px; width: min(100%, calc(var(--n) * 8.4em)); }
.aula-live-lousa .aula-r3c__tab .aula-pr__cab { grid-column: span 2; flex-direction: column; justify-content: flex-end; text-align: center; gap: .1em; }
.aula-live-lousa .aula-r3c__rot { grid-column: span 2; text-align: center; color: var(--cor); font-weight: 700; min-height: 1.3em; }
.aula-live-lousa .aula-r3c__eq { display: grid; grid-auto-flow: column; grid-template-rows: auto auto; align-items: center; justify-items: center; column-gap: .45em;
  row-gap: 2px; max-width: 100%; }
.aula-live-lousa .aula-r3c__eq .aula-es__t { font-size: min(var(--arr-fonte), calc(125cqw / var(--chars, 16))); }
.aula-live-lousa .aula-r3c__eq .aula-pr__ic { width: 1.7em; height: 1.7em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-r3c__tab { grid-template-columns: repeat(var(--n), 1.1em minmax(0, 1fr)); column-gap: 2px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-r3c__tab .aula-r3__cel .aula-es__t { font-size: var(--arr-fonte); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-r3c__eq { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px .4em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-r3c__eq .aula-pr__ic { display: none; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-r3c__eq .aula-es__t { font-size: var(--arr-fonte); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-r3c__tab .aula-pr__ic { display: none; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-r3c__tab .aula-pr__nomeg { font-size: calc(var(--arr-fonte) * .85); }
/* GP8. partes_proporcionais: a conversão (inversa), a barra de blocos, o valor de 1 parte e uma linha por pessoa */
.aula-live-lousa .aula-pp__conv { display: grid; grid-template-columns: auto repeat(var(--n), minmax(3.2em, 1fr)); align-items: center; justify-items: center; gap: 4px 12px;
  max-width: 100%; }
.aula-live-lousa .aula-pp__rot { justify-self: end; font-size: calc(var(--arr-fonte) * .8); opacity: .85; white-space: normal; text-align: right; }
.aula-live-lousa .aula-pp__cel--fim .aula-pr__t { padding: 0 .5em; border-radius: 8px; background: color-mix(in srgb, var(--cor) 16%, transparent); }
.aula-live-lousa .aula-pp__topo { display: flex; flex-direction: column; align-items: stretch; gap: 4px; width: min(100%, 34em); }
.aula-live-lousa .aula-pp__barra { display: flex; gap: 3px; height: 2.1em; }
.aula-live-lousa .aula-pp__bloco, .aula-live-lousa .aula-pp__trecho { flex: 1 1 0; min-width: 0; border: 2px solid var(--cor); border-radius: 5px;
  background: color-mix(in srgb, var(--cor) 38%, transparent); }
.aula-live-lousa .aula-pp__bloco--mini { flex: 0 0 1.1em; height: 1.1em; border-radius: 3px; }
.aula-live-lousa .aula-pp__colchete { text-align: center; }
.aula-live-lousa .aula-pp__parte { gap: 4px .45em; }
.aula-live-lousa .aula-pp__pessoas { display: grid; grid-template-columns: auto auto auto; align-items: center; column-gap: 1.2em; row-gap: 8px; max-width: 100%; }
.aula-live-lousa .aula-pp__nome { display: flex; align-items: center; gap: .4em; color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-pp__mini { display: flex; flex-wrap: wrap; gap: 3px; max-width: 14em; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-pp__pessoas { grid-template-columns: auto 1fr; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-pp__pessoas .aula-pp__mini { display: none; }
/* fim: grandezas, proporcionalidade (agente-grandezas) */

/* id0273 (pedido do Beny): a fórmula em destaque (Fase 3, C3, regras-base perto do desfecho) com a FÓRMULA no centro.
   O ".aula-parte .fig-solution" (17–22 px) vencia o tamanho da __expr e a fórmula saía do tamanho da definição: aqui ela
   herda o tamanho grande e fica centrada na caixa; a legenda, sem marcador, fica menor que ela. Fica neste bloco (só da
   aula ao vivo) para não mexer na casca do chat. */
.aula-live-lousa .aula-formula__caixa { min-width: min(100%, 260px); padding: 14px clamp(16px, 2vw, 28px); align-items: center; }
.aula-live-lousa .aula-formula__expr { font-size: clamp(24px, 3.4vw, 44px); text-align: center; }
.aula-live-lousa .aula-formula__expr .fig-solution { font-size: inherit; }
.aula-live-lousa .aula-formula__legenda { list-style: none; padding-left: 4px; gap: 0; }
/* Nicho Matrizes (nichos/matrizes.json): só conta e texto, sem caixas de figura. A matriz é desenhada aqui (colchetes grandes,
   células alinhadas); as setas, os contornos e as diagonais são um SVG por trás das células (.aula-mx__camada), medido pelo
   DOM real. Azul = linha, roxo = coluna, amarelo = o que tem de ser igual, uma cor por par, verde (papel final) = resultado. */
.aula-live-lousa .aula-arr--matrizes-produto_setas,
.aula-live-lousa .aula-arr--matrizes-produto_completo,
.aula-live-lousa .aula-arr--matrizes-produto_ordens,
.aula-live-lousa .aula-arr--matrizes-nao_comuta { display: flex; flex-direction: column; align-items: safe center; gap: 16px; }
.aula-live-lousa .aula-mx__cena { position: relative; display: flex; flex-direction: column; align-items: center; gap: 22px; max-width: 100%; min-width: 0; }
.aula-live-lousa svg.aula-mx__camada { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 0; }
.aula-live-lousa .aula-mx__cena > *:not(svg) { position: relative; z-index: 1; max-width: 100%; }
.aula-live-lousa .aula-mx__fila { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 14px; }
.aula-live-lousa .aula-mx__op { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 1.7); line-height: 1; padding: 0 2px; }
.aula-live-lousa .aula-mx__grupo { display: flex; align-items: center; gap: 10px 14px; }
.aula-live-lousa .aula-mx__ind { display: inline-flex; align-items: baseline; }
.aula-live-lousa .aula-mx__sub { font-size: .86em; color: var(--cor, inherit); font-weight: 700; }
/* a tabela dos pares (produto_setas): o número da linha e o da coluna, um sobre o outro, e embaixo o produto de cada par */
.aula-live-lousa .aula-mx__pares { display: grid; grid-template-columns: auto repeat(var(--np), minmax(3.4em, auto)); gap: 32px 20px; align-items: center; justify-items: center; }
.aula-live-lousa .aula-mx__par-rot { display: flex; align-items: baseline; gap: 6px; justify-self: end; white-space: nowrap; }
.aula-live-lousa .aula-mx__par-cel { padding: 0 6px; }
.aula-live-lousa .aula-mx__par-cel .aula-arr__txt { color: var(--cor); font-weight: 700; font-size: calc(var(--arr-fonte) * 1.25); }
.aula-live-lousa .aula-mx__par-prod { color: var(--cor); }
.aula-live-lousa .aula-mx__item { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.aula-live-lousa .aula-mx__nome { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * .95); line-height: 1.1; margin-bottom: 6px; }
.aula-live-lousa .aula-mx__nome--grande { font-size: calc(var(--arr-fonte) * 1.2); font-weight: 700; }
.aula-live-lousa .aula-mx { display: inline-flex; flex-direction: column; align-items: center; }
.aula-live-lousa .aula-mx__grade { position: relative; display: grid; grid-template-columns: repeat(var(--nc), auto); gap: 4px 12px; padding: 8px 18px; }
.aula-live-lousa .aula-mx__grade::before, .aula-live-lousa .aula-mx__grade::after { content: ''; position: absolute; top: 0; bottom: 0;
  width: 9px; border: 3px solid var(--quadro-giz); }
.aula-live-lousa .aula-mx__grade::before { left: 0; border-right: none; border-radius: 5px 0 0 5px; }
.aula-live-lousa .aula-mx__grade::after { right: 0; border-left: none; border-radius: 0 5px 5px 0; }
.aula-live-lousa .aula-mx__grade--aberta::before, .aula-live-lousa .aula-mx__grade--aberta::after { content: none; }
.aula-live-lousa .aula-mx__cel { display: flex; align-items: center; justify-content: center; min-width: 1.9em; min-height: 1.7em;
  padding: 1px 4px; border-radius: 8px; }
.aula-live-lousa .aula-mx__cel .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.25); line-height: 1.2; }
.aula-live-lousa .aula-mx__cel--cor .aula-arr__txt, .aula-live-lousa .aula-mx__cel--cor .fig-solution { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-mx__cel--fraca { opacity: .34; }
.aula-live-lousa .aula-mx__cel--alvo { background: color-mix(in srgb, var(--giz-verde) 20%, transparent); box-shadow: inset 0 0 0 2px var(--giz-verde); }
.aula-live-lousa .aula-mx__cel--alvo .aula-arr__txt { color: var(--giz-verde); font-weight: 700; }
.aula-live-lousa .aula-mx__cel--duplo { background: linear-gradient(135deg, color-mix(in srgb, var(--lc) 34%, transparent) 50%, color-mix(in srgb, var(--cc) 34%, transparent) 50%);
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--quadro-giz) 25%, transparent); }
.aula-live-lousa .aula-mx__t { font-family: var(--font-calc); font-size: var(--arr-fonte); line-height: 1.2; white-space: nowrap; color: var(--cor, var(--quadro-giz)); }
.aula-live-lousa .aula-mx__n { display: inline-flex; align-items: center; color: var(--cor, var(--quadro-giz)); }
.aula-live-lousa .aula-mx__n .aula-arr__txt { font-size: var(--arr-fonte); }
.aula-live-lousa .aula-mx__n[style*="--cor"] .aula-arr__txt { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-mx__contas { display: flex; flex-direction: column; align-items: center; gap: 8px; max-width: 100%; }
.aula-live-lousa .aula-mx__contas--grade { display: grid; grid-template-columns: repeat(var(--pc), auto); justify-content: center; gap: 10px 36px; }
.aula-live-lousa .aula-mx__linha { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 8px; max-width: 100%; }
.aula-live-lousa .aula-mx__termo { display: inline-flex; align-items: center; gap: 4px; padding: 0 2px; color: var(--cor); }
.aula-live-lousa .aula-mx__termo .aula-mx__t { color: var(--cor); font-weight: 700; }
.aula-live-lousa .aula-mx__final { align-self: center; }
.aula-live-lousa .aula-mx__ordem { display: inline-flex; align-items: center; gap: 6px; }
.aula-live-lousa .aula-mx__ordem .aula-mx__t { font-weight: 700; }
.aula-live-lousa .aula-mx__sinal { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 3); line-height: 1; font-weight: 700; color: var(--giz-vermelho); }
.aula-live-lousa .aula-mx__sinal--igual { color: var(--giz-verde); }
/* produto_ordens: um quadradinho de pontos por matriz (m linhas, n colunas) */
.aula-live-lousa .aula-mx__produto { display: flex; flex-direction: column; align-items: center; gap: 12px; padding-bottom: 38px; }
.aula-live-lousa .aula-mx__cartao { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 6px 10px; border-radius: 10px; }
.aula-live-lousa .aula-mx__pontos { display: grid; grid-template-columns: repeat(var(--pc), auto); gap: 5px; }
.aula-live-lousa .aula-mx__ponto { width: 10px; height: 10px; border-radius: 50%; background: var(--quadro-giz); opacity: .8; }
.aula-live-lousa .aula-mx__resultado { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.aula-live-lousa .aula-mx__veredito { font-size: calc(var(--arr-fonte) * 1.6); font-weight: 700; line-height: 1; }
.aula-live-lousa .aula-mx__veredito--ok { color: var(--giz-verde); }
.aula-live-lousa .aula-mx__veredito--ruim { color: var(--giz-vermelho); }
.aula-live-lousa .aula-mx__nao { font-family: var(--font-calc); font-size: var(--arr-fonte); color: var(--giz-vermelho); }
.aula-live-lousa .aula-arr--matrizes-produto_setas[data-modo="celular"] .aula-mx__cel .aula-arr__txt,
.aula-live-lousa .aula-arr--matrizes-produto_completo[data-modo="celular"] .aula-mx__cel .aula-arr__txt,
.aula-live-lousa .aula-arr--matrizes-nao_comuta[data-modo="celular"] .aula-mx__cel .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.1); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mx__grade { gap: 3px 8px; padding: 6px 14px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mx__contas--grade { grid-template-columns: auto; gap: 8px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mx__pares { grid-template-columns: repeat(var(--np), minmax(2.4em, 1fr)); gap: 8px 8px; width: 100%; }
.aula-live-lousa .aula-mx__par-leg { display: none; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mx__par-leg { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 18px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mx__pares > .aula-mx__par-rot { display: none; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mx__pares { row-gap: 28px; }
.aula-live-lousa .aula-mx__cel .aula-arr__txt, .aula-live-lousa .aula-mx__cel .fig-solution__line, .aula-live-lousa .aula-mx__par-cel .fig-solution__line { text-align: center; }
/* produto_setas: espaço entre a fórmula cᵢⱼ e a tabela dos pares (as setas sobem por ali); conta que passa da largura
   encosta na borda em vez de sair pelos dois lados (safe center) */
.aula-live-lousa .aula-arr--matrizes-produto_setas .aula-mx__pares { margin-top: 48px; }
.aula-live-lousa .aula-arr--matrizes-produto_setas .aula-mx__contas { align-items: safe center; }
.aula-live-lousa .aula-arranjo.aula-arr--matrizes-produto_setas[data-modo="celular"] .aula-mx__pares { margin-top: 44px; }
.aula-live-lousa .aula-arranjo.aula-arr--matrizes-produto_setas[data-modo="celular"] .aula-mx__contas > .aula-mx__linha:first-child { --arr-fonte: 15px; gap: 2px 3px; }
.aula-live-lousa .aula-arranjo.aula-arr--matrizes-produto_setas[data-modo="celular"] .aula-mx__termo { gap: 2px; }

/* determinantes: o que soma (diagonais descendentes) numa família fria e o que subtrai (ascendentes) numa quente */
.aula-live-lousa .aula-arr--matrizes-det_ordem_dois,
.aula-live-lousa .aula-arr--matrizes-sarrus,
.aula-live-lousa .aula-arr--matrizes-det_cofatores,
.aula-live-lousa .aula-arr--matrizes-det_propriedades,
.aula-live-lousa .aula-arr--matrizes-binet,
.aula-live-lousa .aula-arr--matrizes-det_diz { display: flex; flex-direction: column; align-items: safe center; gap: 16px; }
.aula-live-lousa .aula-mx__cena--lado { flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; gap: 20px 40px; }
.aula-live-lousa .aula-mx__forte { font-weight: 700; }
.aula-live-lousa .aula-mx__nota { font-family: var(--font-calc); color: var(--giz-vermelho); font-size: var(--arr-fonte); text-align: center; }
.aula-live-lousa .aula-mx--sarrus .aula-mx__grade { gap: 8px 26px; padding: 10px 24px; }
.aula-live-lousa .aula-mx__cel--copia { opacity: .55; }
.aula-live-lousa .aula-mx__sarrus-prod { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 44px; }
.aula-live-lousa .aula-mx__sarrus-col { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.aula-live-lousa .aula-mx--sinais .aula-mx__cel .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.1); }
.aula-live-lousa .aula-mx--pequena .aula-mx__grade { gap: 2px 8px; padding: 3px 8px; }
.aula-live-lousa .aula-mx--pequena .aula-mx__cel { min-width: 1.2em; min-height: 1.3em; }
.aula-live-lousa .aula-mx--pequena .aula-mx__cel .aula-arr__txt { font-size: var(--arr-fonte); }
.aula-live-lousa .aula-mx--barras .aula-mx__grade::before, .aula-live-lousa .aula-mx--barras .aula-mx__grade::after { border-top: none; border-bottom: none; border-radius: 0; width: 0; }
.aula-live-lousa .aula-mx__termos-lap { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.aula-live-lousa .aula-mx__termo-lap { flex-wrap: nowrap; justify-content: flex-start; }
.aula-live-lousa .aula-mx__termo-lap--zero { opacity: .55; }
.aula-live-lousa .aula-mx__cena--props { gap: 30px; }
.aula-live-lousa .aula-mx__prop { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.aula-live-lousa .aula-mx__acao { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.aula-live-lousa .aula-mx__fila--cartoes { align-items: flex-start; gap: 24px 44px; }
.aula-live-lousa .aula-mx__cartao-det { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.aula-live-lousa .aula-mx__vered { display: flex; align-items: center; gap: 8px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mx--sarrus .aula-mx__grade { gap: 6px 14px; padding: 8px 18px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mx--sarrus .aula-mx__cel { min-width: 1.4em; }
.aula-live-lousa .aula-mx__linha--larga { gap: 6px 34px; }
.aula-live-lousa .aula-mx__par-det { display: inline-flex; align-items: center; gap: 8px; }
.aula-live-lousa .aula-arr--matrizes-det_ordem_dois .aula-mx__cel .aula-arr__txt,
.aula-live-lousa .aula-arr--matrizes-sarrus .aula-mx__cel .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.55); }
.aula-live-lousa .aula-arr--matrizes-det_ordem_dois .aula-mx__grade { gap: 14px 30px; padding: 12px 26px; }
.aula-live-lousa .aula-mx__cena--props .aula-mx__grade { gap: 8px 14px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-arr--matrizes-sarrus .aula-mx__cel .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.2); }
.aula-live-lousa .aula-mx--sarrus .aula-mx__grade { grid-template-columns: repeat(5, calc(var(--arr-fonte) * 3.1)); grid-auto-rows: calc(var(--arr-fonte) * 2.4); gap: 4px 6px; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mx--sarrus .aula-mx__grade { grid-template-columns: repeat(5, calc(var(--arr-fonte) * 2.5)); grid-auto-rows: calc(var(--arr-fonte) * 2); gap: 4px 4px; }

/* inversa e sistemas lineares com matrizes */
.aula-live-lousa .aula-arr--matrizes-inversa_ordem_dois,
.aula-live-lousa .aula-arr--matrizes-inversa_cofatores,
.aula-live-lousa .aula-arr--matrizes-inversa_escalonamento,
.aula-live-lousa .aula-arr--matrizes-conferir_inversa,
.aula-live-lousa .aula-arr--matrizes-cramer,
.aula-live-lousa .aula-arr--matrizes-forma_matricial,
.aula-live-lousa .aula-arr--matrizes-sistema_inversa { display: flex; flex-direction: column; align-items: safe center; gap: 16px; }
.aula-live-lousa .aula-mx__fila--etapas { align-items: flex-start; gap: 14px 10px; }
.aula-live-lousa .aula-mx__fila--etapas > .aula-mx__op { align-self: center; }
.aula-live-lousa .aula-mx__etapa { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 4px 8px; border-radius: 10px; }
.aula-live-lousa .aula-mx__fila--junta { flex-wrap: nowrap; gap: 6px; }
.aula-live-lousa .aula-mx__legenda { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.aula-live-lousa .aula-mx__legenda-t { font-size: calc(var(--arr-fonte) * .85); opacity: .9; }
.aula-live-lousa .aula-mx__envolve { padding: 4px 10px; border-radius: 10px; }
.aula-live-lousa .aula-mx__pre { white-space: pre; }
.aula-live-lousa .aula-mx__cena--passos { gap: 12px; }
.aula-live-lousa .aula-mx__passos { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px 38px; }
.aula-live-lousa .aula-mx__passo { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.aula-live-lousa .aula-mx__operacao { display: flex; flex-direction: column; align-items: center; line-height: 1; }
.aula-live-lousa .aula-mx__desce { font-family: var(--font-calc); font-size: calc(var(--arr-fonte) * 1.7); line-height: .9; color: var(--giz-amarelo); }
.aula-live-lousa .aula-mx--aumentada .aula-mx__grade { gap: 0; padding: 6px 16px; }
.aula-live-lousa .aula-mx--aumentada .aula-mx__cel { border-radius: 0; padding: 2px 11px; min-height: 1.9em; min-width: 1.6em; }
.aula-live-lousa .aula-mx--aumentada .aula-mx__cel--esq { background: color-mix(in srgb, var(--giz-azul) 12%, transparent); }
.aula-live-lousa .aula-mx--aumentada .aula-mx__cel--dir { background: color-mix(in srgb, var(--giz-verde) 12%, transparent); }
.aula-live-lousa .aula-mx--aumentada .aula-mx__cel--corte { border-left: 3px solid var(--quadro-giz); }
.aula-live-lousa .aula-mx__cel--pivo { box-shadow: inset 0 0 0 2.5px var(--giz-amarelo); }
.aula-live-lousa .aula-mx--aumentada .aula-mx__cel.aula-mx__cel--pivo { border-radius: 8px; }
.aula-live-lousa .aula-mx__sistema { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.aula-live-lousa .aula-mx__equacao { display: flex; align-items: baseline; white-space: pre; }
.aula-live-lousa .aula-mx__sub--letra { font-size: .8em; vertical-align: sub; }
.aula-live-lousa .aula-mx__nomes-x { display: flex; flex-direction: column; justify-content: space-around; align-items: flex-end; align-self: stretch; padding: 8px 0; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mx__fila--etapas { flex-direction: column; align-items: center; }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mx__fila--etapas > .aula-mx__op { transform: rotate(90deg); }
.aula-live-lousa .aula-arranjo[data-modo="celular"] .aula-mx--aumentada .aula-mx__cel { padding: 2px 6px; min-width: 1.3em; }

/* produto_ordens: quando a conta quebra de linha (celular), o resultado desce sem cobrir o arco e o sinal de cada produto */
.aula-live-lousa .aula-arr--matrizes-produto_ordens .aula-mx__fila { row-gap: 54px; }
/* tipos: o título de cada cartão não quebra (a ordem fica na mesma linha do nome) */
.aula-live-lousa .aula-arr--matrizes-tipos .aula-mx__cartao-tipo .aula-mx__nome { white-space: nowrap; }
.aula-live-lousa .aula-arranjo.aula-arr--matrizes-tipos[data-modo="celular"] .aula-mx__cartao-tipo .aula-mx__nome { font-size: var(--arr-fonte); }
/* o que é uma matriz, tipos, lei de formação, soma, transposta e elementos neutros */
.aula-live-lousa .aula-arr--matrizes-o_que_e,
.aula-live-lousa .aula-arr--matrizes-tipos,
.aula-live-lousa .aula-arr--matrizes-lei_formacao,
.aula-live-lousa .aula-arr--matrizes-soma_escalar,
.aula-live-lousa .aula-arr--matrizes-transposta,
.aula-live-lousa .aula-arr--matrizes-neutros { display: flex; flex-direction: column; align-items: safe center; gap: 16px; }
.aula-live-lousa .aula-mx--indices { margin: 30px 0 0 36px; }
.aula-live-lousa .aula-mx__cel--cruz { background: color-mix(in srgb, var(--giz-amarelo) 24%, transparent); box-shadow: inset 0 0 0 2px var(--giz-amarelo); }
.aula-live-lousa .aula-mx__contas--esq { align-items: flex-start; }
.aula-live-lousa .aula-mx__lei { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; font-size: calc(var(--arr-fonte) * 1.3); }
.aula-live-lousa .aula-mx__lei .aula-mx__t { font-size: calc(var(--arr-fonte) * 1.3); }
.aula-live-lousa .aula-mx__cartao-tipo { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.aula-live-lousa .aula-mx__grande .aula-arr__txt { font-size: calc(var(--arr-fonte) * 1.7); }
.aula-live-lousa .aula-mx__termo--zero { opacity: .5; }
.aula-live-lousa .aula-mx__final .aula-mx__linha { flex-wrap: nowrap; }
.aula-live-lousa .aula-mx__item--lado { flex-direction: row; align-items: center; gap: 10px; }
/* fim: arranjos da lousa (id0185) */

/* Página da lousa (id0185, Fases 3 e polimento): o CSS do motor de página (aula-pagina.js). Tudo sob
   .aula-live-lousa. As faixas empilham de cima para baixo; cada faixa leva 1 bloco inteiro ou 2 blocos (nunca 3).
   Os espaços são TOKENS: --pg-entre (entre os dois blocos da faixa), --pg-entre-faixas (vertical entre faixas),
   --pg-borda (margem lateral) e --pg-topo; computador 32/48/48+/40 px, celular 32/32/16/16 px. A largura de cada
   bloco e a escala (figuras 2,5×; fontes de 15 a 22 px) são decididas pelo motor, em px, quando o bloco aparece:
   nada que já está na lousa muda de lugar nem de tamanho. */
.aula-live-lousa.aula-pagina { --pg-entre: 32px; --pg-entre-faixas: 48px; --pg-borda: 48px; --pg-topo: 40px; }
.aula-live-lousa.aula-pagina[data-pg-modo="celular"] { --pg-entre: 32px; --pg-entre-faixas: 32px; --pg-borda: 16px; --pg-topo: 16px; }
/* Página de documento: --pg-borda é a margem lateral (6% da largura da lousa, nunca menos de 48 px; o motor a calcula e a
   põe aqui), --pg-topo a de cima, --pg-entre-faixas o espaço vertical entre faixas, --pg-entre o espaço entre os dois blocos. */
.figure-panel .fig-board.aula-live-lousa.aula-pagina { display: flex; flex-direction: column; flex-wrap: nowrap;
  align-items: stretch; align-content: flex-start; gap: var(--pg-entre-faixas); scrollbar-gutter: stable;
  padding: var(--pg-topo) var(--pg-borda) 76px; }   /* 76 px: o botão da lousa não cobre a última parte */
/* O gráfico de função também é figura: 2,5× o tamanho de antes (420 → o bloco usa a coluna, até 625 px) */
.aula-live-lousa.aula-pagina[data-pg-modo="computador"] .aula-parte--grafico_funcao > svg { width: min(100%, 625px); }
.aula-live-lousa .aula-pg-faixa { display: flex; align-items: flex-start; gap: var(--pg-entre); width: 100%; min-width: 0; }
.aula-live-lousa.aula-pagina .aula-pg-faixa > .aula-parte { flex: 0 0 auto; min-width: 0; max-width: 100%; padding: 0; }
.aula-live-lousa.aula-pagina .aula-duvidas { flex: 0 0 auto; display: flex; flex-direction: column; flex-wrap: nowrap;
  gap: var(--pg-entre-faixas); width: 100%; min-width: 0; box-sizing: border-box; }
.aula-live-lousa.aula-pagina .aula-duvida { flex: 0 0 auto; display: flex; flex-direction: column; flex-wrap: nowrap;
  gap: var(--pg-entre-faixas); width: 100%; min-width: 0; box-sizing: border-box; }
/* fim: página da lousa (id0185) */

/* ---------- Abertura da aula ao vivo e a foto (id0177) ----------
   Uma tela própria POR CIMA da lousa até a 1ª parte chegar: o rosto do Facin
   pulsa quando o professor fala. Ao sair, dissolve num zoom suave e a lousa
   aparece por baixo. A foto: um botão no meio, embaixo, sempre à vista, e a
   captura por cima da lousa. `.math-figure__drawing svg` estica todo svg da
   lousa — os ícones daqui são a exceção (como no .fale-proxima). */
.aula-abertura { position: absolute; inset: 0; z-index: 7; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 14px; padding: 24px; text-align: center;
  background: radial-gradient(circle at 50% 38%, var(--quadro-bg-2), var(--quadro-bg) 70%);
  color: var(--quadro-giz); opacity: 1; transform: scale(1);
  transition: opacity 800ms var(--ease-corte), transform 900ms var(--ease-corte), filter 800ms var(--ease-corte); }
.aula-abertura--saindo { opacity: 0; transform: scale(1.08); filter: blur(6px); pointer-events: none; }
.aula-abertura__orbe { position: relative; width: 132px; height: 132px; display: grid; place-items: center; }
.aula-abertura__rosto { position: relative; width: 84px; height: 84px; object-fit: contain;
  filter: var(--traco-desenho); transition: transform 220ms var(--ease-saida); }
.aula-abertura__onda { position: absolute; inset: 0; border-radius: var(--raio-circulo);
  border: 2px solid var(--accent); opacity: .25; transform: scale(.82);
  transition: opacity 300ms ease, transform 300ms ease; }
.aula-abertura--falando .aula-abertura__rosto { transform: scale(1.06); }
.aula-abertura--falando .aula-abertura__onda { opacity: .6; transform: scale(1); }
.aula-abertura__titulo { margin: 4px 0 0; font-family: var(--font-calc); font-size: clamp(30px, 5vw, 44px);
  color: var(--quadro-giz); }
.aula-abertura__estado { margin: 0; min-height: 1.5em; color: var(--accent); font-weight: 600; }
.aula-abertura__dica { margin: 0; max-width: 460px; color: var(--quadro-giz); opacity: .8; }
.aula-abertura__foto { margin-top: 6px; }
/* A lousa por baixo aparece junto com a saída da abertura. */
.math-figure__drawing.aula-live--abertura .fig-board { opacity: 0; }
.math-figure__drawing .fig-board.aula-live-lousa { transition: opacity 900ms var(--ease-corte); }
.figure-panel.aula-live-abrindo .math-figure__toolbar { opacity: 0; pointer-events: none; }
.figure-panel .math-figure__toolbar { transition: opacity 600ms var(--ease-corte); }
@media (prefers-reduced-motion: no-preference) {
  .aula-abertura--falando .aula-abertura__onda:nth-child(1) { animation: aulaOnda 1.6s ease-out infinite; }
  .aula-abertura--falando .aula-abertura__onda:nth-child(2) { animation: aulaOnda 1.6s ease-out .8s infinite; }
}
@keyframes aulaOnda { from { transform: scale(.82); opacity: .6; } to { transform: scale(1.35); opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .aula-abertura, .aula-abertura__rosto, .aula-abertura__onda { transition: opacity 200ms linear; }
  .aula-abertura--saindo, .aula-abertura--falando .aula-abertura__rosto { transform: none; filter: none; }
}
/* id0256: o botão de foto saiu do meio da lousa (cobria a última parte) e foi para a barra de ferramentas: é uma
   `barra-acao` como as outras, sem regra própria. */
/* A captura da foto, por cima da lousa. */
.aula-foto { position: absolute; inset: 0; z-index: 9; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 12px; padding: 16px;
  background: var(--quadro-bg); color: var(--quadro-giz); }
.aula-foto__palco { flex: 0 1 auto; min-height: 0; max-width: 100%; display: flex; justify-content: center; }
.aula-foto__video, .aula-foto__previa { max-width: min(100%, 720px); max-height: 52vh; border-radius: var(--raio-superficie);
  border: 1px solid var(--quadro-moldura); background: var(--surface); }
.aula-foto__estado { margin: 0; text-align: center; }
.aula-foto__acoes { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.math-figure__drawing .aula-abertura svg.icon,
.math-figure__drawing .aula-foto svg.icon { position: static; inset: auto; width: 20px; height: 20px; color: inherit; }
@media (max-width: 640px) {
  .aula-abertura { gap: 10px; padding: 16px; }
  .aula-abertura__orbe { width: 104px; height: 104px; }
  .aula-abertura__rosto { width: 64px; height: 64px; }
}
@media (max-width: 640px) {
  .figure-panel .fig-board.aula-live-lousa { padding: 12px; gap: 14px; }
  .aula-live-lousa .aula-parte { flex-basis: 100%; }
}

/* id0180 — a SEÇÃO DE DÚVIDAS: depois do divisor "Suas dúvidas", num contêiner
   só dela (as partes da aula ficam acima, intactas). Cada dúvida tem o bloco dela. */
.aula-live-lousa .aula-duvidas { flex: 1 1 100%; display: flex; flex-wrap: wrap; gap: 18px 28px;
  margin-top: 8px; padding-top: 14px; border-top: 2px dashed var(--quadro-moldura); }
.aula-duvidas__divisor { flex: 1 1 100%; margin: 0; font-size: 1.15em; color: var(--giz-vermelho); }
.aula-live-lousa .aula-duvida { flex: 1 1 100%; display: flex; flex-wrap: wrap; gap: 14px 28px; }
.aula-duvida__titulo { flex: 1 1 100%; margin: 0; color: var(--giz-vermelho); }
.aula-duvida__pergunta { flex: 1 1 100%; margin: 0; font-style: italic; overflow-wrap: anywhere; }
/* A parte da aula que já respondia a dúvida (sem rolar a lousa: só o fio vermelho). */
.aula-live-lousa .aula-parte--apontada { border-left-color: var(--giz-vermelho); }
/* O chip "💬 2 dúvidas guardadas" no HUD: discreto; no celular, só o 💬 e o número. */
.aula-duvidas-chip { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 4px;
  min-height: 28px; padding: 0 10px; border: 1px solid var(--border);
  border-radius: var(--raio-controle); background: var(--surface); color: var(--text-muted);
  font-size: var(--fs-etiqueta); white-space: nowrap; }
.aula-duvidas-chip[hidden] { display: none; }
@media (max-width: 640px) {
  .aula-duvidas-chip { padding: 0 8px; }
  .aula-duvidas-chip__txt { display: none; }
}

/* ---------- Celular DEITADO (id0126b) ----------
   De lado, sobram ~280px de altura: o Safari ainda come ~110px com as barras
   dele, e a página não tem como escondê-las. Depois da E69 a lousa já abria
   em tela cheia, mas o cabeçalho do painel (65px) e a barra (46px) somavam
   quase o mesmo que a própria lousa (127px, medido em 844×282): a figura e as
   contas saíam cortadas ao meio. Aqui, só com o aparelho deitado:
   - o cabeçalho sai do fluxo: o título e os dois botões de tamanho somem (com
     o painel já em tela cheia eles não fazem nada) e o × desce para a linha
     da barra, no canto — a barra é centralizada e sobra lugar dos lados;
   - respiros menores em volta da lousa;
   - a figura cabe na ALTURA da lousa (o vetor escala inteiro, sem cortar) e
     as contas ao lado seguem no tamanho natural, rolando se precisar;
   - a barra fica numa linha só (a regra de ≤640px a quebrava em duas);
   - as bordas respeitam o recorte da câmera (viewport-fit=cover no <head>).
   Fica no FIM do arquivo de propósito: empata em especificidade com os
   blocos de ≤640/≤768px, que também valem num celular deitado, e vence por
   vir depois. */
@media (max-height: 500px) and (orientation: landscape) {
  .app { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
  .topbar { min-height: 0; padding-top: 4px; padding-bottom: 4px; }
  /* A abertura (pergunta grande + exemplo + sugestões) não cabe nos ~130px
     que sobram entre a topbar e a caixa de mensagem; com o `overflow:
     visible` dela, vazava POR BAIXO da caixa (o exemplo e as sugestões
     ficavam tapados). Deitado, ela rola dentro do próprio espaço. */
  .app:not(.conversa-ativa) .conversation { overflow-y: auto; min-height: 0; }

  .figure-panel { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
  .figure-panel__head {
    position: absolute;
    right: calc(8px + env(safe-area-inset-right));
    bottom: calc(8px + env(safe-area-inset-bottom));
    z-index: 3;
    padding: 0;
    border: 0;
    background: none;
  }
  .figure-panel__title,
  #figureWideBtn,
  #figureFullBtn { display: none; }
  .figure-panel__body { padding: 6px 6px calc(6px + env(safe-area-inset-bottom)); gap: 6px; }
  .fig-board { padding: 10px 14px; gap: 16px; }
  .figure-panel .fig-board > svg,
  .figure-panel .fig-board > .fig-envolucro,
  .figure-panel .fig-board > svg.math-figure__svg--matriz,
  .figure-panel .fig-board > .fig-envolucro:has(> .math-figure__svg--matriz) { height: 100%; width: auto; max-width: 57%; }
  .figure-panel .fig-board > svg.math-figure__svg--matriz { max-width: 64%; }
  .figure-panel .math-figure__toolbar,
  .figure-panel .math-figure__toolbar .segmento,
  .figure-panel .math-figure__toolbar .barra-acoes { width: auto; }
}

/* ---------- 7. (vago) ----------
   O `@media print` da id0055 morava aqui ("Salvar a lousa em PDF" via
   `window.print()`). REVOGADO na id0061: o usuário relatou que o botão
   "grande parte das vezes não aciona nada, e quando faz algo, imprime uma
   tela em branco" — o diálogo de impressão do sistema é opaco demais e não
   dá pista nenhuma de por que falha. Virou download instantâneo de PNG,
   desenhado num <canvas> pelo próprio JS (ver figBaixarLousaPNG no app.js);
   nenhuma classe liga mais `imprimindo-lousa`, então este bloco virava CSS
   morto se ficasse. */

/* ---------- Páginas /termos e /privacidade (Etapa 2, Fase 5) ----------
   O HTML vem do servidor (consentimento.pagina_legal), a partir do mesmo
   arquivo que o aceite cobre. Página de leitura: coluna estreita, rola. */
.pagina-legal-corpo { height: auto; min-height: 100%; }
.pagina-legal {
  max-width: 720px;
  margin: 0 auto;
  padding: 32px 16px 64px;
  line-height: 1.65;
}
.pagina-legal h1 { font-size: 30px; line-height: 1.2; margin: 12px 0 20px; }
.pagina-legal h2 { font-size: 20px; margin: 32px 0 10px; }
.pagina-legal h3 { font-size: 17px; margin: 24px 0 8px; }
.pagina-legal p, .pagina-legal li { color: var(--text); }
.pagina-legal ul { padding-left: 22px; }
.pagina-legal li { margin: 6px 0; }
.pagina-legal hr { border: 0; border-top: 1px solid var(--border); margin: 24px 0; }
.pagina-legal a { color: var(--accent); padding: 11px 2px; margin: -11px -2px; }
.pagina-legal__voltar, .pagina-legal__outra { font-size: 14px; }
.pagina-legal__outra { margin-top: 40px; padding-top: 16px; border-top: 1px solid var(--border); }

/* Etapa 3: pagina curta para o adulto que recebeu o link do aluno. */
.pagina-pagar-corpo { min-height: 100vh; height: auto; background: var(--bg); color: var(--text); }
.pagina-pagar { width: min(100%, 720px); margin: 0 auto; padding: clamp(20px, 5vw, 48px) 16px 64px; }
.pagina-pagar__voltar { display: inline-flex; align-items: center; min-height: 44px; color: var(--text); font-weight: 700; text-decoration: none; }
.pagina-pagar__voltar:hover { text-decoration: underline; }
.pagina-pagar__card {
  margin-top: clamp(36px, 8vw, 80px); padding: clamp(24px, 5vw, 48px);
  background: var(--surface); border: 1px solid var(--border-strong);
  border-radius: var(--raio-destaque);
}
.pagina-pagar__etiqueta { margin: 0 0 12px; color: var(--text-muted); font-size: var(--fs-etiqueta); }
.pagina-pagar h1 { margin: 0 0 20px; font-family: var(--font-display); font-size: clamp(30px, 6vw, 48px); line-height: 1.1; }
.pagina-pagar p { line-height: 1.55; }
.pagina-pagar__acao { min-height: 48px; margin-top: 24px; }
.pagina-pagar__acao[hidden] { display: none; }
.pagina-pagar__estado { min-height: 1.5em; color: var(--text); }
.pagina-pagar__legal { margin-top: 32px; font-size: 14px; }
.pagina-pagar__legal a { display: inline-flex; align-items: center; min-height: 44px; color: var(--accent); }

.planos__preco { margin: 20px 0 0; color: var(--text); font-size: 1.1rem; font-weight: 700; }
.planos__card--destaque .planos__preco { color: var(--on-accent); }
.planos__arrependimento { margin: 12px 0 0; color: var(--text-muted); font-size: 13px; line-height: 1.5; }
.planos__card--destaque .planos__arrependimento { color: var(--on-accent); }
.planos__adulto { max-width: 560px; margin: 28px auto 0; }
.planos__adulto h3 { margin: 0 0 12px; font-size: clamp(24px, 4vw, 32px); }
.planos__adulto p { line-height: 1.5; }
.planos__adulto-acoes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 24px; }
.planos__adulto-acoes button { min-height: 48px; }
.planos__link { display: block; width: 100%; min-height: 44px; margin: 16px 0; padding: 10px 12px;
  border: 1px solid var(--border-strong); border-radius: var(--raio-controle);
  background: var(--surface); color: var(--text); font: inherit; }
.planos__erro { color: var(--text); min-height: 1.5em; }
@media (max-width: 560px) {
  .planos__adulto-acoes { grid-template-columns: 1fr; }
}
/* Aula com GPT Live: a cena persiste entre delegações. */
.aula-live__boneco { width: 76px; height: 76px; margin: 0 auto; }
.aula-live__boneco svg { width: 100%; height: 100%; }
.aula-live__lousa { position: relative; inset: auto; display: flex; flex-direction: column;
  width: min(100%, 760px); min-height: 220px; margin: 12px auto;
  padding: 20px; border: 1px solid var(--border);
  overflow: auto; }
.aula-live__lousa > svg.aula-oculto,
.aula-live__lousa > .fig-envolucro.aula-oculto { display: none; }
.aula-live__titulo { margin: 0 0 12px; font-weight: 700; }
.aula-live__transcricao { max-width: 760px; margin: 8px auto; min-height: 2em; }
.aula-live__audio audio { width: min(100%, 360px); }
.aula-live__lousa .aula-matriz { margin: 0 auto; }