.map-pin {
	path {
		fill: red;
		stroke: black;
		stroke-width: 1px;
		vector-effect: non-scaling-stroke;
	}
	> a .zelda-icon {
		height: 1em;
		width: 1em;
	}
}

.map-popover {
	position: absolute;
	width: 40vw;
	min-width: 20em;

	&.hidden {
		display: none;
	}

	.tech-title-icons {
		margin-right: 1ex;
	}
}

.pin-list {
	margin: 1em 0;
	padding: 0;
	list-style: none;

	li {
		margin: 1ex 0;
		padding: 1ex;
		border-top: thin solid silver;
	}

	h2 > a, h3 > a {
		text-decoration: none;
	}
}

.uw-super-tiles {
	display: grid;
	height: 100%;
	grid-template-columns: repeat(16, 1fr);

	> div {
		position: relative;
		border: thin solid black;
		padding: .25ex;

		&.dark {
			border: medium solid black;
		}
		&.kick {
			border: medium solid yellow;
		}
		&.weak-eg {
			border: medium solid orange;
		}
		&.strong-eg {
			border: medium solid green;
		}

		&::before,
		&::after {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			pointer-events: none;
		}

		&.cam-x::before {
			content: '';
			height: 50%;
			border-bottom: thin solid cyan;
		}
		&.cam-xl::before {
			content: '';
			position: absolute;
			width: 50%;
			height: 50%;
			border-bottom: thin solid cyan;
		}
		&.cam-xr::before {
			content: '';
			position: absolute;
			left: 50%;
			width: 50%;
			height: 50%;
			border-bottom: thin solid cyan;
		}
		&.cam-y::after {
			content: '';
			position: absolute;
			width: 50%;
			border-right: thin solid cyan;
		}
		&.cam-yu::after {
			content: '';
			position: absolute;
			width: 50%;
			height: 50%;
			border-right: thin solid cyan;
		}
		&.cam-yd::after {
			content: '';
			position: absolute;
			top: 50%;
			width: 50%;
			height: 50%;
			border-right: thin solid cyan;
		}
	}

	.cell-id,
	.cell-drop {
		margin: 0;
		line-height: 1;
	}
	.cell-drop {
		font-size: 80%;
	}
	.cell-link {
		color: inherit;
		cursor: pointer;
		text-decoration: none;
	}
}