.tss-map {
	width: 100%;
}

.tss-map-svg {
	display: block;
	width: 100%;
	height: auto;
}

.tss-map-svg path {
	stroke: #fff;
	stroke-width: 0.9;
	stroke-linejoin: round;
}

.tss-map-s0 {
	fill: #e9e6e1;
}

.tss-map-s1 {
	fill: #ecc5cb;
}

.tss-map-s2 {
	fill: #dd8f9b;
}

.tss-map-s3 {
	fill: #c4495d;
}

.tss-map-s4 {
	fill: #8f1223;
}

.tss-map-legend {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 16px;
	font-size: 13px;
	font-weight: 600;
	color: #575760;
}

.tss-map-ramp {
	display: inline-flex;
}

.tss-map-ramp i {
	display: block;
	width: 36px;
	height: 12px;
}

.tss-map-ramp i:first-child {
	border-radius: 6px 0 0 6px;
}

.tss-map-ramp i:last-child {
	border-radius: 0 6px 6px 0;
}

.tss-map-ramp .tss-map-s1 {
	background: #ecc5cb;
}

.tss-map-ramp .tss-map-s2 {
	background: #dd8f9b;
}

.tss-map-ramp .tss-map-s3 {
	background: #c4495d;
}

.tss-map-ramp .tss-map-s4 {
	background: #8f1223;
}
