/* ============================================================================ CAMADA UNICA DE OVERLAY / MODAL (BUG 2 + FASE 2) Ver src/ui/overlay-layer.js para o porque. Resumo: painel que precisa aparecer por cima da HUD nao briga mais por z-index dentro da arena -- ele e movido para esta camada, que e filha direta do . A camada em si nao intercepta clique (pointer-events:none); so os paineis que estao dentro dela interceptam. Assim o jogo continua clicavel em volta. ========================================================================== */ .ui-overlay-layer{ position:fixed; inset:0; /* Mapa de camadas do jogo (do fundo para a frente): HUD da batalha ......... ate ~80 CAMADA DE OVERLAY ...... 500 <- aqui menu principal ......... 900 modais de tela cheia ... 1000-1100 toasts ................. 2000-2100 FX de loot ............. 4500 tooltip ................ 5000 Editor Visual .......... 99998+ Ou seja: o painel fica acima de TODA a HUD, mas continua sendo coberto por modal, toast e tooltip -- que e o comportamento correto. */ z-index:500; pointer-events:none; } .ui-overlay-layer > *{ pointer-events:auto; } /* Painel montado na camada: a posicao vem do JS (left/top em px, ja limitados a tela). O z-index interno dele deixa de importar -- a camada ja resolve. */ .ui-overlay-mounted{ position:fixed!important; margin:0!important; /* Fora da arena o painel volta ao tamanho natural; em tela pequena ele pode ficar mais alto que a viewport, entao rola por dentro em vez de vazar. */ max-height:calc(100dvh - 16px); max-width:calc(100vw - 16px); overflow:auto; overscroll-behavior:contain; } /* O Editor Visual precisa continuar enxergando e agarrando os paineis montados. */ body.col-editor-active .ui-overlay-layer{ pointer-events:none; } body.col-editor-active .ui-overlay-layer > *{ pointer-events:auto; } /* A camada nunca deve capturar o cursor quando esta vazia. */ .ui-overlay-layer:empty{ display:none; }