/* Painel de trabalho da conversa por voz (596): tela do Mac grande, conversa e
   "Mac trabalhando" cada um no seu espaço, avatar fora da tela. No app nativo a
   tela do Mac é uma camada por cima do palco: nada da página pode ficar sobre ele. */

/* Janela: ocupa a tela do aparelho. */
html:root:is([data-tema], :not([data-tema])) .modal.modal-painel.modal-painel:has(.voz-painel) {
  --voz-painel-raio: 22px;
  width: calc(100vw - 2 * max(10px, env(safe-area-inset-left)));
  height: calc(var(--aki-visual-altura, 100dvh) - 2 * max(10px, env(safe-area-inset-top)));
  max-width: none; max-height: none; overflow: hidden;
  display: flex; flex-direction: column;
  padding: 6px 14px max(10px, env(safe-area-inset-bottom));
  border-radius: var(--voz-painel-raio); border-bottom: 1px solid var(--borda-forte);
}
html:root:is([data-tema], :not([data-tema])) .modal.modal-painel:has(.voz-painel)::before { display: none; }
html:root:is([data-tema], :not([data-tema])) .modal.modal-painel:has(.voz-painel) > .modal-cab { flex: none; min-height: 40px; margin: 0 0 4px; }
html:root:is([data-tema], :not([data-tema])) .modal.modal-painel:has(.voz-painel) > .modal-cab h2 { font-size: 15px; margin: 0; }
html:root:is([data-tema], :not([data-tema])) .modal.modal-painel:has(.voz-painel) > .voz-painel:not(.mini) { flex: 1; min-height: 0; }

/* Grade comum: cada parte num lugar com nome. */
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) {
  display: grid; column-gap: 14px; row-gap: 0; min-height: 0; min-width: 0;
  grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto auto auto minmax(0, 1fr) auto auto auto;
  grid-template-areas: "topo" "confirmacoes" "tela" "abas" "avisos" "conversa" "area" "digitar" "rodape";
}
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-topo { grid-area: topo; }
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-confirmacoes {
  grid-area: confirmacoes; min-width: 0; min-height: 0; max-height: min(280px, 50dvh);
  overflow-y: auto; overscroll-behavior: contain; padding: 2px 0 8px;
}
.voz-confirmacoes:not(:has(.voz-comando-confirmar, .voz-trabalho-permissao)),
.voz-confirmacao-acao:empty, .voz-trabalho-alertas:empty, .voz-comando.mini > .voz-confirmacoes { display: none !important; }
.voz-confirmacoes :is(.voz-comando-confirmar, .voz-trabalho-permissao) { margin: 0; padding: 10px 12px; }
.voz-confirmacoes .voz-comando-descricao { max-height: min(110px, 14dvh); overflow-y: auto; overflow-wrap: anywhere; margin: 0; }
.voz-confirmacoes .voz-comando-acoes { display: flex; flex-wrap: wrap; gap: 8px; }
.voz-confirmacoes .voz-comando-acoes .botao { flex: 1; min-height: 44px; min-width: 80px; }
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-estudio { grid-area: tela; }
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-painel-abas { grid-area: abas; }
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-avisos { grid-area: avisos; }
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-conteudo { grid-area: conversa; }
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-trabalho { grid-area: conversa; }
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-area { grid-area: area; }
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-digitar { grid-area: digitar; }
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-rodape { grid-area: rodape; }
.voz-comando.mini > :is(.voz-trabalho, .voz-painel-abas) { display: none; }
.voz-painel:not(.mini) > .voz-mini-barra { display: none; }

/* Presença do Aki: cartão compacto, fora da tela do Mac e da conversa. */
html:root:is([data-tema], :not([data-tema])) .modal .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-topo {
  position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; justify-items: start;
  gap: 12px; padding: 6px 4px 8px; margin: 0;
}
html:root:is([data-tema], :not([data-tema])) .modal .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-topo .voz-comando-status { text-align: start; margin: 0; font-size: 14px; line-height: 1.4; justify-self: stretch; }
html:root:is([data-tema], :not([data-tema])) .modal .voz-painel:not(.mini) .voz-comando-minimizar { position: static; }
html:root:is([data-tema], :not([data-tema])):not([data-aki-avatar="oculto"]) .voz-comando.voz-painel.aki-com-avatar:not(.mini) .voz-orbe.aki-avatar-voz.voz-comando-orbe:not(.aki-avatar-indisponivel),
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) .voz-orbe.voz-comando-orbe {
  width: 52px; height: 52px; aspect-ratio: 1; border-radius: 16px;
}

/* Tela do Mac. */
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-estudio {
  display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto auto; gap: 6px; min-height: 0; min-width: 0;
  container: estudio / inline-size; padding-bottom: 8px;
}
.voz-painel .voz-estudio-ferramentas { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.voz-painel .voz-estudio-ferramentas .botao { min-height: 44px; min-width: 44px; padding: 6px 12px; gap: 6px; border-radius: 14px; }
.voz-painel .voz-estudio-controle { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid var(--barra-ouro); border-radius: 16px; }
.voz-painel .voz-estudio-controle[hidden] { display: none; }
.voz-painel .voz-estudio-controle .botao { border-color: transparent; }
.voz-painel .voz-estudio-status { font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.voz-painel.voz-ia-ve-tela .voz-estudio-status::before { content: '● A IA vê a tela · '; color: var(--acento-claro, var(--acento)); }
html:root:is([data-tema], :not([data-tema])) .voz-painel .voz-estudio-palco { height: clamp(180px, 42dvh, 760px); min-height: 0; border-radius: 14px; }
.voz-painel .voz-estudio-palco[data-controle="direto"], .voz-painel .voz-estudio-palco[data-controle="trackpad"] { border-color: var(--acento-claro, var(--acento)); box-shadow: 0 0 0 1px var(--acento-claro, var(--acento)); }
.voz-painel .voz-estudio-vazio { display: grid; gap: 10px; justify-items: center; }
.voz-painel .voz-estudio-vazio p { margin: 0; }
.voz-painel .voz-estudio-dica { margin: 0; font-size: 12.5px; color: var(--tinta-2); line-height: 1.45; }
.voz-painel .voz-estudio-dica[hidden] { display: none; }
/* Uma linha de ferramentas: com pouco espaço só os ícones (o nome fica no toque longo e no leitor de tela);
   os modos de controle mantêm o nome, que é o que mais se troca. */
@container estudio (max-width: 1250px) { .voz-painel .voz-estudio-ferramentas > .botao .voz-estudio-rotulo { display: none; } .voz-painel .voz-estudio-ferramentas > .botao { padding: 6px 10px; } }
@container estudio (max-width: 620px) { .voz-painel .voz-estudio-controle .voz-estudio-rotulo { display: none; } }

/* Conversa: só as falas, com rolagem própria. */
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-conteudo {
  min-height: 0; overflow-y: auto; padding: 10px 10px 12px; border: 1px solid var(--borda); border-radius: 16px;
  background: var(--barra-cristal);
}
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-digitar { padding: 8px 0 0; margin: 0; }
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-digitar[hidden] { display: none; }
html:root:is([data-tema], :not([data-tema])) .modal .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-rodape { justify-content: flex-start; gap: 8px; padding-top: 8px; border-top: 0; }
.voz-chat-pedido {
  display: flex; align-items: center; gap: 8px; width: fit-content; max-width: 94%; justify-self: start;
  font: inherit; font-size: 13px; text-align: start; color: var(--tinta-2); cursor: pointer;
  padding: 8px 12px; min-height: 44px; border: 1px dashed var(--barra-ouro); border-radius: 14px; background: transparent;
}
.voz-chat-pedido-ver { color: var(--acento-claro, var(--acento)); white-space: nowrap; font-size: 12px; }
.voz-resultado { width: min(100%, 640px); min-width: 0; justify-self: start; padding: 12px; color: var(--tinta); background: var(--barra-cristal); border: 1px solid var(--barra-ouro); border-radius: 16px; }
.voz-resultado > strong { display: block; font-size: 14px; }
.voz-resultado > p { margin: 6px 0 10px; font-size: 13px; }
.voz-resultado-arquivos { display: grid; gap: 10px; min-width: 0; }
.voz-resultado .iamac-arquivo { width: 100%; min-width: 0; }
.voz-resultado .iamac-arquivo-abrir { min-height: 44px; }
.voz-resultado .iamac-arquivo-visual img { max-height: 360px; object-fit: contain; }
.voz-resultado button { touch-action: manipulation; }

/* Mac trabalhando. */
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-trabalho {
  display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 8px; min-height: 0; min-width: 0;
  padding: 10px 12px; border: 1px solid var(--barra-ouro); border-radius: 16px; background: var(--barra-cristal);
  container: trabalho / inline-size;
}
.voz-trabalho-cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.voz-trabalho-cab h3 { margin: 0; font-size: 15px; }
.voz-trabalho-abas { display: flex; gap: 4px; flex-wrap: wrap; }
.voz-trabalho-aba, .voz-painel-aba {
  font: inherit; font-size: 13px; min-height: 40px; padding: 6px 12px; border-radius: 12px; cursor: pointer;
  border: 1px solid var(--borda); background: transparent; color: var(--tinta-2);
}
.voz-trabalho-aba[aria-pressed="true"], .voz-painel-aba[aria-pressed="true"] { color: var(--tinta); border-color: var(--barra-ouro); background: color-mix(in srgb, var(--acento, #d4a93a) 14%, transparent); }
.voz-trabalho-corpo { min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.voz-trabalho[data-aba="telas"] .voz-trabalho-corpo > :not(.displaypilot-controles),
.voz-trabalho:not([data-aba="telas"]) .voz-trabalho-corpo > .displaypilot-controles { display: none; }
.voz-trabalho .voz-estudio-arquivos[hidden], .voz-trabalho .voz-trabalho-pedidos[hidden] { display: none; }
.voz-trabalho .displaypilot-controles { border-bottom: 0; margin: 0; }
.displaypilot-ajuste { display: grid; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid var(--borda); }
.displaypilot-ajuste p { margin: 0; }
.displaypilot-auto { display: flex !important; align-items: center; gap: 10px; align-self: end; min-height: 44px; }
.displaypilot-auto input { width: 22px !important; min-height: 22px !important; height: 22px; }
.voz-trabalho .voz-estudio-pedido { gap: 6px; padding-top: 8px; border-top: 1px solid var(--borda); }
.voz-trabalho .voz-estudio-pedido textarea { min-height: 44px; max-height: 120px; }

.voz-trabalho-pedidos { display: grid; gap: 10px; align-content: start; min-height: 0; }
.voz-trabalho-alertas:empty { display: none; }
.voz-trabalho-permissao { display: grid; gap: 8px; padding: 10px 12px; border: 1px solid #e0a33a; border-radius: 14px; background: color-mix(in srgb, #e0a33a 12%, transparent); overflow-wrap: anywhere; }
.voz-trabalho-lista { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; }
.voz-trabalho-lista:empty { display: none; }
.voz-trabalho-item {
  flex: 0 0 min(240px, 80%); display: grid; gap: 3px; text-align: start; font: inherit; cursor: pointer; color: var(--tinta);
  padding: 8px 10px; border: 1px solid var(--borda); border-radius: 12px; background: transparent; min-height: 44px;
}
.voz-trabalho-item[aria-pressed="true"] { border-color: var(--barra-ouro); background: color-mix(in srgb, var(--acento, #d4a93a) 10%, transparent); }
.voz-trabalho-item-topo { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.voz-trabalho-item-pedido { font-size: 13px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.voz-trabalho-item-linha { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.voz-trabalho-estado { font-size: 11.5px; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--borda); white-space: nowrap; }
.voz-trabalho-estado:is([data-estado="enviando"], [data-estado="executando"], [data-estado="cancelando"]) { color: var(--acento-claro, var(--acento)); border-color: var(--barra-ouro); }
.voz-trabalho-estado[data-estado="concluido"] { color: #6fcf8e; border-color: #6fcf8e80; }
.voz-trabalho-estado[data-estado="erro"] { color: #ff7a70; border-color: #ff7a7080; }
.voz-trabalho-detalhe { min-width: 0; }
.voz-trabalho-vazio { margin: 0; }
.voz-pedido-mac { display: grid; gap: 8px; min-width: 0; }
.voz-pedido-mac[hidden] { display: none; }
.voz-pedido-cab { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.voz-pedido-titulo { font-weight: 600; overflow-wrap: anywhere; }
.voz-pedido-meta { font-variant-numeric: tabular-nums; color: var(--tinta-mudo); font-size: 13px; }
.voz-pedido-mac .voz-estudio-andamento { margin: 0; }
.voz-pedido-passos { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.voz-pedido-passo { display: grid; grid-template-columns: 20px minmax(0, 1fr); column-gap: 8px; align-items: start; font-size: 14px; animation: passo-entra .25s ease; }
.voz-pedido-passo-icone { grid-row: span 2; text-align: center; color: #6fcf8e; }
.voz-pedido-passo[data-estado="rodando"] .voz-pedido-passo-icone::before { content: ''; display: inline-block; width: 10px; height: 10px; border-radius: 50%; border: 2px solid var(--acento-claro, var(--acento)); border-right-color: transparent; animation: passo-gira 0.9s linear infinite; }
.voz-pedido-passo[data-estado="falhou"] .voz-pedido-passo-icone { color: #ff7a70; }
.voz-pedido-passo-bruto { color: var(--tinta-mudo); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.voz-pedido-passo-bruto:empty { display: none; }
.voz-pedido-mac .voz-estudio-resposta { max-height: none; padding-top: 6px; border-top: 1px solid var(--borda); }
.voz-pedido-mac .voz-estudio-resposta:empty { display: none; }
@keyframes passo-entra { from { opacity: 0; transform: translateY(4px); } }
@keyframes passo-gira { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .voz-pedido-passo, .voz-pedido-passo-icone::before { animation: none !important; } }
@container trabalho (min-width: 620px) {
  .voz-trabalho-pedidos:has(.voz-trabalho-item) { grid-template-columns: minmax(190px, 34%) minmax(0, 1fr); align-items: start; }
  .voz-trabalho-alertas { grid-column: 1 / -1; }
  .voz-trabalho-lista { flex-direction: column; overflow-x: visible; }
  .voz-trabalho-item { flex: none; }
}

/* iPhone: abas Conversa | Mac e o passo atual sempre à vista. */
.voz-painel-abas { display: grid; gap: 6px; padding: 2px 0 8px; }
.voz-painel-abas-botoes { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.voz-trabalho-resumo {
  font: inherit; font-size: 13px; text-align: start; cursor: pointer; min-height: 40px; padding: 6px 12px;
  border: 1px solid var(--barra-ouro); border-radius: 12px; background: transparent; color: var(--acento-claro, var(--acento));
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.voz-trabalho-resumo[hidden] { display: none; }
/* O iPhone conserva os quatro cantos da janela, inclusive em paisagem e com
   teclado. O recorte explícito contém também camadas compostas pelo WebKit. */
@media (max-width: 699px), (max-height: 520px) and (min-aspect-ratio: 3/2) {
  html:root:is([data-tema], :not([data-tema])) .modal.modal-painel.modal-painel:has(.voz-painel) {
    clip-path: inset(0 round var(--voz-painel-raio));
  }
}
@media (max-width: 699px) {
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini):has(> .voz-confirmacoes :is(.voz-comando-confirmar, .voz-trabalho-permissao)) > .voz-estudio { display: none; }
  html:root:is([data-tema], :not([data-tema])) .modal.modal-painel.modal-painel:has(.voz-painel) { width: 100vw; height: var(--aki-visual-altura, 100dvh); padding: max(4px, env(safe-area-inset-top)) 10px max(8px, env(safe-area-inset-bottom)); }
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar[data-aba="conversa"]:not(.mini) > .voz-trabalho,
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar[data-aba="trabalho"]:not(.mini) > :is(.voz-comando-conteudo, .voz-comando-area, .voz-comando-avisos) { display: none; }
  html:root:is([data-tema], :not([data-tema])) .voz-painel .voz-estudio-palco { height: clamp(150px, 30dvh, 340px); }
  html:root:is([data-tema], :not([data-tema])) .voz-painel .voz-estudio-palco:not(.ativo) { height: clamp(110px, 17dvh, 200px); }
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar[data-aba="trabalho"]:not(.mini) > .voz-comando-digitar { display: none; }
  .voz-painel .voz-trabalho .voz-estudio-pedido-acoes { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; }
  html:root:is([data-tema], :not([data-tema])):not([data-aki-avatar="oculto"]) .voz-comando.voz-painel.aki-com-avatar:not(.mini) .voz-orbe.aki-avatar-voz.voz-comando-orbe:not(.aki-avatar-indisponivel),
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) .voz-orbe.voz-comando-orbe { width: 64px; height: 64px; border-radius: 16px; }
  html:root:is([data-tema], :not([data-tema])) .modal .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-topo { padding: 2px 0 6px; gap: 10px; }
  html:root:is([data-tema], :not([data-tema])) .modal .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-topo .voz-comando-status { font-size: 13px; }
  html:root:is([data-tema], :not([data-tema])) .modal .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-rodape { padding-top: 6px; }
  /* Ferramentas com nome curto embaixo do ícone, quatro por linha (sem o Mac cabem numa só);
     os modos de controle ganham a última linha inteira, logo acima da tela. Com pouca altura
     (teclado aberto, iPhone pequeno) ficam só os ícones, para a tela do Mac não ser empurrada. */
  @media (min-height: 700px) {
    html:not([data-aki-teclado-aberto]) .voz-painel .voz-estudio-ferramentas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
    html:not([data-aki-teclado-aberto]) .voz-painel .voz-estudio-ferramentas > .botao { flex-direction: column; gap: 3px; min-height: 52px; padding: 6px 4px 5px; }
    html:not([data-aki-teclado-aberto]) .voz-painel .voz-estudio-ferramentas > .voz-estudio-controle { grid-column: 1 / -1; order: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    html:not([data-aki-teclado-aberto]) .voz-painel .voz-estudio-ferramentas > .voz-estudio-controle[hidden] { display: none; }
    html:not([data-aki-teclado-aberto]) .voz-painel .voz-estudio-ferramentas > .voz-estudio-controle .botao { min-height: 44px; }
    html:not([data-aki-teclado-aberto]) .voz-painel .voz-estudio-ferramentas > :is(.botao, .voz-estudio-controle) .voz-estudio-rotulo { display: block; font-size: 0; line-height: 0; max-width: 100%; }
    html:not([data-aki-teclado-aberto]) .voz-painel .voz-estudio-ferramentas > :is(.botao, .voz-estudio-controle) .voz-estudio-rotulo::after {
      content: attr(data-curto); display: block; font-size: 11.5px; line-height: 1.2; font-weight: 600; letter-spacing: .01em;
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
  }
}

/* iPad em pé (e telas médias): tela em cima; conversa e trabalho lado a lado. */
@media (min-width: 700px) {
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) {
    grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
    grid-template-rows: auto auto auto auto minmax(0, 1fr) auto auto auto;
    grid-template-areas: "topo topo" "confirmacoes confirmacoes" "tela tela" "avisos trabalho" "conversa trabalho" "area trabalho" "digitar trabalho" "rodape trabalho";
  }
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-trabalho { grid-area: trabalho; }
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-painel-abas { display: none; }
  html:root:is([data-tema], :not([data-tema])) .voz-painel .voz-estudio-palco { height: min(46dvh, calc((100vw - 60px) * 0.64)); }
  html:root:is([data-tema], :not([data-tema])) .voz-painel .voz-estudio-palco:not(.ativo) { height: min(30dvh, calc((100vw - 60px) * 0.45)); }
  html:root:is([data-tema], :not([data-tema])):not([data-aki-avatar="oculto"]) .voz-comando.voz-painel.aki-com-avatar:not(.mini) .voz-orbe.aki-avatar-voz.voz-comando-orbe:not(.aki-avatar-indisponivel),
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) .voz-orbe.voz-comando-orbe { width: 80px; height: 80px; border-radius: 18px; }
}

/* iPad deitado e computador: conversa à esquerda (com o Aki no alto), tela grande
   à direita e "Mac trabalhando" embaixo dela. */
@media (min-width: 900px) and (min-aspect-ratio: 5/4) {
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) {
    grid-template-columns: minmax(280px, 27%) minmax(0, 1fr);
    grid-template-rows: auto auto auto minmax(0, 1.85fr) minmax(210px, 1fr) auto auto auto;
    grid-template-areas: "topo tela" "confirmacoes tela" "avisos tela" "conversa tela" "conversa trabalho" "area trabalho" "digitar trabalho" "rodape trabalho";
  }
  /* Sem vídeo, o trabalho ganha espaço; com a tela do Mac ligada, ela fica com a maior parte. */
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini):not(:has(.voz-estudio-palco.ativo)) { grid-template-rows: auto auto auto minmax(0, 1fr) minmax(260px, 1.25fr) auto auto auto; }
  html:root:is([data-tema], :not([data-tema])) .voz-painel .voz-estudio-palco { height: auto; }
  html:root:is([data-tema], :not([data-tema])) .modal .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-topo {
    grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; padding: 10px; margin-bottom: 10px;
    border: 1px solid var(--borda); border-radius: 18px; background: var(--barra-cristal);
  }
  html:root:is([data-tema], :not([data-tema])) .modal .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-topo .voz-comando-orbe { grid-row: 1 / 3; }
  html:root:is([data-tema], :not([data-tema])) .modal .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-comando-topo .voz-comando-minimizar { grid-column: 2; justify-self: end; grid-row: 2; }
  html:root:is([data-tema], :not([data-tema])):not([data-aki-avatar="oculto"]) .voz-comando.voz-painel.aki-com-avatar:not(.mini) .voz-orbe.aki-avatar-voz.voz-comando-orbe:not(.aki-avatar-indisponivel),
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) .voz-orbe.voz-comando-orbe { width: 120px; height: 120px; border-radius: 22px; }
}

/* iPhone deitado: tela do Mac à esquerda, tudo o mais numa coluna estreita. */
@media (max-height: 520px) and (min-aspect-ratio: 3/2) {
  html:root:is([data-tema], :not([data-tema])) .modal.modal-painel.modal-painel:has(.voz-painel) { width: 100vw; height: var(--aki-visual-altura, 100dvh); padding: 4px max(10px, env(safe-area-inset-right)) 6px max(10px, env(safe-area-inset-left)); }
  html:root:is([data-tema], :not([data-tema])) .modal.modal-painel:has(.voz-painel) > .modal-cab { display: none; }
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) {
    grid-template-columns: minmax(0, 1fr) minmax(240px, 36%);
    grid-template-rows: auto auto auto auto minmax(0, 1fr) auto auto auto;
    grid-template-areas: "tela topo" "tela confirmacoes" "tela abas" "tela avisos" "tela conversa" "tela area" "tela digitar" "tela rodape";
  }
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-trabalho { grid-area: conversa; }
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) > .voz-painel-abas { display: grid; }
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar[data-aba="conversa"]:not(.mini) > .voz-trabalho,
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar[data-aba="trabalho"]:not(.mini) > :is(.voz-comando-conteudo, .voz-comando-area, .voz-comando-avisos) { display: none; }
  html:root:is([data-tema], :not([data-tema])) .voz-painel .voz-estudio-palco { height: auto; }
  html:root:is([data-tema], :not([data-tema])):not([data-aki-avatar="oculto"]) .voz-comando.voz-painel.aki-com-avatar:not(.mini) .voz-orbe.aki-avatar-voz.voz-comando-orbe:not(.aki-avatar-indisponivel),
  html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.aki-com-avatar:not(.mini) .voz-orbe.voz-comando-orbe { width: 40px; height: 40px; border-radius: 12px; }
  .voz-painel .voz-estudio-ferramentas .voz-estudio-rotulo { display: none; }
}

@media (max-height: 520px) and (min-aspect-ratio: 3/2) {
  /* A faixa mínima do trabalho no desktop não cabe atrás do teclado em paisagem. */
  html:root[data-aki-teclado-aberto]:is([data-tema], :not([data-tema])) .modal .voz-comando.voz-painel.aki-com-avatar:not(.mini) {
    grid-template-rows: auto auto auto auto minmax(0, 1fr) auto auto auto;
  }
}

/* Foco na tela: a tela do Mac fica com quase tudo; o Aki e o passo atual seguem à vista. */
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.voz-foco-tela.aki-com-avatar:not(.mini) {
  grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto minmax(0, 1fr) auto;
  grid-template-areas: "topo" "confirmacoes" "tela" "abas";
}
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.voz-foco-tela.aki-com-avatar:not(.mini) > :is(.voz-comando-avisos, .voz-comando-conteudo, .voz-trabalho, .voz-comando-area, .voz-comando-digitar, .voz-comando-rodape) { display: none; }
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.voz-foco-tela.aki-com-avatar:not(.mini) > .voz-painel-abas { display: grid; padding-top: 6px; }
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.voz-foco-tela.aki-com-avatar:not(.mini) .voz-painel-abas-botoes { display: none; }
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.voz-foco-tela .voz-estudio-palco:is(.ativo, :not(.ativo)) { height: auto; }
html:root:is([data-tema], :not([data-tema])) .modal .voz-comando.voz-painel.voz-foco-tela.aki-com-avatar:not(.mini) > .voz-comando-topo { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-rows: auto; padding: 2px 0 6px; margin: 0; border: 0; background: none; }
html:root:is([data-tema], :not([data-tema])) .modal .voz-comando.voz-painel.voz-foco-tela.aki-com-avatar:not(.mini) > .voz-comando-topo .voz-comando-orbe { grid-row: auto; }
html:root:is([data-tema], :not([data-tema])) .modal .voz-comando.voz-painel.voz-foco-tela.aki-com-avatar:not(.mini) > .voz-comando-topo .voz-comando-minimizar { grid-row: auto; grid-column: auto; }
html:root:is([data-tema], :not([data-tema])):not([data-aki-avatar="oculto"]) .voz-comando.voz-painel.voz-foco-tela.aki-com-avatar:not(.mini) .voz-orbe.aki-avatar-voz.voz-comando-orbe:not(.aki-avatar-indisponivel),
html:root:is([data-tema], :not([data-tema])) .voz-comando.voz-painel.voz-foco-tela.aki-com-avatar:not(.mini) .voz-orbe.voz-comando-orbe { width: 44px; height: 44px; border-radius: 13px; }


/* Teclado do Mac: campo e atalhos fora da tela, para não cobrir o Mac. */
.voz-painel .voz-estudio-teclado { display: grid; gap: 6px; }
.voz-painel .voz-estudio-teclado[hidden] { display: none; }
.voz-estudio-teclado-texto { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; margin: 0; }
.voz-estudio-teclado-texto input { margin: 0; min-height: 44px; font-size: 16px; }
.voz-estudio-teclas { display: flex; flex-wrap: wrap; gap: 4px; }
.voz-painel .voz-estudio-teclas .botao { min-height: 44px; min-width: 44px; padding: 0 10px; font-size: 13px; border-radius: 12px; }
@container trabalho (min-width: 620px) {
  .voz-trabalho .voz-estudio-pedido { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .voz-trabalho .voz-estudio-pedido > .voz-estudio-anexos { grid-column: 1 / -1; order: 3; }
  .voz-trabalho .voz-estudio-pedido > .voz-estudio-anexos:empty { display: none; }
}