/* Figma 1167:6541 uses a 750px / 2 mobile artboard: 12px type, 8px row gap, 4px dots. */
.tooto-worldwide-map__nav {
	--tooto-map-mobile-gap: min(var(--tooto-map-nav-gap), max(12px, calc((100vw - 269px) / 2)));
	max-inline-size: calc(221px + 2 * var(--tooto-map-nav-gap));
	margin-inline: auto;
	flex-wrap: wrap-reverse;
	gap: 8px var(--tooto-map-mobile-gap);
}
.tooto-worldwide-map .tooto-worldwide-map__button {
	min-height: 18px;
	padding: 0;
}
/* Extend the hit target to 24px without changing the compact 18px text line. */
.tooto-worldwide-map__button::after { content: ''; position: absolute; inset: -3px 0; }
.tooto-worldwide-map__button + .tooto-worldwide-map__button::before {
	content: '';
	display: block;
	width: 4px;
	height: 4px;
	top: calc(50% - 2px);
	inset-inline-start: calc(-1 * var(--tooto-map-mobile-gap) / 2 - 2px);
	background: var(--tooto-map-separator);
	mask: url('../svg/worldwide-map/nav-separator.svg') center / 4px 4px no-repeat;
}
/* The saved five-region layout wraps the final two labels above the first three. */
.tooto-worldwide-map__nav:has(> .tooto-worldwide-map__button:nth-child(5):last-child) > .tooto-worldwide-map__button:nth-child(4)::before { display: none; }