html{
	font-family: sans-serif;
	height:100%;
	display:flex;
	justify-content: center;
	background:black;
	touch-action: none;
	user-select: none;
	-webkit-user-select: none;
}

.pixelart{
	font-size:calc(100vw/135);
	width:135em;
	height:320em;
	image-rendering: pixelated;
	overflow:hidden;
	position:relative;
	display:block;
    top: 50%;
    transform: translateY(-50%);
}

.no_pixelart{
	font-size:1rem;
	image-rendering: auto;
}

@media screen and (orientation:landscape) {
}

body{
	overflow: hidden;
	width:100%;
	position:relative;
	margin:0;
}

button{
	cursor:pointer;
	border:none;
	padding: 1rem;
	width: 90%;
	margin: 1rem auto;
	font-size: 1rem;
	display: block;
}

@media screen and (orientation:landscape) {
	html{
		font-size:2.5vh;
	}
	
	.pixelart{
		font-size:calc(100vh/240);
	}
	
	body{
		height: 100%;
		width: auto;
		aspect-ratio:9/16;
		margin:auto;
	}
}

escenas-juego > *{
	position:absolute;
	inset:0;
	height:100%;
	flex-direction:column;
	justify-content: center;
	display:flex;
	pointer-events:none;
	opacity:0;
	transition: opacity 0.5s;
	
	background-repeat: no-repeat;
	background-posicion: center;
	background-size:100% 100%;
	
	&[escena-actual]{
		pointer-events:auto;
		opacity:1;
	}
}