.language-switcher {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 0.6em;
	margin: 0 0 1.1em 0;
}

	.language-switcher a {
		border: 0;
		border-radius: 999px;
		padding: 0.35em 0.9em;
		background: rgba(255, 255, 255, 0.08);
		color: rgba(255, 255, 255, 0.72);
		font-size: 0.75em;
		font-weight: 700;
		letter-spacing: 0.1em;
		text-decoration: none;
		text-transform: uppercase;
		transition: background 0.2s ease, color 0.2s ease;
	}

	.language-switcher a:hover,
	.language-switcher a[aria-current="page"] {
		background: rgba(255, 255, 255, 0.18);
		color: #ffffff;
	}

html[lang="th"] body,
html[lang="th"] input,
html[lang="th"] textarea,
html[lang="th"] select,
html[lang="zh-CN"] body,
html[lang="zh-CN"] input,
html[lang="zh-CN"] textarea,
html[lang="zh-CN"] select {
	font-family: "Source Sans Pro", "Sukhumvit Set", "Thonburi", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Helvetica, sans-serif;
}

html[lang="th"] #doc,
html[lang="zh-CN"] #doc {
	font-family: "Source Sans Pro", "Sukhumvit Set", "Thonburi", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Helvetica, sans-serif;
}

@media screen and (max-width: 736px) {

	#nav {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		gap: 0.3em 0.45em;
		height: auto;
		max-width: 22em;
		margin: 0 auto;
		padding: 0 0 1em 0;
	}

		#nav a {
			width: 1.25em;
			height: 1.1em;
			line-height: 1;
			font-size: 2em;
			margin: 0;
		}

		#nav a:after {
			bottom: -0.55em;
		}

	.language-switcher {
		margin-bottom: 0.9em;
	}
}