/* O AMPLIAR COM ZOOM E TELA CHEIA — as regras da peça `ampliar-foto.js` (item 329).

   Moravam no <style> do painel (PR #183). Vieram para cá quando a revisão das sugestões da
   IA, no Analisar (`/3d/`, outra página), passou a usar a mesma peça: as duas páginas
   carregam ESTE arquivo, e uma correção chega às duas.

   As cores têm o valor de reserva escrito na própria variável: o visualizador não declara
   todos os tokens do painel, e uma variável indefinida apaga a regra em silêncio (a lição
   da casca.css, que usava 22 variáveis e declarava 2). */

/* A evidência grande, por cima da tela: quem revisa não sai dela. Com zoom e tela cheia
   desde 23/10/2026 — o palco ocupa o que sobra da barra, a imagem anda por transform
   (a conta é do `ampliar-foto.js`) e a transição só existe no clique, nunca no arrasto nem na roda. */
.rev-zoom { position: fixed; inset: 0; z-index: 90; background: rgba(10,16,28,.86);
            display: flex; flex-direction: column; padding: 56px 24px 16px; gap: 10px; }
.rev-zoom.cheia { background: #0a101c; padding: 56px 12px 12px; }
.rev-zoom-palco { position: relative; flex: 1; min-height: 0; overflow: hidden;
                  border-radius: 6px; background: #0f1626; touch-action: none; }
.rev-zoom-palco.pode-arrastar { cursor: grab; }
.rev-zoom-palco.arrastando { cursor: grabbing; }
.rev-zoom-img { position: absolute; left: 0; top: 0; max-width: none; max-height: none;
                transform-origin: 0 0; user-select: none; -webkit-user-drag: none; }
.rev-zoom.suave .rev-zoom-img { transition: transform .14s ease-out; }
@media (prefers-reduced-motion: reduce) { .rev-zoom.suave .rev-zoom-img { transition: none; } }
.rev-zoom-barra { display: flex; align-items: center; gap: 8px; color: #fff; flex-wrap: wrap; }
.rev-zoom-titulo { font-size: 13px; font-weight: 600; min-width: 0; flex: 1 1 160px;
                   overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rev-zoom-dica { font-size: 12px; color: #c3cbd8; }
.rev-zoom-pct { font-size: 13px; min-width: 48px; text-align: center; font-variant-numeric: tabular-nums; }
.rev-zoom-bt { height: 32px; min-width: 32px; padding: 0 12px; border-radius: 6px; font: inherit;
               font-size: 13px; color: #fff; background: rgba(255,255,255,.1);
               border: 1px solid rgba(255,255,255,.24); cursor: pointer; }
.rev-zoom-bt:hover:not(:disabled) { background: rgba(255,255,255,.2); }
.rev-zoom-bt:disabled { opacity: .4; cursor: default; }
.rev-zoom-bt:focus-visible { outline: 2px solid var(--orange, #ff6501); outline-offset: 2px; }
.rev-zoom .x-fecha { position: absolute; top: 12px; right: 16px; }

/* O ✕ da peça, completo AQUI, e só dentro do ampliar: no painel o `.x-fecha` já existe, mas
   o visualizador não o tem — sem isto o botão de fechar saía como botão cru do navegador. */
.rev-zoom .x-fecha { width: 32px; height: 32px; padding: 0; border-radius: 50%;
                     display: inline-flex; align-items: center; justify-content: center;
                     border: 1px solid transparent; background: rgba(10,18,32,.5);
                     color: #fff; font-size: 20px; line-height: 1; cursor: pointer;
                     backdrop-filter: blur(4px); }
.rev-zoom .x-fecha:hover { background: rgba(10,18,32,.78); }