:root{
  --paper:#f7f4ec; --ink:#1a1815; --dim:#6f6a60; --rule:#cfc9bb; --rust:#9c4a2f;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font:400 15px/1.72 "PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",system-ui,sans-serif;
}
a{color:var(--ink); text-decoration:none}
a:hover{color:var(--rust)}
.wrap{max-width:1000px; margin:0 auto; padding:0 26px}

/* 报头 */
.masthead{border-bottom:3px double var(--ink); margin-top:34px; padding-bottom:10px; text-align:center}
.masthead h1{font-family:"Songti SC","Noto Serif SC",Georgia,serif; font-weight:600;
  font-size:46px; letter-spacing:.22em; margin:0; line-height:1.15}
.masthead .sub{display:flex; align-items:center; justify-content:space-between;
  font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); margin-top:9px}
.masthead .sub i{font-style:normal; color:var(--rust)}
.dateline{border-bottom:1px solid var(--rule); padding:7px 0; display:flex; justify-content:space-between;
  font-family:"Songti SC",Georgia,serif; font-size:11.5px; color:var(--dim); letter-spacing:.1em}

main{padding:34px 0 70px}
.lead-story{border-bottom:1px solid var(--rule); padding-bottom:30px; margin-bottom:30px}
.lead-story .kicker{font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--rust); margin-bottom:10px}
.lead-story h2{font-family:"Songti SC","Noto Serif SC",Georgia,serif; font-weight:600;
  font-size:34px; line-height:1.28; margin:0 0 12px; letter-spacing:.01em}
.lead-story p{font-size:15.5px; color:#33302a; margin:0; max-width:66ch}

.cols{column-count:3; column-gap:32px; column-rule:1px solid var(--rule)}
.item{break-inside:avoid; padding-bottom:22px; margin-bottom:22px; border-bottom:1px solid var(--rule)}
.item:last-child{border-bottom:0; margin-bottom:0}
.item .kicker{font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); margin-bottom:7px}
.item h3{font-family:"Songti SC","Noto Serif SC",Georgia,serif; font-weight:600;
  font-size:16.5px; line-height:1.42; margin:0 0 7px}
.item h3 a:hover{color:var(--rust)}
.item p{margin:0; font-size:13px; color:var(--dim); line-height:1.68}

article .kicker{font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--rust); display:block; margin-bottom:12px}
article h1{font-family:"Songti SC","Noto Serif SC",Georgia,serif; font-weight:600;
  font-size:32px; line-height:1.3; margin:0 0 14px; letter-spacing:.01em}
article .byline{border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
  padding:8px 0; font-size:11.5px; color:var(--dim); letter-spacing:.1em; margin-bottom:28px}
article p{margin:0 0 20px; font-size:15.5px; color:#2a2721}
article p:first-of-type::first-letter{font-family:"Songti SC",Georgia,serif; font-size:46px;
  float:left; line-height:.86; padding:5px 9px 0 0; color:var(--rust)}
article h2{font-family:"Songti SC",Georgia,serif; font-weight:600; font-size:19px; margin:32px 0 12px}
pre{background:#efeade; border:1px solid var(--rule); padding:14px 16px; overflow:auto; font-size:12.5px; line-height:1.7}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.9em; color:var(--rust)}

footer{border-top:3px double var(--ink); margin-top:14px}
footer .wrap{padding:16px 26px; font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--dim); display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px}
.nf h1{font-family:"Songti SC",Georgia,serif; font-size:72px; color:var(--rust); letter-spacing:.1em}

@media(max-width:860px){
  .cols{column-count:2}
  .masthead h1{font-size:34px}
}
@media(max-width:580px){
  .cols{column-count:1}
  .masthead h1{font-size:26px; letter-spacing:.14em}
  .lead-story h2{font-size:26px}
  article h1{font-size:25px}
}