:root{--red:#a51414;--ink:#1b1c1e;--sub:#5d6470;--line:#e6e8ec;--bg:#fff;--soft:#f7f8fa}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.85 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:1240px;margin:0 auto;padding:0 20px}
/* ---- 页头（与首页 index.html 同一套视觉，站内所有静态页共用）---- */
.topbar{background:#1b1b1d;color:rgba(255,255,255,.62);font-size:12px;height:38px}
.topbar .wrap{height:100%;display:flex;align-items:center;gap:12px}
.tb-dot{width:6px;height:6px;border-radius:50%;background:#c9463c;flex-shrink:0}
.topbar b{color:rgba(255,255,255,.9);font-weight:400}
.tb-sep{width:1px;height:12px;background:rgba(255,255,255,.18)}
.tb-right{margin-left:auto;display:flex;align-items:center;gap:18px}
.tb-right a:hover,.tb-right a.on{color:#fff}
.site-head{background:#fff;border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;flex-wrap:wrap;align-items:center;column-gap:36px}
.site-head .logo{display:flex;align-items:center;gap:11px;height:84px;flex-shrink:0}
.logo-mark{width:52px;height:52px;border-radius:50%;background:var(--red);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.05;font-size:15px;font-weight:800;letter-spacing:1px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.35)}
.logo-mark i{font-style:normal;font-size:9px;font-weight:400;opacity:.8;letter-spacing:.08em}
.logo-txt b{display:block;font-size:21px;font-weight:800;letter-spacing:1px;white-space:nowrap;line-height:1.28;color:var(--ink)}
.logo-txt span{display:block;font-size:8.5px;color:#9aa0aa;letter-spacing:.18em;margin-top:2px}
.nav{order:3;flex:0 0 100%;width:100%;display:flex;flex-wrap:wrap;align-items:center;gap:0 18px;padding:0 0 12px;border-top:1px solid #f0f1f4;margin-top:2px}
.nav a{position:relative;font-size:13.5px;color:#2c2c2c;height:30px;display:flex;align-items:center;white-space:nowrap;flex-shrink:0;line-height:1}
.nav a:hover{color:var(--red)}
.nav a.on{color:var(--red);font-weight:700}
.nav a.on::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--red)}
.head-tools{margin-left:auto;display:flex;align-items:center;height:84px}
/* ---- 站内搜索条：与首页同一套视觉，所有静态页共用 ---- */
.searchbar{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--line);padding:11px 18px;margin:18px 0 0}
.sb-label{display:flex;align-items:center;gap:7px;flex-shrink:0;font-size:13.5px;font-weight:700;color:var(--red);padding-right:16px;border-right:1px solid var(--line);letter-spacing:.5px}
.sb-label svg{width:15px;height:15px}
.sb-field{flex:1;display:flex;align-items:center;gap:10px;min-width:0}
.sb-field svg{width:17px;height:17px;color:#b6b6b6;flex-shrink:0}
.sb-field input{flex:1;min-width:0;height:40px;border:0;outline:none;background:transparent;font-family:inherit;font-size:14px;color:var(--ink);-webkit-appearance:none;appearance:none}
.sb-field input::placeholder{color:#adadad}
.sb-field input::-webkit-search-cancel-button{-webkit-appearance:none}
.sb-btn{width:96px;height:40px;flex-shrink:0;border:0;border-radius:2px;background:var(--red);color:#fff;font-family:inherit;font-size:14px;letter-spacing:3px;cursor:pointer}
.sb-btn:hover{background:#8b0f0f}
.sb-hot{display:flex;align-items:center;gap:15px;flex-shrink:0;font-size:12.5px;color:#9aa0aa;padding-left:16px;border-left:1px solid var(--line)}
.sb-hot a{color:var(--sub)}
.sb-hot a:hover{color:var(--red)}
/* 搜索结果 */
.searchtip{color:var(--sub);font-size:13.5px;margin:12px 0 0}
.searchtip b{color:var(--red)}
.sres{list-style:none;margin:14px 0 0;padding:0;border-top:1px solid var(--line)}
.sres li{padding:14px 0;border-bottom:1px dashed var(--line)}
.sres li>a{font-size:16.5px;font-weight:600;line-height:1.55;display:block}
.sres li>a:hover{color:var(--red)}
.sres .m{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px;font-size:12.5px;color:var(--sub)}
.sres .m .tg{color:var(--red);background:var(--soft);border-radius:3px;padding:1px 7px}
.sres mark{background:#fff3c4;color:#8a4b00;padding:0 1px}
.sres-empty{color:var(--sub);font-size:14px;padding:16px 0;line-height:2}
.sres-empty a{color:var(--red)}
.sretop{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:18px 0 0;font-size:14px;color:var(--sub)}
.sretop b{color:var(--red);font-size:15px}
.hsearch{display:flex;align-items:center;color:#6b7280;padding:6px}
.hsearch:hover{color:var(--red)}
.crumb{font-size:13px;color:var(--sub);padding:16px 0 0}
.crumb a:hover{color:var(--red)}
.crumb span{margin:0 6px;color:#c3c8d0}
main{padding:8px 0 40px}
article.post{max-width:820px;margin:0 auto}
h1{font-size:30px;line-height:1.45;margin:14px 0 12px;letter-spacing:-.2px}
.meta{display:flex;flex-wrap:wrap;gap:14px;font-size:13px;color:var(--sub);padding-bottom:14px;border-bottom:1px solid var(--line)}
.meta b{color:var(--red);font-weight:600}
.lead{margin:20px 0;padding:16px 18px;background:var(--soft);border-left:3px solid var(--red);border-radius:0 6px 6px 0;color:#333;font-size:15.5px}
.cover{margin:22px 0;border-radius:10px;overflow:hidden;border:1px solid var(--line)}
.body{font-size:17px;color:#232427}
.body h2{font-size:21px;margin:34px 0 12px;padding-left:12px;border-left:4px solid var(--red);line-height:1.5}
.body h3{font-size:18px;margin:26px 0 10px}
.body p{margin:0 0 18px}
.body ul,.body ol{margin:0 0 18px;padding-left:22px}
.body li{margin:6px 0}
.body blockquote{margin:20px 0;padding:12px 16px;background:var(--soft);border-left:3px solid #d9dde3;color:#444}
.body figure{margin:24px 0}
.body figure img{width:100%;border:1px solid var(--line);border-radius:10px;background:var(--soft)}
.body figcaption{font-size:13px;color:var(--sub);text-align:center;margin-top:8px;line-height:1.6}
.body a{color:var(--red);border-bottom:1px solid rgba(165,20,20,.25)}
.body table{width:100%;border-collapse:collapse;margin:0 0 18px;font-size:15px}
.body th,.body td{border:1px solid var(--line);padding:8px 10px;text-align:left}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 0}
.tags a{font-size:13px;color:var(--sub);background:var(--soft);border:1px solid var(--line);border-radius:99px;padding:4px 12px}
.tags a:hover{color:var(--red);border-color:rgba(165,20,20,.3)}
.rel{margin:36px 0 0;padding-top:22px;border-top:1px solid var(--line)}
.rel h2{font-size:17px;margin:0 0 12px}
.rel ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.rel li{font-size:15px;line-height:1.7;padding-left:14px;position:relative}
.rel li::before{content:"";position:absolute;left:0;top:10px;width:5px;height:5px;border-radius:50%;background:var(--red);opacity:.55}
.rel li a:hover{color:var(--red)}
.rel time{color:#a9aeb8;font-size:12.5px;margin-left:8px}
.pager{display:flex;gap:12px;margin:28px 0 0;font-size:14px}
.pager a{flex:1;min-width:0;border:1px solid var(--line);border-radius:8px;padding:12px 14px;color:var(--sub);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.pager a:hover{border-color:rgba(165,20,20,.35);color:var(--red)}
.pager a span{display:block;font-size:11.5px;color:#a9aeb8;letter-spacing:1px}
footer{border-top:1px solid var(--line);background:var(--soft);padding:26px 0;margin-top:30px;font-size:13px;color:var(--sub)}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between}
footer a:hover{color:var(--red)}
.listing{max-width:960px;margin:0 auto}
.listing h1{font-size:26px}
.listing .grid{display:grid;gap:2px;margin:18px 0 0;border-top:1px solid var(--line)}
.listing .row{display:flex;gap:16px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line)}
.listing .row a{flex:1;min-width:0;font-size:16px}
.listing .row a:hover{color:var(--red)}
.listing .row time{font-size:12.5px;color:#a9aeb8;white-space:nowrap}
.listing .row .cat{font-size:11.5px;color:var(--red);background:rgba(165,20,20,.06);padding:2px 8px;border-radius:99px;white-space:nowrap}
/* 两栏：正文 + 侧栏（热门稿件） */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:36px;align-items:start}
.layout>.post,.layout>.listing{max-width:none;margin:0;min-width:0}
.side{position:sticky;top:16px;display:grid;gap:16px;align-content:start;font-size:14px}
.card{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg)}
.card>h2{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;margin:0;padding:11px 14px;background:var(--soft);border-bottom:1px solid var(--line);letter-spacing:.3px;line-height:1.4}
.card>h2::before{content:"";flex:0 0 3px;height:13px;border-radius:2px;background:var(--red)}
.card>h2 em{font-style:normal;font-weight:400;font-size:11.5px;color:#a9aeb8;margin-left:auto}
.hot{list-style:none;margin:0;padding:4px 0}
.hot li{display:flex;gap:10px;padding:9px 14px 9px 12px}
.hot li+li{border-top:1px dashed #eef0f3}
.hot .rh{flex:0 0 36px;display:grid;gap:3px;justify-items:center;padding-top:2px}
.hot .rk{width:17px;height:17px;line-height:17px;text-align:center;font-size:11px;font-weight:700;color:#9aa0aa;background:#f1f3f6;border-radius:4px;font-family:-apple-system,Arial,sans-serif}
.hot li:nth-child(1) .rk{color:#fff;background:var(--red)}
.hot li:nth-child(2) .rk{color:#fff;background:#bf4a2b}
.hot li:nth-child(3) .rk{color:#fff;background:#d2913e}
.hot a{flex:1;min-width:0;font-size:14px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hot a:hover{color:var(--red)}
.hot .vv{font-size:10px;color:#b3b8c1;white-space:nowrap;letter-spacing:-.2px}
.cardmore{display:block;padding:10px 14px;border-top:1px solid var(--line);font-size:12.5px;color:var(--sub);text-align:center}
.cardmore:hover{color:var(--red);background:var(--soft)}
@media(max-width:960px){
 .layout{grid-template-columns:1fr;gap:28px}
 .side{position:static}
}
@media(max-width:900px){
 .topbar{height:auto;padding:7px 0;font-size:11.5px}
 .topbar .wrap{height:auto;flex-wrap:wrap;gap:8px 10px}
 .topbar .hide-m{display:none}
 .tb-right{gap:14px}
 .site-head .wrap{column-gap:16px}
 .site-head .logo,.head-tools{height:66px}
 .logo-mark{width:44px;height:44px;font-size:13.5px}
 .logo-txt b{font-size:18px}
 /* 栏目多，移动端改成单行横向滑动，避免头部占掉半屏 */
 .nav{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;gap:0 14px;padding:2px 0 8px;
   -webkit-overflow-scrolling:touch;scrollbar-width:none}
 .nav::-webkit-scrollbar{display:none}
 .nav a{font-size:12.5px;height:28px}
 /* 搜索条：窄屏去掉热门词，只留输入框与按钮 */
 .searchbar{padding:9px 12px;gap:10px;margin-top:14px}
 .sb-hot{display:none}
 .sb-field input{height:36px;font-size:13.5px}
 .sb-btn{width:70px;height:36px;letter-spacing:1px;font-size:13.5px}
 .sb-label{padding-right:10px;font-size:12.5px}
}
@media(max-width:640px){
 .wrap{padding:0 16px}
 h1{font-size:23px}
 .body{font-size:16.5px}
 .meta{gap:10px;font-size:12.5px}
 .listing .row{gap:10px}
 .listing .row .cat{display:none}
 .hot li{padding:9px 12px}
 .sb-label{display:none}
 .sb-field input::placeholder{font-size:12.5px}
}