body { font-family: 'Noto Sans TC', Arial, sans-serif; background: #f7f7f7; margin: 0; padding: 0; }
h1 { text-align: center; margin: 24px 0 12px 0; color: #222; }
table { margin: 0 auto 40px auto; border-collapse: collapse; background: #fff; box-shadow: 0 2px 8px #0001; }
th, td { border: 1px solid #ddd; padding: 8px 12px; text-align: center; }
th, td {
	border: 1px solid #ddd;
	padding: 8px 12px;
	text-align: center;
	min-height: 40px;
	height: 40px;
	vertical-align: middle;
}
th { background: #2d7dd2; color: #fff; }
tr:nth-child(even) { background: #f2f8fc; }
tr:hover { background: #e3f0fa; }
.status-finished { color: #388e3c; font-weight: bold; }
.status-postponed { color: #d32f2f; font-weight: bold; }
.status-playing { color: #fbc02d; font-weight: bold; }
@media (max-width: 800px) {
	table, thead, tbody, th, td, tr { display: block; }
	th { position: sticky; top: 0; }
	td { border: none; border-bottom: 1px solid #eee; }
}