html {
	height: 100%;
	overflow: auto;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	/* reserve scrollbar space */
}

body {
	font-family:
		"HanWang Kai Medium",
		"DFKai-SB",
		"GenWanMin TW",
		"Noto Serif TC",
		"Microsoft JhengHei",
		"PingFang TC",
		"Noto Sans TC",
		sans-serif;
	font-size: 18px;
	line-height: 2.5;
	letter-spacing: 0.05em;
	text-align: justify;
	color: #333;
	background-color: #faf8f2;
	letter-spacing: 0.05em;
	padding: 1em;
	text-orientation: mixed;
	/* or upright for full vertical feel */
	min-height: 100%;
	overflow: visible;
	/* prevent double scrollbars */
}

body.vertical {
	writing-mode: vertical-rl;
	text-orientation: mixed;
	min-inline-size: 100vh;
	min-inline-size: 100dvh;
	/* overrides if supported */
	padding: 1em;
	line-height: 2.5;
}

a:link {
	color: black;
	text-decoration: none;
	pointer-events: auto;
}

a:visited {
	color: black;
	background-color: yellow;
}

.text {
	line-height: 2.2;
	/* or 220% */
}


p {
	text-indent: 2em;
	margin-bottom: 1.5em;
}

th,
td,
p,
input {
	font: 15px 'Segoe UI';
	line-height: 2.2;
}

table,
th,
td {
	border: solid 1px #ddd;
	border-collapse: collapse;
	padding: 2px 3px;
	text-align: center;
}

th {
	font-weight: bold;
}

div {
	text-align: justify;
}

ruby {
	ruby-position: over;
	line-height: normal;
	padding: 0.2%;
}

rt {
	font-size: 0.6em;
	color: #555;
	font-family: 'Segoe UI', sans-serif;
	/* line-height: 1;
	margin-top: -0.2em;*/
}

@media print {
	body {
		writing-mode: vertical-rl;
		text-orientation: upright;
		min-inline-size: auto;
		line-height: 2.5;
		font-size: 18px;
		padding: 2em;
		background-color: white;
		color: black;
	}

	a {
		text-decoration: none;
		color: black;
	}

	button,
	nav,
	.non-printable {
		display: none !important;
	}
}