*{margin:0;padding:0;box-sizing:border-box}
/* ── 设计令牌：暖纸底色 + 珊瑚主色 + 青绿辅色，全站统一 ── */
:root{
 --ink:#22262D;--sub:#5A6472;--faint:#8A93A1;
 --brand:#E8562A;--brand-strong:#D2431B;--brand-soft:#FFF1E8;--brand-line:#F6C9AE;
 --teal:#0E7C86;--teal-soft:#E7F4F2;
 --line:#EDE3D4;--bg:#FFFBF3;--card:#FFFFFF;
 --shadow-sm:0 2px 10px rgba(84,52,28,.06);
 --shadow-md:0 8px 26px rgba(84,52,28,.09);
 --shadow-lg:0 18px 44px rgba(84,52,28,.14);
 --ease:cubic-bezier(.22,.68,.32,1);
 --grad-brand:linear-gradient(135deg,#F2663A 0%,#E8562A 55%,#D8451C 100%);
}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Segoe UI",sans-serif;
 color:var(--ink);background:var(--bg);line-height:1.75;-webkit-font-smoothing:antialiased;
 text-rendering:optimizeLegibility;
 background-image:radial-gradient(circle at 6% 2%,#FFE8D6 0%,rgba(255,232,214,0) 40%),
 radial-gradient(circle at 98% 96%,#D9F0EE 0%,rgba(217,240,238,0) 38%);background-attachment:fixed}
::selection{background:#FBD9C4;color:#7A2E10}
a{color:var(--brand);text-decoration:none;transition:color .18s var(--ease)}
a:hover{color:var(--brand-strong);text-decoration:underline}
a:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px;text-decoration:none}
code{font-family:"Cascadia Code","JetBrains Mono","Consolas",monospace;background:#FDF0E6;color:#B23E0D;
 padding:2px 7px;border-radius:6px;font-size:.88em;border:1px solid #F5CDB6;
 overflow-wrap:break-word;word-break:break-word}
/* 主体为单列纵向流：相关专题导航用 order:-1 提到页面顶部（DOM 仍在文末，语义不变）。
   导航由 site.js 注入「更多/收起」按钮，一行排不下时自动折叠。 */
.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(16px,4vw,24px) clamp(48px,8vw,72px);
 display:flex;flex-direction:column}
.wrap.hub{max-width:1000px}
/* ── 页头 ── */
header{padding:clamp(30px,5vw,48px) 0 clamp(18px,3vw,26px)}
.logo{display:inline-block;font-size:13px;font-weight:800;letter-spacing:2.5px;color:#fff;
 background:var(--grad-brand);padding:8px 18px;border-radius:999px;
 box-shadow:0 6px 16px rgba(216,69,28,.28)}
.crumb{font-size:clamp(13px,2vw,14px);color:var(--faint);margin:18px 0 0;word-break:break-all}
.crumb a{color:var(--sub)}
.crumb a:hover{color:var(--brand)}
h1{font-size:clamp(28px,5.2vw,44px);line-height:1.22;font-weight:900;margin:14px 0 0;
 letter-spacing:-.8px;color:var(--ink)}
h1 em{color:var(--brand);font-style:normal;
 background:linear-gradient(transparent 62%,#FBD9BE 62%,#FBD9BE 92%,transparent 92%)}
.lead{font-size:clamp(15.5px,2.4vw,18.5px);color:var(--sub);margin-top:16px;max-width:720px;line-height:1.85}
/* ── 卡片图 ── */
figure{margin:clamp(20px,4vw,32px) 0;background:var(--card);border:1px solid var(--line);border-radius:24px;
 padding:clamp(12px,2.5vw,18px);box-shadow:var(--shadow-md)}
figure img{width:100%;height:auto;display:block;margin:0 auto;border-radius:16px}
figure figcaption{text-align:center;font-size:clamp(13px,2vw,14px);color:var(--faint);margin-top:14px;letter-spacing:.3px}
/* ── 章节标题：渐变侧条 ── */
h2{position:relative;font-size:clamp(21px,3.4vw,26px);font-weight:800;margin:clamp(28px,4vw,40px) 0 14px;
 padding-left:16px;letter-spacing:-.2px}
h2:before{content:"";position:absolute;left:0;top:.28em;bottom:.24em;width:6px;border-radius:3px;
 background:var(--grad-brand)}
/* ── 要点列表 ── */
ul{list-style:none;display:flex;flex-direction:column;gap:12px}
li{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-sm);
 padding:clamp(14px,2.4vw,16px) clamp(16px,2.6vw,20px);font-size:clamp(15.5px,2.2vw,17px);
 overflow-wrap:break-word;word-break:break-word;transition:box-shadow .2s var(--ease)}
li:hover{box-shadow:var(--shadow-md)}
li b{color:var(--ink)}
/* ── 标签 ── */
.tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.tag{font-size:13.5px;background:var(--card);border:1px solid var(--line);border-radius:999px;
 padding:7px 16px;color:var(--sub);box-shadow:var(--shadow-sm);
 transition:all .2s var(--ease)}
.tag:hover{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand-strong);
 text-decoration:none;transform:translateY(-1px);box-shadow:var(--shadow-md)}
/* ── 文末相关专题：词云式水平排列（字号/色阶循环变化，居中铺满） ── */
nav.related{margin-top:clamp(38px,6vw,60px);padding:clamp(22px,3.4vw,30px) clamp(18px,3vw,28px);
 background:linear-gradient(160deg,#FFFFFF 0%,#FFF8EF 100%);
 border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-md);
 text-align:center;line-height:1.75}
nav.related b{display:block;font-size:11.5px;color:var(--faint);font-weight:800;letter-spacing:1.5px;
 margin:0 0 2px}
nav.related b:not(:first-of-type){margin-top:20px}
nav.related a{display:inline-block;vertical-align:middle;white-space:nowrap;border-radius:999px;
 padding:3px 10px;margin:0 6px 7px 0;border:1px solid var(--line);background:var(--card);
 font-size:11px;color:var(--sub);transition:all .2s var(--ease)}
nav.related a:hover{background:var(--grad-brand);border-color:transparent;color:#fff;
 text-decoration:none;transform:translateY(-2px);box-shadow:0 8px 18px rgba(216,69,28,.26)}
/* 词云字号：5 级循环 */
nav.related a:nth-of-type(5n+1){font-size:12px;font-weight:700}
nav.related a:nth-of-type(5n+2){font-size:10.5px}
nav.related a:nth-of-type(5n+3){font-size:11.5px;font-weight:600}
nav.related a:nth-of-type(5n+4){font-size:11px}
nav.related a:nth-of-type(5n){font-size:10.5px}
/* 词云色阶：7 色循环（与 5 级字号互质 → 35 种组合，观感随机） */
nav.related a:nth-of-type(7n+1){color:#2B3138}
nav.related a:nth-of-type(7n+2){color:#C2410C}
nav.related a:nth-of-type(7n+3){color:#0F766E}
nav.related a:nth-of-type(7n+4){color:#3B5BDB}
nav.related a:nth-of-type(7n+5){color:#6D28D9}
nav.related a:nth-of-type(7n+6){color:#BE185D}
nav.related a:nth-of-type(7n){color:#B45309}
/* 折叠容器与「展开/收起」按钮：由 js/site.js 注入，无 JS 时不裁剪、按钮不存在 */
.navlinks{position:relative;transition:max-height .28s var(--ease)}
.navlinks.collapsed{overflow:hidden}
.navtoggle{display:block;margin:10px auto 0;font-family:inherit;font-size:12px;font-weight:700;
 line-height:1.5;color:var(--brand-strong);cursor:pointer;
 background:var(--brand-soft);border:1px solid var(--brand-line);border-radius:999px;
 padding:5px 18px;transition:all .18s var(--ease)}
.navtoggle:hover{background:var(--grad-brand);border-color:transparent;color:#fff;
 box-shadow:0 6px 14px rgba(216,69,28,.26)}
.navtoggle:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.navtoggle[hidden]{display:none}
/* ── 上一篇 / 下一篇 ── */
nav.pager{display:flex;gap:14px;margin-top:clamp(32px,5vw,48px)}
nav.pager a{flex:1;background:var(--card);border:1px solid var(--line);border-radius:18px;
 padding:clamp(15px,2.4vw,18px) clamp(16px,2.6vw,22px);min-height:64px;box-shadow:var(--shadow-sm);
 font-weight:700;font-size:clamp(15px,2.2vw,16px);color:var(--ink);
 transition:all .22s var(--ease);
 display:flex;flex-direction:column;justify-content:center}
nav.pager a:hover{border-color:var(--brand-line);color:var(--brand-strong);text-decoration:none;
 transform:translateY(-2px);box-shadow:var(--shadow-md)}
nav.pager .next{text-align:right;align-items:flex-end}
nav.pager span{display:block;font-size:12.5px;color:var(--faint);font-weight:600;margin-bottom:4px;letter-spacing:.5px}
/* ── 页脚 ── */
/* ── 页脚：描述行 + 站点导航（工具链接，一行四个）+ 备案行 ── */
footer{margin-top:clamp(38px,6vw,60px);padding-top:clamp(22px,3.4vw,30px);
 border-top:1px solid var(--line);font-size:13px;color:var(--faint);line-height:1.85}
footer a{color:var(--sub);text-decoration:none;transition:color .18s var(--ease)}
footer a:hover{color:var(--brand-strong);text-decoration:underline}
footer .fdesc{margin-bottom:clamp(18px,3vw,26px)}
footer .fgrid{display:grid;grid-template-columns:1fr;gap:clamp(20px,3.4vw,44px);
 padding-bottom:clamp(16px,2.6vw,24px)}
footer .fcol b{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:800;
 letter-spacing:1.2px;color:var(--ink);margin:0 0 10px}
footer .fcol b:before{content:"";width:5px;height:5px;border-radius:2px;
 background:var(--grad-brand);flex:0 0 auto}
footer .fcol p{font-size:12.5px;line-height:1.85;margin-bottom:7px}
footer .fcol a{display:block;font-size:12.5px;padding:2.5px 0}
/* 站点导航：链接一行四个，多于四个自动换行 */
footer .flinks{display:grid;grid-template-columns:repeat(4,1fr);
 gap:0 clamp(10px,1.8vw,20px);align-content:start}
footer .flinks a{padding:3px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
footer .flegal{margin-top:clamp(14px,2.4vw,20px);padding-top:clamp(14px,2.2vw,18px);
 border-top:1px dashed var(--line);font-size:11.5px;color:var(--faint);text-align:center}
/* ── 首页卡片网格（专题首页用）：上大图 + 下方标题描述 ── */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));
 gap:clamp(16px,2.4vw,22px);margin-top:clamp(24px,4vw,34px)}
.gcard{background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;
 box-shadow:var(--shadow-sm);
 transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease);
 display:flex;flex-direction:column;min-height:100%}
.gcard:hover{border-color:var(--brand-line);text-decoration:none;box-shadow:var(--shadow-lg);
 transform:translateY(-4px)}
.gcard img{width:100%;height:auto;display:block;background:#FFF7EF;aspect-ratio:3/4;object-fit:cover;
 transition:transform .35s var(--ease)}
.gcard:hover img{transform:scale(1.035)}
.gcard .gbody{padding:clamp(14px,2.2vw,16px) clamp(15px,2.4vw,18px) clamp(17px,2.6vw,20px);
 flex:1;display:flex;flex-direction:column}
.gcard .no{font-size:11.5px;font-weight:800;color:var(--brand);letter-spacing:1.2px}
.gcard h3{font-size:clamp(16px,2.3vw,17px);font-weight:800;margin:7px 0 7px;color:var(--ink);
 line-height:1.45;letter-spacing:-.1px}
.gcard p{font-size:13.5px;color:var(--sub);line-height:1.65;margin-top:auto;padding-top:6px}
/* ── 汇总首页（.grid.list）：文章列表式，一行两项，左图右文
   ⚠️ img 的 height="1440" 是 presentational hint，必须显式 height:auto，否则图会被撑到 1440px ── */
.grid.list{grid-template-columns:repeat(2,1fr);gap:clamp(12px,1.8vw,18px)}
/* 图片用绝对定位铺满左侧：否则 img 的固有比例（123px 宽 → 164px 高）会反过来撑高卡片，
   导致文字下方留出大片空白。padding-left 给图片让位。 */
.grid.list .gcard{position:relative;padding-left:clamp(92px,10.5vw,124px);
 flex-direction:row;align-items:stretch;min-height:0;border-radius:18px}
.grid.list .gcard:hover{transform:translateY(-2px)}
.grid.list .gcard img{position:absolute;left:0;top:0;height:100%;
 width:clamp(92px,10.5vw,124px);aspect-ratio:auto;object-fit:cover;object-position:top center}
.grid.list .gcard .gbody{padding:clamp(12px,1.9vw,15px) clamp(13px,2vw,16px);min-width:0}
.grid.list .gcard .no{font-size:11px}
.grid.list .gcard h3{font-size:clamp(14.5px,1.9vw,16px);margin:4px 0 5px;line-height:1.45;
 display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* margin-top:auto 会把描述推到卡片底部、和标题拉开大空隙，列表里改为紧跟标题 */
.grid.list .gcard p{font-size:12.5px;margin-top:2px;padding-top:0;
 display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* ── 导语框 ── */
.hero{background:linear-gradient(160deg,#FFFFFF 0%,#FFF8EF 100%);
 border:1px solid var(--line);border-radius:24px;
 padding:clamp(22px,3.6vw,34px) clamp(22px,3.8vw,36px);margin-top:clamp(20px,3.4vw,28px);
 box-shadow:var(--shadow-md)}
.hero ul{gap:10px}
.hero li{background:transparent;border:none;box-shadow:none;padding:6px 0 6px 26px;position:relative;
 font-size:clamp(15px,2.2vw,16px)}
.hero li:hover{box-shadow:none}
.hero li:before{content:"";position:absolute;left:2px;top:16px;width:9px;height:9px;
 border-radius:50%;background:var(--grad-brand);box-shadow:0 0 0 3px var(--brand-soft)}
/* 专题首页封面卡（card1）：grid 内第一项，结构与内容卡一致但不可点击 */
.grid>div.gcard{cursor:default}
.grid>div.gcard:hover{border-color:var(--line);box-shadow:var(--shadow-sm);transform:none}
.grid>div.gcard:hover img{transform:none}
/* ── 触屏设备：取消悬停浮起，避免「粘住的悬停态」 ── */
@media(hover:none){
 .gcard:hover,.grid.list .gcard:hover,nav.pager a:hover,.tag:hover{transform:none}
 nav.related a:hover{transform:none}
}
/* ── 响应式：平板 ── */
@media(max-width:1024px){
 .wrap{max-width:860px}
 /* 词云：窄屏收紧内边距与热词间距 */
 nav.related{padding:20px 16px;border-radius:20px;line-height:1.7}
}
/* ── 响应式：手机横屏 / 小平板 ── */
@media(max-width:768px){
 header{padding:26px 0 16px}
 figure img{max-width:100%}
 /* 页脚：导航链接一行三个 */
 footer .flinks{grid-template-columns:repeat(3,1fr)}
 .grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr))}
 nav.pager{gap:12px}
 .gcard:hover{box-shadow:var(--shadow-md)}
}
/* ── 响应式：手机竖屏 ── */
@media(max-width:640px){
 .grid{grid-template-columns:1fr}
 .grid.list{grid-template-columns:1fr}
 nav.related a{margin:0 5px 6px 0;padding:3px 9px}
 nav.pager{flex-direction:column}
 nav.pager a{min-height:56px}
 nav.pager .next{text-align:left;align-items:flex-start}
 h2{padding-left:14px}
 .tags{gap:8px}
 .tag{font-size:13px;padding:7px 13px}
 .crumb{line-height:1.6}
 /* 页脚：窄屏导航链接一行两个 */
 footer .flinks{grid-template-columns:1fr 1fr;gap:0 12px}
}
/* ── 响应式：超小屏 ── */
@media(max-width:380px){
 h1{font-size:26px}
 .grid{gap:14px}
 .gcard h3{font-size:16px}
 .grid.list{gap:12px}
 .grid.list .gcard h3{font-size:15px}
 .grid.list .gcard{padding-left:104px}
 .grid.list .gcard img{width:104px}
 .hero{border-radius:18px}
 figure{border-radius:16px}
 /* 页脚：超小屏导航链接仍两列（链接名较短，够放） */
 footer .flinks{grid-template-columns:1fr 1fr;gap:0 10px}
 nav.related a:nth-of-type(5n+1){font-size:11.5px}
 nav.related a:nth-of-type(5n+3){font-size:11px}
}
/* ── 无障碍：尊重减少动效 ── */
@media(prefers-reduced-motion:reduce){
 *{transition:none!important;animation:none!important}
 html{scroll-behavior:auto}
 .gcard:hover{transform:none}
}
/* ── 打印：隐藏导航，展开内容 ── */
@media print{
 body{background:#fff}
 nav.related,nav.pager,.tags{display:none}
 .wrap{display:block}
 figure img{max-width:100%}
}
