
:root{
  --bg:#f7efe6; --panel:#fff8f1; --ink:#2a1c14; --muted:#6b5344;
  --line:#e4d2c0; --accent:#b85a28; --accent2:#d4783a; --card:#ffffff;
  --surface:#ffffff; --ember:#8b3a1a; --shadow:0 10px 28px rgba(42,28,20,.08);
  --radius:14px; --font:Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;
}
*{box-sizing:border-box}
html{font-size:18px}
body{margin:0;font-family:var(--font);color:var(--ink);background:
  radial-gradient(900px 420px at 90% -10%, rgba(212,120,58,.12), transparent 60%),
  linear-gradient(180deg,#fff8f1, var(--bg) 45%, #f3e6d8);
  line-height:1.75; min-height:100vh; overflow-wrap:anywhere}
a{color:var(--accent); text-decoration-thickness:1px; text-underline-offset:3px}
a:hover{color:var(--ember)}
.wrap{width:min(1120px, calc(100% - 32px)); margin:0 auto}
.wrap-narrow{width:min(760px, calc(100% - 32px)); margin:0 auto}
.topbar{position:sticky; top:0; z-index:20;
  background:rgba(247,239,230,.94); border-bottom:1px solid var(--line)}
.bar{display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:64px}
.mark{font-weight:800; font-size:1.05rem; color:var(--ink); text-decoration:none; letter-spacing:.04em}
.mark span{color:var(--accent)}
.nav{display:flex; flex-wrap:wrap; gap:8px 16px}
.nav a{color:var(--muted); text-decoration:none; font-size:.9rem; padding:6px 0; border-bottom:2px solid transparent}
.nav a[aria-current="page"], .nav a:hover{color:var(--ink); border-bottom-color:var(--accent)}
.ember-hero{padding:44px 0 36px; border-bottom:1px solid var(--line);
  background:linear-gradient(100deg, rgba(212,120,58,.10), transparent 55%)}
.ember-hero .kicker{letter-spacing:.16em; font-size:.75rem; color:var(--accent); margin:0 0 10px}
.ember-hero h1{margin:0 0 12px; font-size:clamp(1.55rem, 3vw, 2.15rem); line-height:1.25}
.ember-hero .lede{margin:0; max-width:44rem; color:var(--muted); font-size:1.02rem}
.manual-rail{display:grid; grid-template-columns: 240px 1fr; gap:28px; padding:34px 0}
.rail{position:sticky; top:80px; align-self:start; display:grid; gap:10px}
.rail .toc-title{font-size:.78rem; letter-spacing:.12em; color:var(--muted); margin:0 0 4px}
.rail a{display:block; padding:12px 14px; border-radius:12px; background:var(--card); border:1px solid var(--line);
  color:var(--ink); text-decoration:none; transition:border-color .15s, transform .15s, background .15s}
.rail a:hover{border-color:var(--accent); transform:translateX(3px); background:#fff3e8}
.rail a strong{display:block; font-size:.98rem}
.rail a span{display:block; color:var(--muted); font-size:.82rem; margin-top:4px}
.section{padding:8px 0 28px}
.section h2{margin:0 0 14px; font-size:1.3rem}
.note{background:#fff1e4; border-left:4px solid var(--accent); padding:12px 14px; border-radius:10px; color:var(--muted)}
.alist{display:grid; gap:12px}
.acard{display:grid; grid-template-columns: 8px 1fr; gap:14px; background:var(--card);
  border:1px solid var(--line); border-radius:14px; padding:16px 16px 16px 12px; text-decoration:none; color:inherit;
  transition:border-color .15s, box-shadow .15s, transform .15s}
.acard:hover{border-color:var(--accent); box-shadow:var(--shadow); transform:translateY(-2px)}
.acard i{display:block; width:8px; border-radius:8px; background:linear-gradient(180deg,var(--accent),var(--ember))}
.acard b{display:block; margin-bottom:4px}
.acard em{font-style:normal; color:var(--muted); font-size:.92rem}
.prose{background:var(--card); border:1px solid var(--line); border-radius:18px; padding:28px 24px; box-shadow:var(--shadow)}
.prose h1{margin-top:0; font-size:1.65rem; line-height:1.3}
.prose p{margin:0 0 1em; color:var(--ink)}
.meta-row{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 18px}
.chip{display:inline-block; padding:4px 10px; border-radius:999px; background:#f3e0cf; color:#6b3a1c; font-size:.82rem; text-decoration:none; border:1px solid #e4d2c0}
.related{display:grid; gap:8px; margin-top:18px}
.foot{margin-top:40px; padding:28px 0 120px; border-top:1px solid var(--line); color:var(--muted); font-size:.92rem}
.foot a{color:var(--muted)}
.flinks{display:flex; flex-wrap:wrap; gap:12px}
.age{color:#7a6252}
.lead p{margin:0 0 14px; color:var(--muted)}
.home-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; margin:12px 0 20px}
.home-grid a{display:block; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px; text-decoration:none; color:inherit}
.home-grid a:hover{border-color:var(--accent)}
.home-grid strong{display:block; margin-bottom:6px}
.home-grid span{color:var(--muted); font-size:.9rem}
@media (max-width:860px){
  .manual-rail{grid-template-columns:1fr}
  .rail{position:static; grid-template-columns:1fr 1fr; display:grid}
  .bar{flex-direction:column; align-items:flex-start; padding:10px 0}
  .prose{padding:22px 16px}
}
