:root { --ink:#17251d; --green:#176443; --orange:#f26622; --muted:#66736b; --line:#e5e8e3; --cream:#f7f5ee; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:#fff; font-family:"Noto Sans SC",system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif; }
a { color:var(--green); }
.content-header { height:76px; padding:0 max(24px,calc((100% - 1120px)/2)); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:rgba(255,255,255,.96); }
.content-brand { display:flex; align-items:center; gap:10px; color:var(--ink); text-decoration:none; font-weight:800; }
.content-brand span { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; color:#fff; background:var(--orange); }
.content-header nav { display:flex; gap:24px; }
.content-header nav a { color:#526158; text-decoration:none; font-size:14px; }
.article-hero { padding:80px 24px 64px; background:linear-gradient(145deg,#f8f6ef,#eff7f1); }
.article-hero > div { max-width:880px; margin:auto; }
.eyebrow { color:var(--orange); font-size:12px; font-weight:800; letter-spacing:.12em; }
h1 { margin:18px 0; font-size:clamp(38px,6vw,66px); line-height:1.12; letter-spacing:-.045em; }
.article-hero p { max-width:740px; color:var(--muted); font-size:18px; line-height:1.85; }
.article-meta { display:flex; flex-wrap:wrap; gap:10px 22px; margin-top:28px; color:#7b867f; font-size:13px; }
.article-layout { max-width:1120px; margin:0 auto; padding:64px 24px 100px; display:grid; grid-template-columns:minmax(0,760px) 280px; gap:64px; }
article { font-size:17px; line-height:1.95; }
article h2 { margin:52px 0 16px; font-size:30px; line-height:1.35; letter-spacing:-.02em; }
article h2:first-child { margin-top:0; }
article h3 { margin:32px 0 10px; font-size:21px; }
article p { color:#3f4d45; }
article ul, article ol { padding-left:24px; color:#3f4d45; }
article li { margin:10px 0; }
.callout { margin:28px 0; padding:22px 24px; border-left:4px solid var(--orange); border-radius:0 14px 14px 0; background:var(--cream); }
.checklist { padding:24px 28px; border-radius:16px; background:#eef6f1; }
.checklist li::marker { color:var(--green); }
.source-list { word-break:break-all; }
.article-side { align-self:start; position:sticky; top:28px; }
.side-card { padding:24px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.side-card strong { display:block; margin-bottom:10px; }
.side-card p { color:var(--muted); font-size:13px; line-height:1.8; }
.side-card a { display:block; margin-top:12px; font-size:13px; text-decoration:none; }
.related { margin-top:16px; }
.related a { padding:12px 0; border-top:1px solid var(--line); }
.site-page { max-width:900px; margin:auto; padding:72px 24px 100px; }
.site-page h1 { font-size:52px; }
.site-page .lead { color:var(--muted); font-size:19px; line-height:1.9; }
.site-page section { margin-top:48px; }
.site-page h2 { font-size:28px; }
.site-page p,.site-page li { color:#425047; line-height:1.9; }
.page-footer { padding:34px 24px; border-top:1px solid var(--line); color:#7a857e; text-align:center; font-size:12px; }
.page-footer a { margin:0 8px; color:#617067; text-decoration:none; }
@media (max-width:820px) { .content-header nav { gap:12px; } .content-header nav a:nth-child(2) { display:none; } .article-layout { grid-template-columns:1fr; } .article-side { position:static; } h1 { font-size:42px; } .site-page h1 { font-size:42px; } }
