/* PORQUE EXISTE: zoom só no desktop. No telemóvel CSS zoom deixa buraco preto — mobile usa sempre 100% do ecrã. */ :root { --ui-zoom: 1; } .topo-linha { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; } .topo-acoes { display: flex; flex-direction: column; align-items: stretch; gap: 8px; } .topo-acoes .seletor-janela { flex: 1; min-width: 0; } /* Desktop: zoom no (como faz o zoom do browser). Assim o .ide preenche sempre 100% da largura, sem faixas pretas por compensação. */ @media (min-width: 821px) { html { zoom: var(--ui-zoom); } .ide { width: 100%; height: 100dvh; max-height: 100dvh; } @supports not (zoom: 1) { html { zoom: normal; } .ide { transform: scale(var(--ui-zoom)); transform-origin: top left; width: calc(100% / var(--ui-zoom)); height: calc(100dvh / var(--ui-zoom)); } } } .zoom-ctrl { display: inline-flex; align-items: center; gap: 2px; margin-left: 4px; padding: 2px; border-radius: 10px; background: color-mix(in srgb, var(--fundo-editor) 80%, transparent); border: 1px solid var(--borda); flex-shrink: 0; } .zoom-ctrl .btn-icone { width: 32px; height: 32px; font-size: 16px; font-weight: 700; line-height: 1; } .zoom-ctrl .btn-icone:disabled { opacity: 0.35; cursor: default; } .zoom-label { min-width: 38px; text-align: center; font-size: 11px; font-variant-numeric: tabular-nums; color: var(--texto-fraco); user-select: none; } .app-versao { font-size: 10px; color: var(--texto-apagado); font-variant-numeric: tabular-nums; letter-spacing: 0.04em; } @media (max-width: 820px) { html { zoom: 1 !important; } html, body { width: 100% !important; max-width: 100% !important; height: 100% !important; margin: 0 !important; overflow: hidden !important; background: var(--fundo-app, #212121); } body { position: fixed; inset: 0; width: 100vw !important; height: var(--vh, 100dvh) !important; } .ide { zoom: 1 !important; transform: none !important; translate: none !important; width: 100% !important; max-width: 100% !important; height: 100% !important; max-height: 100% !important; min-height: 0 !important; } /* Zoom no telemóvel só via Aparência (densidade de texto), não aqui */ .rodape-topo .zoom-ctrl { display: none !important; } }