:root{
  --bg:#f6f1e7; --ink:#1c1917; --muted:#57534e; --card:#fffdf8;
  --line:#e7e0d4; --accent:#9a3412; --accent2:#1d4ed8; --ok:#166534;
  --radius:14px; --shadow:0 1px 0 rgba(28,25,23,.04), 0 8px 24px rgba(28,25,23,.06);
  --max:920px; --mono:ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:"Source Han Sans SC","Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{font-size:17px;scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);color:var(--ink);background:
  radial-gradient(1200px 500px at 10% -10%,#fde68a55,transparent),
  radial-gradient(900px 400px at 100% 0%,#fdba7455,transparent),
  var(--bg);line-height:1.65}
a{color:var(--accent2);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--accent)}
.wrap{max-width:var(--max);margin:0 auto;padding:1.25rem 1rem 3rem}
header.site{display:flex;flex-wrap:wrap;gap:.75rem 1.25rem;align-items:baseline;justify-content:space-between;
  padding:1rem 0 1.25rem;border-bottom:1px solid var(--line);margin-bottom:1.5rem}
header.site h1{font-size:1.25rem;margin:0;letter-spacing:.02em}
header.site nav{display:flex;flex-wrap:wrap;gap:.75rem;font-size:.92rem}
.badge{display:inline-block;font-size:.72rem;padding:.15rem .5rem;border-radius:999px;
  background:#fff7ed;color:var(--accent);border:1px solid #fed7aa;font-weight:600}
.hero{margin:0 0 1.5rem}
.hero h2{font-size:1.75rem;line-height:1.25;margin:0 0 .5rem}
.hero p{margin:.35rem 0;color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.9rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:1rem 1.05rem;box-shadow:var(--shadow);transition:transform .15s ease,border-color .15s}
.card:hover{transform:translateY(-2px);border-color:#d6d3d1}
.card h3{margin:.2rem 0 .35rem;font-size:1.05rem}
.card .tag{font-size:.75rem;color:var(--accent);font-weight:700;letter-spacing:.04em}
.card p{margin:0;color:var(--muted);font-size:.92rem}
.card a.cover{color:inherit;text-decoration:none;display:block}
ul.bullets{padding-left:1.1rem;margin:.5rem 0 1rem}
ul.bullets li{margin:.35rem 0}
.quote{border-left:3px solid var(--accent);padding:.2rem 0 .2rem 1rem;margin:1rem 0;
  background:linear-gradient(90deg,#fff7ed66,transparent)}
.quote .en{font-size:.92rem;color:#44403c}
.quote .zh{margin-top:.35rem;font-weight:600}
.quote footer{margin-top:.4rem;font-size:.8rem;color:var(--muted)}
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:1rem 1.1rem;margin:1rem 0;box-shadow:var(--shadow)}
details.deeper{margin:1.25rem 0;border:1px dashed #d6d3d1;border-radius:var(--radius);padding:.6rem .9rem;background:#fffcf7}
details.deeper summary{cursor:pointer;font-weight:700;color:var(--accent)}
.mermaid-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:12px;padding:.75rem;margin:1rem 0}
.timeline{list-style:none;padding:0;margin:1rem 0}
.timeline li{display:grid;grid-template-columns:7.5rem 1fr;gap:.75rem;padding:.55rem 0;border-bottom:1px solid var(--line)}
.timeline .y{font-family:var(--mono);font-size:.85rem;color:var(--accent);font-weight:700}
footer.site{margin-top:2.5rem;padding-top:1rem;border-top:1px solid var(--line);color:var(--muted);font-size:.85rem}
.btn{display:inline-block;background:var(--accent);color:#fff!important;text-decoration:none;
  padding:.55rem 1rem;border-radius:999px;border:none;cursor:pointer;font:inherit}
.btn.secondary{background:transparent;color:var(--ink)!important;border:1px solid var(--line)}
form.gb label{display:block;font-size:.85rem;margin:.6rem 0 .2rem;color:var(--muted)}
form.gb input,form.gb textarea{width:100%;padding:.55rem .7rem;border:1px solid var(--line);
  border-radius:10px;font:inherit;background:#fff}
form.gb textarea{min-height:110px;resize:vertical}
.comment{border-top:1px solid var(--line);padding:.85rem 0}
.comment .meta{font-size:.8rem;color:var(--muted)}
.comment .reply{margin-top:.4rem;padding:.5rem .7rem;background:#ecfdf5;border-radius:8px;border:1px solid #bbf7d0}
.reply-flag{color:var(--ok);font-weight:700;font-size:.8rem}
.note{font-size:.85rem;color:var(--muted)}
.crumbs{font-size:.85rem;color:var(--muted);margin-bottom:1rem}
.map-legend{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0 1.25rem}
.map-legend span{font-size:.78rem;padding:.2rem .55rem;border-radius:999px;background:#fff;border:1px solid var(--line)}
@media (max-width:560px){
  html{font-size:16px}
  .timeline li{grid-template-columns:1fr}
  .hero h2{font-size:1.45rem}
}

.quote .badge{margin-right:.35rem;vertical-align:middle}
code{font-family:var(--mono);font-size:.9em;background:#fff;padding:.05rem .3rem;border-radius:4px;border:1px solid var(--line)}

.book-card .tag{letter-spacing:.06em}
.book-card.coming{opacity:.72}
.book-card.coming .cover{cursor:default}
.book-card.coming h3{color:var(--muted)}