#design-viewport {display:contents}
/* Un único lienzo lógico: todas las medidas y consultas usan la misma base. */
:root {--design-width:1440px;--design-height:1080px;--design-vw:14.4px;--design-vh:10.8px;--design-vmin:10.8px;--design-vmax:14.4px;--interface-scale:1}
html[data-global-scale="true"],html[data-global-scale="true"] body {width:100%;height:100%;min-width:0;min-height:0;margin:0;overflow:clip}
html[data-global-scale="true"] #design-viewport {display:block;position:fixed;left:50%;top:50%;width:var(--design-width);height:var(--design-height);container:global-design / size;visibility:hidden;transform-origin:center;transform:translate(-50%,-50%) scale(var(--interface-scale))}
html[data-global-scale="true"] #design-viewport > .app-frame {width:100%;height:100%;min-height:0}

html[data-global-scale="true"] #design-viewport {visibility:visible}
/* El fullscreen solicitado explícitamente utiliza el viewport nativo del navegador. */
.game-card:fullscreen {width:100vw!important;height:100dvh!important}

/* Reserva lógica fija para que los scrollbars superpuestos del móvil no cambien las casillas. */
html[data-global-scale="true"] #design-viewport .pw04-inventory-grid {grid-template-columns:repeat(var(--inventory-columns),var(--inventory-cell));scrollbar-gutter:auto}
html[data-global-scale="true"] #design-viewport .pw04-inventory-grid::-webkit-scrollbar {width:16px}


/* PERRILAND en ventana: viewport nativo, fuera del lienzo escalado de la web.
   Estas medidas no pasan por el generador de unidades del diseño fijo. */
body.perriland-windowed #overlay-layer {
 position:fixed;inset:0;z-index:10000;width:100%;height:100dvh;
 display:grid;place-items:center;padding:12px;isolation:isolate
}
body.perriland-windowed #overlay-layer > .modal-backdrop {
 backdrop-filter:none;-webkit-backdrop-filter:none;background:#090605df
}
body.perriland-windowed #overlay-layer > .game-card:not(:fullscreen) {
 width:min(1300px,96vw);height:min(1000px,94dvh);max-width:none;max-height:94dvh;
 display:flex;flex-direction:column;min-height:0;overflow:hidden
}
body.perriland-windowed #overlay-layer > .game-card:not(:fullscreen) > .original-game {
 flex:1 1 0%;width:100%;height:100%;min-height:0;max-height:none;aspect-ratio:auto
}