escenas-juego{
	&> paisaje-montañoso{
		background-image:url('img/paisaje.png');
	}
	
	primer-ingrediente{
		background-size:100% 100%;
		position:absolute;
		inset:0;
		
		&[data-ingrediente="maracuya"]{
				background-image:url("img/maracuya.png");
		}
		
		&[data-ingrediente="algodon de azucar"]{
				background-image:url("img/algodon de azucar.png");
		}
		
		&[data-ingrediente="dulce de leche"]{
				background-image:url("img/dulce de leche.png");
		}
	}
	
	segundo-ingrediente{
		background-size:100% 100%;
		position:absolute;
		inset:0;
		
		&[data-ingrediente="coco"]{
				background-image:url("img/coco.png");
		}
		
		&[data-ingrediente="açai"]{
				background-image:url("img/açai.png");
		}
		
		&[data-ingrediente="arandanos"]{
				background-image:url("img/arandanos.png");
		}
	}
	
	tercer-ingrediente{
		background-size:100% 100%;
		position:absolute;
		inset:0;
		
		&[data-ingrediente="fruta del dragon"]{
				background-image:url("img/fruta del dragon.png");
		}
		
		&[data-ingrediente="chocolate"]{
				background-image:url("img/chocolate.png");
		}
		
		&[data-ingrediente="fresa"]{
				background-image:url("img/fresa.png");
		}
	}
}

diálogo-personajes{
	
	&[data-personaje="Akemitsu Hoshino"] personaje-actual{
		background-image:url('img/Akemitsu Hoshino.png')
	}
	
	&[data-personaje="Juglar"] personaje-actual{
		background-image:url('img/juglar.png');
		filter: drop-shadow(0 0 1rem white);
	}
	
	opciones-diálogo button{
		background:white;
		color:black;
	}

	globo-frase{
		background:white;
		border:0.2em solid black;
		border-radius:1em;
		
		nombre-personaje{
			background:black;
			color:white;
			border-radius:10em;
		}
		
		button{
			background:black;
			color:white;
		}
	}
}

escenas-juego >	portada-juego{
	background:url(img/portada.jpg);
	background-size:100% 100%;
	
	h1{
		margin:auto 1rem;
		text-align:center;
		color:white;
		text-shadow: 0.2rem 0.2rem 0.2rem black;
		opacity:0;
		
		img{
			width: 70%;
            height: 20rem;
            object-fit: cover;
            object-position: 50% 30%;
			image-rendering: pixelated;
		}
	}

	button{
		width:70%;
		margin:auto;
	}
	
	lista-creadores{
		margin:auto;
		width:content-fit;
		opacity:0;
	}
}