@font-face {
  font-family: PublicPixel;
  src: url(../ttf/public_pixel.ttf);
}

.label_score {
	text-align: left;
	z-index: 3;
	pointer-events: none;
}

.label_level {
	text-align: right;
	z-index: 3;
	pointer-events: none;
}

.label_dialog {
	text-align: left;
	z-index: 5;
	pointer-events: none;
}

.label {
	position: absolute;
	overflow: hidden;

	font-family: PublicPixel;
	font-weight: bold;
	font-size: 4px;

	color: #ffffff;
	line-height: 1;
	white-space: pre-wrap;
}

.effect {
	position: absolute;
	overflow: hidden;

	image-rendering: pixelated;
	image-rendering: crisp-edges;

	z-index: 3;
	pointer-events: none;
}

.item {
	position: absolute;
	overflow: hidden;

	image-rendering: pixelated;
	image-rendering: crisp-edges;

	z-index: 2;
	pointer-events: none;
}

.indicator {
	position: absolute;
	overflow: hidden;

	image-rendering: pixelated;
	image-rendering: crisp-edges;

	z-index: 3;
	pointer-events: none;
}

.scene {
	position: absolute;
	overflow: hidden;

	image-rendering: pixelated;
	image-rendering: crisp-edges;

	z-index: 0;
	pointer-events: none;
}

.background {
	position: absolute;
	overflow: hidden;

	image-rendering: pixelated;
	image-rendering: crisp-edges;

	z-index: 0;
	pointer-events: none;
}

.foreground {
	position: absolute;
	overflow: hidden;

	image-rendering: pixelated;
	image-rendering: crisp-edges;

	z-index: 4;
	pointer-events: none;
}

.dialog {
	position: absolute;
	overflow: hidden;

	image-rendering: pixelated;
	image-rendering: crisp-edges;

	z-index: 4;
	pointer-events: none;
}

.game {
	position: absolute;
	overflow: hidden;

	image-rendering: pixelated;
	image-rendering: crisp-edges;

	z-index: 1;
	pointer-events: none;
}

.canvas {
	position: absolute;
	overflow: hidden;

	image-rendering: pixelated;
	image-rendering: crisp-edges;

	z-index: 0;
	pointer-events: none;
}

.title {
	position: absolute;
	overflow: hidden;

	image-rendering: pixelated;
	image-rendering: crisp-edges;

	z-index: 4;
	pointer-events: all;
}
