:root {
  color-scheme: light;
  font-family: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
  background: #f5f4f0;
  color: #252b31;
  line-height: 1.8;
}

* { box-sizing: border-box; }
body { max-width: 1140px; margin: 0 auto; padding: 56px 28px 96px; }
h1, h2 { line-height: 1.35; color: #213e52; }
h1 { font-size: clamp(2rem, 4vw, 3.15rem); margin: 0 0 26px; letter-spacing: .02em; }
h2 { font-size: clamp(1.4rem, 2.5vw, 1.9rem); margin: 60px 0 20px; padding-bottom: 12px; border-bottom: 2px solid #d8e3e7; }
p, li { max-width: 82ch; }
a { color: #176a83; text-decoration-thickness: 1px; text-underline-offset: 3px; overflow-wrap: anywhere; }
a:hover { color: #0b485d; }
strong { color: #253d50; }
blockquote { border-left: 4px solid #9bb7c2; padding: 2px 18px; margin-left: 0; }
table { border-collapse: collapse; width: 100%; font-size: .95rem; background: white; }
th, td { border-bottom: 1px solid #d8e3e7; padding: 12px 14px; text-align: left; vertical-align: top; }
th { color: #243e51; background: #e8f0f2; }
tbody tr:nth-child(even) { background: #f7fafb; }
table { display: block; overflow-x: auto; }
code { background: #e8ecee; padding: .12em .35em; border-radius: 3px; }
@media (max-width: 640px) {
  body { padding: 28px 16px 64px; }
  th, td { padding: 9px 10px; min-width: 110px; }
}