:root{
  --bg:#fdfcf9; --ink:#22201c; --ink-soft:#5c574e; --line:#e7e2d8;
  --accent:#a8722a; --accent-soft:#f6efe2; --mark:#b3541e;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#191713; --ink:#ece7dd; --ink-soft:#a89f8f;
    --line:#332f27; --accent:#d99a4e; --accent-soft:#2a2318; --mark:#d97742;
  }
}
:root[data-theme="dark"]{
  --bg:#191713; --ink:#ece7dd; --ink-soft:#a89f8f;
  --line:#332f27; --accent:#d99a4e; --accent-soft:#2a2318; --mark:#d97742;
}
*{box-sizing:border-box;margin:0}
body{
  background:var(--bg); color:var(--ink); font-size:17px; line-height:1.85;
  font-family:"Noto Sans TC",-apple-system,"PingFang TC","Microsoft JhengHei",sans-serif;
}
header.site{
  max-width:46rem; margin:0 auto; padding:1.6rem 1.25rem 0;
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
  flex-wrap:wrap;
}
.brand{font-family:"Noto Serif TC",serif; font-weight:700; letter-spacing:.04em;
  color:var(--ink); text-decoration:none}
.brand small{display:block; font-family:"Noto Sans TC",sans-serif; font-weight:400;
  font-size:.72rem; color:var(--ink-soft); letter-spacing:.18em; margin-top:.15rem}
nav.main{display:flex; gap:1.4rem; font-size:.92rem}
nav.main a{color:var(--ink-soft); text-decoration:none; padding:.2rem 0;
  border-bottom:2px solid transparent}
nav.main a:hover{color:var(--ink)}
nav.main a[aria-current="page"]{color:var(--accent); border-bottom-color:var(--accent)}
nav.main a.lang{
  border:1px solid var(--line); border-radius:99px; padding:.15rem .75rem;
  font-size:.8rem; letter-spacing:.06em;
}
nav.main a.lang:hover{border-color:var(--accent); color:var(--accent)}
main{max-width:46rem; margin:0 auto; padding:0 1.25rem 5rem}
.hero{padding:4rem 0 2.4rem; text-align:center}
h1{
  font-family:"Noto Serif TC",serif; font-size:clamp(1.9rem,5.5vw,2.9rem);
  line-height:1.35; text-wrap:balance; margin-bottom:1rem;
}
.hero p{color:var(--ink-soft); font-size:1.1rem; max-width:34rem; margin:0 auto}
h2{
  font-family:"Noto Serif TC",serif; font-size:1.35rem; margin:3.2rem 0 1rem;
  padding-top:1.8rem; border-top:1px solid var(--line); text-wrap:balance;
}
h2:first-of-type{border-top:none; padding-top:0}
p{margin:0 0 1.1rem}
strong{color:var(--accent)}
.lede{color:var(--ink-soft); font-size:1.05rem}
.grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(13rem,1fr)); gap:1rem; margin:1.4rem 0}
.card{border:1px solid var(--line); border-radius:10px; padding:1.2rem 1.3rem}
.card h3{font-size:1rem; margin-bottom:.4rem; font-weight:700}
.card p{font-size:.92rem; color:var(--ink-soft); margin:0}
table{
  width:100%; border-collapse:collapse; margin:1.2rem 0; font-size:.95rem;
  font-variant-numeric:tabular-nums;
}
.tablewrap{overflow-x:auto}
th{
  text-align:left; font-size:.78rem; letter-spacing:.1em; color:var(--ink-soft);
  font-weight:500; padding:.45rem .8rem .45rem 0; border-bottom:1px solid var(--ink);
}
td{padding:.55rem .8rem .55rem 0; border-bottom:1px solid var(--line)}
td.num{font-weight:700; white-space:nowrap}
td .zero{color:var(--mark); font-weight:700}
ul{padding-left:1.3rem; margin:0 0 1.1rem}
li{margin-bottom:.4rem}
.evidence{
  border:1px solid var(--line); border-radius:12px; padding:1.6rem 1.6rem 1.2rem;
  margin:1.6rem 0;
}
.evidence .tag{
  display:inline-block; font-size:.72rem; letter-spacing:.14em; color:var(--accent);
  border:1px solid var(--accent); border-radius:99px; padding:.1rem .7rem;
  margin-bottom:.8rem;
}
.evidence h3{font-family:"Noto Serif TC",serif; font-size:1.12rem; margin-bottom:.5rem}
.evidence .src{font-size:.82rem; color:var(--ink-soft); margin-top:.6rem}
.callout{
  background:var(--accent-soft); border-left:3px solid var(--accent);
  padding:1rem 1.2rem; margin:1.4rem 0; border-radius:0 6px 6px 0;
}
.callout p{margin:0}
.callout p + p{margin-top:.7rem}
.correction{
  border:1px solid var(--line); border-radius:8px; padding:1.1rem 1.3rem;
  margin:1.6rem 0; font-size:.93rem; color:var(--ink-soft);
}
.correction b{color:var(--ink)}
ul.deliver{list-style:none; padding:0; margin:1.2rem 0}
ul.deliver li{
  padding:.7rem 0 .7rem 1.9rem; border-bottom:1px solid var(--line);
  position:relative;
}
ul.deliver li::before{
  content:"\2713"; position:absolute; left:.2rem; color:var(--accent); font-weight:700;
}
ul.deliver li small{display:block; color:var(--ink-soft); font-size:.88rem}
.etym{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));
  gap:1rem; margin:1.6rem 0;
}
.etym .half{border:1px solid var(--line); border-radius:12px; padding:1.5rem 1.5rem 1.2rem}
.etym .word{font-family:"Noto Serif TC",serif; font-size:1.5rem; margin-bottom:.2rem}
.etym .latin{color:var(--accent); font-size:.9rem; letter-spacing:.08em; margin-bottom:.7rem}
.etym p{font-size:.95rem; color:var(--ink-soft); margin:0}
.cta{
  margin-top:3.2rem; padding:1.8rem; border:1px solid var(--accent);
  border-radius:10px; text-align:center;
}
.cta h2{border:none; margin:0 0 .6rem; padding:0}
.cta p{color:var(--ink-soft)}
.cta a.button{
  display:inline-block; margin-top:.7rem; padding:.7rem 1.7rem;
  background:var(--accent); color:var(--bg); text-decoration:none;
  border-radius:8px; font-weight:500;
}
.cta a.button:focus-visible{outline:3px solid var(--mark); outline-offset:2px}
footer{
  max-width:46rem; margin:0 auto; padding:2rem 1.25rem 3rem;
  border-top:1px solid var(--line); font-size:.85rem; color:var(--ink-soft);
}
footer .motto{font-family:"Noto Serif TC",serif; color:var(--ink); margin-bottom:.3rem}
footer a{color:var(--accent)}
footer nav{display:flex; gap:1.2rem; margin-top:.8rem}
footer nav a{color:var(--ink-soft); text-decoration:none}
footer nav a:hover{color:var(--accent)}