/* A demonstração acompanha o topo real do editor: a identidade pertence à
   conversa e todos os controles da prévia dividem uma única barra. */
body.odim-landing-produto .movie-editor .movie-header {
  display: grid;
  grid-template-columns: 33% minmax(0, 1fr);
  height: 5.1cqw;
  gap: 0;
  padding: 0;
  border: 0;
}
body.odim-landing-produto .movie-editor .movie-header-left {
  height: 100%;
  padding: 0 1.1cqw;
  gap: .7cqw;
  border-right: 1px solid var(--borda);
}
body.odim-landing-produto .movie-editor .movie-brand {
  display: inline-flex;
  align-items: center;
  flex: none;
  gap: .65cqw;
  padding-right: .85cqw;
  border-right: 0;
  color: var(--texto);
}
body.odim-landing-produto .movie-editor .movie-brand img { width: 2.6cqw; height: 2.6cqw; flex: none; }
body.odim-landing-produto .movie-editor .movie-brand b { font: 800 1.65cqw/1 var(--fonte-titulo); letter-spacing: .02em; }
body.odim-landing-produto .movie-editor .movie-header-left > strong { flex: 1; }
body.odim-landing-produto .movie-editor .movie-view-group .movie-chat-toggle { margin: 0; width: 2.2cqw; padding: 0; justify-content: center; }
body.odim-landing-produto .movie-editor .movie-header-right {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  height: 100%;
  padding: 0 1.05cqw;
  gap: .6cqw;
  border-bottom: 1px solid var(--borda);
  font-size: .84cqw;
  white-space: nowrap;
}
body.odim-landing-produto .movie-editor .movie-header-right svg { width: 1.25cqw; height: 1.25cqw; }
/* Os lados têm a mesma largura para a página permanecer no centro da prévia,
   mesmo quando o idioma muda o tamanho das ações. */
body.odim-landing-produto .movie-editor .movie-page-center {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}
body.odim-landing-produto .movie-editor .movie-page {
  min-width: 0;
  width: 11.2cqw;
  flex: none;
  gap: .45cqw;
  min-height: 2.8cqw;
  padding: .35cqw .55cqw;
}
body.odim-landing-produto .movie-editor .movie-page > span { overflow: hidden; text-overflow: ellipsis; }
body.odim-landing-produto .movie-editor .movie-page > svg:last-child { width: .85cqw; }
body.odim-landing-produto .movie-editor .movie-fullscreen {
  position: absolute;
  left: calc(100% + .3cqw);
  top: 50%;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  width: 2.2cqw;
  height: 2.8cqw;
  color: var(--texto-2);
}
body.odim-landing-produto .movie-editor .movie-view-group {
  display: flex;
  justify-self: start;
  align-items: center;
  flex: none;
  gap: .15cqw;
  padding: .25cqw;
  border: 1px solid var(--borda);
  border-radius: 999px;
  background: var(--fundo-sutil);
}
body.odim-landing-produto .movie-editor .movie-view {
  min-height: 2.2cqw;
  padding: .3cqw .55cqw;
  gap: .3cqw;
  border: 0;
  border-radius: 999px;
  font-weight: 500;
  color: var(--texto-2);
}
body.odim-landing-produto .movie-editor .movie-view.is-active { background: var(--odim-energia-suave); color: var(--energia-texto); }
body.odim-landing-produto .movie-editor .movie-toolbar-actions { display: flex; align-items: center; justify-content: flex-end; min-width: 0; gap: .6cqw; }
body.odim-landing-produto .movie-editor .movie-preview-tools { gap: .4cqw; margin-left: 0; flex: none; }
body.odim-landing-produto .movie-editor .movie-devices { display: flex; gap: .05cqw; border-left: 1px solid var(--borda); padding-left: .5cqw; }
body.odim-landing-produto .movie-editor .movie-device { min-height: 2.5cqw; width: 2.05cqw; justify-content: center; padding: .25cqw; }
body.odim-landing-produto .movie-editor .movie-device.is-active { border-color: transparent; background: var(--fundo-ativo); }
body.odim-landing-produto .movie-editor .movie-reload { display: grid; place-items: center; width: 1.8cqw; }
body.odim-landing-produto .movie-editor .movie-edit { min-height: 2.8cqw; padding: .35cqw .55cqw; }
body.odim-landing-produto .movie-editor .movie-publish-group { display: flex; align-items: center; gap: .6cqw; flex: none; }
body.odim-landing-produto .movie-editor .movie-publish { min-height: 2.8cqw; padding: .4cqw .65cqw; font-weight: 600; }
body.odim-landing-produto .movie-editor .movie-body { height: calc(100% - 5.1cqw); }
/* O histórico ocupa um controle no título, liberando a antiga linha de abas
   para as mensagens da conversa. */
body.odim-landing-produto .movie-editor .movie-chat-heading { display: flex; justify-content: space-between; gap: .8cqw; align-items: center; min-height: 3.8cqw; padding: .5cqw 1.1cqw; }
body.odim-landing-produto .movie-editor .movie-chat-heading > strong { min-width: 0; font-size: 1cqw; }
body.odim-landing-produto .movie-editor .movie-history { display: grid; place-items: center; flex: none; width: 2.8cqw; height: 2.8cqw; border-radius: .6cqw; background: transparent; color: var(--texto-3); }
body.odim-landing-produto .movie-editor .movie-history svg { width: 1.7cqw; height: 1.7cqw; }
body.odim-landing-produto .movie-editor .movie-preview { padding: .9cqw; }
body.odim-landing-produto .movie-editor .movie-site-frame { box-shadow: none; background: var(--fundo-elevado); }
body.odim-landing-produto .movie-editor .movie-composer { border-radius: 1.05cqw; margin-bottom: 1.05cqw; }
body.odim-landing-produto .movie-editor .movie-composer-tools { gap: .6cqw; }
/* O ponto de entrada de anexos fica sozinho; as ações de envio formam um
   grupo à direita, como no compositor real. */
body.odim-landing-produto .movie-editor .movie-add { display: grid; place-items: center; flex: none; width: 2.5cqw; height: 2.5cqw; border: 1px solid var(--borda); border-radius: 50%; color: var(--texto-2); background: var(--fundo-elevado); }
body.odim-landing-produto .movie-editor .movie-add svg { width: 1.5cqw; height: 1.5cqw; }
body.odim-landing-produto .movie-editor .movie-composer-actions { display: flex; align-items: center; gap: .6cqw; margin-left: auto; }
body.odim-landing-produto .movie-editor .movie-mic { display: grid; place-items: center; width: 2.5cqw; height: 2.5cqw; border-radius: .65cqw; margin-left: 0; color: var(--texto-2); background: var(--fundo-sutil); }
body.odim-landing-produto .movie-editor .movie-send { margin-left: 0; }
/* O site de arquitetura usa uma foto ampla e composição editorial. A camada
   clara mantém a leitura à esquerda e deixa a arquitetura em destaque. */
body.odim-landing-produto .movie-editor .movie-site-nav { padding: 1.55cqw 2.4cqw; min-height: 5cqw; background: var(--fundo-elevado); }
body.odim-landing-produto .movie-editor .movie-site-nav > strong { font-weight: 800; font-size: 1.45cqw; letter-spacing: .16em; }
body.odim-landing-produto .movie-editor .movie-site-nav > div { gap: 1.7cqw; font-size: .82cqw; }
body.odim-landing-produto .movie-editor .movie-site-hero { position: relative; display: flex; align-items: center; isolation: isolate; min-height: 31cqw; padding: 2.6cqw 2.4cqw; }
body.odim-landing-produto .movie-editor .movie-site-photo { position: absolute; inset: 0; z-index: -1; height: auto; border-radius: 0; }
body.odim-landing-produto .movie-editor .movie-site-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, var(--fundo-elevado) 0%, color-mix(in srgb, var(--fundo-elevado) 96%, transparent) 24%, color-mix(in srgb, var(--fundo-elevado) 76%, transparent) 44%, transparent 65%); }
body.odim-landing-produto .movie-editor .movie-site-photo img { object-position: 70% center; }
body.odim-landing-produto .movie-editor .movie-site-copy { width: 27cqw; min-width: 0; }
body.odim-landing-produto .movie-editor .movie-site-copy small { color: var(--texto-2); font-size: .66cqw; font-weight: 600; letter-spacing: .15em; }
body.odim-landing-produto .movie-editor .movie-site-copy h3 { min-height: 3.15em; margin-bottom: 1.2cqw; font: 800 4cqw/1.05 var(--fonte-titulo); letter-spacing: -.055em; text-wrap: balance; }
body.odim-landing-produto .movie-editor .movie-site-copy > p { max-width: 24cqw; margin-bottom: 1.7cqw; color: var(--texto-2); font-size: .95cqw; line-height: 1.7; }
body.odim-landing-produto .movie-editor .movie-site-cta { gap: .7cqw; padding: .85cqw 1.2cqw; min-height: 3.3cqw; border-radius: .3cqw; font-weight: 600; background: var(--texto); }
body.odim-landing-produto .movie-editor .movie-site-cta::after { content: '↗'; font-size: 1.15cqw; }
body.odim-landing-produto .movie-editor .movie-site-sections { min-height: 5.6cqw; margin: 0; padding: 1.6cqw 2.4cqw; border-top: 0; background: var(--fundo-elevado); gap: 1.5cqw; }
body.odim-landing-produto .movie-editor .movie-site-sections > span { align-items: flex-start; flex-direction: column; gap: .45cqw; }
body.odim-landing-produto .movie-editor .movie-site-sections i { color: var(--texto-3); font-size: .7cqw; }
body.odim-landing-produto .movie-editor .movie-publication-state { display: inline-flex; align-items: center; gap: .35cqw; color: var(--texto-3); font-size: .7cqw; }
body.odim-landing-produto .movie-editor .movie-publication-state::before { content: ''; width: .45cqw; height: .45cqw; border-radius: 50%; background: var(--texto-3); }
/* A vitrine é uma miniatura do editor. No topo compacto, o estado usa o
   ponto para reservar o espaço de tela cheia ao lado da página central. */
@container (max-width: 1100px) {
  body.odim-landing-produto .movie-editor .movie-publication-state > span { display: none; }
}
body.odim-landing-produto .movie-editor .movie-empty { z-index: 1; padding: 3cqw; text-align: center; background: var(--fundo-elevado); }
body.odim-landing-produto .movie-editor .movie-empty small { font-size: .8cqw; letter-spacing: .12em; text-transform: uppercase; }
body.odim-landing-produto .movie-editor .movie-empty p { max-width: 31cqw; font-size: 1.05cqw; }
body.odim-landing-produto .movie-editor .movie-loading-progress { display: block; width: 14cqw; height: .35cqw; margin-top: 1.2cqw; border-radius: 999px; overflow: hidden; background: var(--borda); }
body.odim-landing-produto .movie-editor .movie-loading-progress i { display: block; height: 100%; background: var(--acao); transform: scaleX(var(--site-reveal, 0)); transform-origin: left; }
body.odim-landing-produto .movie-editor[data-motion-ready] .movie-site { opacity: var(--site-delivery, 1); }
body.odim-landing-produto .movie-editor[data-phase="writing"] .movie-empty { opacity: 0; }
body.odim-landing-produto .movie-editor[data-phase="building"] .movie-empty { opacity: 1; }
body.odim-landing-produto .movie-editor .movie-send .movie-stop-icon { display: none; }
body.odim-landing-produto .movie-editor:is([data-phase="building"], [data-phase="applying"]) .movie-send .movie-send-icon { display: none; }
body.odim-landing-produto .movie-editor:is([data-phase="building"], [data-phase="applying"]) .movie-send .movie-stop-icon { display: block; visibility: visible; }
body.odim-landing-produto .movie-editor:is([data-phase="building"], [data-phase="applying"]) .movie-send::after { content: none; }
body.odim-landing-produto .movie-editor .movie-mobile-header, body.odim-landing-produto .movie-editor .movie-mobile-toolbar { display: none; }
/* A confirmação só aparece quando a primeira versão já está visível. */
body.odim-landing-produto .movie-editor[data-phase="building"] .movie-done { display: none; }
@media (max-width: 600px) {
  /* A demonstração também acompanha o editor no celular: conversa e prévia
     usam a tela inteira, em vez de duas colunas ilegíveis espremidas. */
  body.odim-landing-produto .movie-editor .movie-window { height: 528px; min-height: 528px; aspect-ratio: auto; max-height: none; }
  body.odim-landing-produto .movie-editor .movie-header { display: none; }
  body.odim-landing-produto .movie-editor .movie-mobile-header { display: block; height: 84px; border-bottom: 1px solid var(--borda); background: var(--fundo-elevado); }
  body.odim-landing-produto .movie-editor .movie-mobile-identity { height: 48px; display: flex; align-items: center; gap: var(--e-2); padding-inline: var(--e-3); font-size: 13px; }
  body.odim-landing-produto .movie-editor .movie-mobile-identity img { width: 24px; height: 24px; }
  body.odim-landing-produto .movie-editor .movie-mobile-identity > strong { flex: 1; min-width: 0; }
  body.odim-landing-produto .movie-editor .movie-mobile-identity svg { width: 16px; height: 16px; }
  body.odim-landing-produto .movie-editor .movie-mobile-more { padding: var(--e-2); }
  body.odim-landing-produto .movie-editor .movie-mobile-identity .movie-publish { min-height: 32px; padding: var(--e-2); font-size: 11px; }
  body.odim-landing-produto .movie-editor .movie-mobile-tabs { display: flex; align-items: stretch; height: 36px; padding-inline: var(--e-3); gap: var(--e-5); font-size: 12px; color: var(--texto-3); }
  body.odim-landing-produto .movie-editor .movie-mobile-tabs > span { display: flex; align-items: center; border-bottom: 2px solid transparent; }
  body.odim-landing-produto .movie-editor:not([data-phase="created"]):not([data-phase="complete"]) .movie-mobile-chat-tab, body.odim-landing-produto .movie-editor:is([data-phase="created"], [data-phase="complete"]) .movie-mobile-preview-tab { color: var(--energia-texto); border-bottom-color: var(--acao); }
  body.odim-landing-produto .movie-editor .movie-body { display: block; height: calc(100% - 84px); }
  body.odim-landing-produto .movie-editor .movie-chat { height: 100%; border: 0; }
  body.odim-landing-produto .movie-editor .movie-chat-heading { display: none; }
  body.odim-landing-produto .movie-editor .movie-messages { padding: var(--e-5) var(--e-3); }
  body.odim-landing-produto .movie-editor .movie-user { margin: 0 0 var(--e-5) var(--e-8); padding: var(--e-3); font-size: 13px; border-radius: var(--raio); }
  body.odim-landing-produto .movie-editor .movie-assistant { gap: var(--e-2); margin-bottom: var(--e-5); }
  body.odim-landing-produto .movie-editor .movie-assistant > img { width: 20px; height: 20px; }
  body.odim-landing-produto .movie-editor .movie-assistant p { font-size: 12px; }
  body.odim-landing-produto .movie-editor .movie-done svg { width: 12px; height: 12px; }
  body.odim-landing-produto .movie-editor .movie-composer { margin: 0 var(--e-3) var(--e-3); padding: var(--e-3); border-radius: var(--raio); }
  body.odim-landing-produto .movie-editor .movie-composer-text { min-height: 72px; font-size: 13px; }
  body.odim-landing-produto .movie-editor .movie-composer-tools, body.odim-landing-produto .movie-editor .movie-composer-actions { gap: var(--e-2); }
  body.odim-landing-produto .movie-editor .movie-add, body.odim-landing-produto .movie-editor .movie-mic, body.odim-landing-produto .movie-editor .movie-send { width: 32px; height: 32px; border-radius: var(--raio-p); }
  body.odim-landing-produto .movie-editor .movie-add { border-radius: 50%; }
  body.odim-landing-produto .movie-editor .movie-plan { padding: var(--e-1) var(--e-2); font-size: 11px; gap: var(--e-1); border-radius: 999px; }
  body.odim-landing-produto .movie-editor .movie-composer svg { width: 18px; height: 18px; }
  body.odim-landing-produto .movie-editor .movie-preview { display: none; height: 100%; padding: 0; }
  body.odim-landing-produto .movie-editor:is([data-phase="created"], [data-phase="complete"]) .movie-chat { display: none; }
  body.odim-landing-produto .movie-editor:is([data-phase="created"], [data-phase="complete"]) .movie-preview { display: flex; }
  body.odim-landing-produto .movie-editor .movie-mobile-toolbar { flex: none; display: flex; align-items: center; justify-content: center; gap: var(--e-3); height: 42px; padding-inline: var(--e-3); border-bottom: 1px solid var(--borda); }
  body.odim-landing-produto .movie-editor .movie-mobile-toolbar .movie-page { width: 150px; min-height: 30px; font-size: 11px; padding: var(--e-1) var(--e-2); border-radius: var(--raio-p); gap: var(--e-1); }
  body.odim-landing-produto .movie-editor .movie-mobile-toolbar svg { width: 14px; height: 14px; }
  body.odim-landing-produto .movie-editor .movie-site-frame { border: 0; border-radius: 0; }
  body.odim-landing-produto .movie-editor .movie-site-nav { min-height: 42px; padding: var(--e-3) var(--e-4); }
  body.odim-landing-produto .movie-editor .movie-site-nav > strong { font-size: 14px; }
  body.odim-landing-produto .movie-editor .movie-site-nav > div { font-size: 8px; gap: var(--e-2); }
  body.odim-landing-produto .movie-editor .movie-site-hero { min-height: 302px; padding: var(--e-5) var(--e-4); }
  body.odim-landing-produto .movie-editor .movie-site-copy { width: 55%; }
  body.odim-landing-produto .movie-editor .movie-site-copy small { font-size: 7px; margin-bottom: var(--e-3); }
  body.odim-landing-produto .movie-editor .movie-site-copy h3 { min-height: 3.3em; font-size: clamp(23px, 7vw, 28px); margin-bottom: var(--e-3); }
  body.odim-landing-produto .movie-editor .movie-site-copy > p { max-width: none; font-size: 10px; margin-bottom: var(--e-3); }
  body.odim-landing-produto .movie-editor .movie-site-cta { min-height: 30px; padding: var(--e-2); border-radius: var(--e-1); font-size: 8px; }
  body.odim-landing-produto .movie-editor .movie-site-cta::after { font-size: 12px; }
  body.odim-landing-produto .movie-editor .movie-site-sections { min-height: 52px; padding: var(--e-2) var(--e-4); font-size: 8px; gap: var(--e-2); }
  body.odim-landing-produto .movie-editor .movie-site-sections i { font-size: 7px; }
  body.odim-landing-produto .movie-editor .motion-cursor { display: none; }
}