*{box-sizing:border-box;margin:0;padding:0}
:root{
  /* 底色比纸面深一档，卡片才浮得起来 */
  --linen:#e9dfcb; --cloth:#fdfaf1; --cloth2:#f8f2e4;
  --sage:#9fb096; --sage-d:#5f7457;
  --mustard:#d9a566; --mustard-d:#8a6224; --mustard-ink:#4a3418;
  --ink-d:#241d14;                     /* 深墨：按钮底部厚度 */
  --sage-grad:linear-gradient(160deg,#adbba3,#94a48a);
  --brick:#b05a44; --fog:#78899f;
  --thread:#8a7458; --thread-l:rgba(138,116,88,.55);
  --ink:#372f24; --ink2:#52463a; --ink3:#7a6b57; --ink4:#a2957f;
  --r:18px;
  --round:"Quicksand","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --sans:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  /* 三层阴影：贴边 + 接触 + 环境 */
  --lift:0 1px 0 rgba(160,132,96,.5),0 2px 4px -2px rgba(70,50,25,.16),0 16px 32px -24px rgba(70,50,25,.5);
  --lift-hi:0 1px 0 rgba(160,132,96,.5),0 6px 12px -6px rgba(70,50,25,.2),0 26px 44px -26px rgba(70,50,25,.55);
}
/* 窄于 375px（iPhone SE）时保持布局宽度，改为横向滚动，避免内容被压变形 */
/* 横向裁剪放在 html 上：body 上的 overflow 会让它变成滚动容器，window.scrollY 恒为 0 */
html{scroll-behavior:smooth; min-width:375px; overflow-x:auto}
/* 最小宽度写在 body 上才生效：窗口再窄也保持 375px，改用横向滚动查看 */
body{min-width:375px}
body{
  min-height:100vh;
  background:var(--linen); color:var(--ink); font-family:var(--sans); line-height:1.8;
  -webkit-font-smoothing:antialiased;
  /* 布面经纬：间距 8px、透明度很低，只留手感不抢眼 */
  background-image:
    repeating-linear-gradient(0deg,rgba(120,100,70,.015) 0 1px,transparent 1px 8px),
    repeating-linear-gradient(90deg,rgba(120,100,70,.015) 0 1px,transparent 1px 8px);
  background-repeat:repeat,repeat;
}
a{color:inherit;text-decoration:none}
/* 开屏 */
.hero{
  position:relative; min-height:100vh; display:flex; flex-direction:column; align-items:center;
  justify-content:center; padding:4vh clamp(18px,5vw,60px);
}
/* PJAX 切页后不再展示开屏（开屏只在整页加载的首屏出现一次） */
body.pn-pjax-live .hero{display:none}
.patch-main{
  position:relative; width:min(760px,100%); border-radius:var(--r);
  background-color:var(--cloth);
  background-image:
    repeating-linear-gradient(45deg,rgba(120,100,70,.026) 0 1px,transparent 1px 6px),
    repeating-linear-gradient(-45deg,rgba(120,100,70,.026) 0 1px,transparent 1px 6px);
  padding:clamp(36px,5vw,60px) clamp(26px,4.5vw,56px) clamp(30px,4vw,46px);
  box-shadow:var(--lift),0 40px 70px -50px rgba(70,50,25,.75);
  transform:rotate(-.7deg);
}
/* 外框缝线 + 纸边厚度 */
.patch-main::before{
  content:""; position:absolute; inset:10px; border:1.6px dashed var(--thread);
  border-radius:calc(var(--r) - 8px); opacity:.62; pointer-events:none;
}
.patch-main::after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.85),inset 0 -3px 8px -4px rgba(120,95,60,.22);
}
.patch{
  position:absolute; border-radius:10px; box-shadow:0 10px 20px -13px rgba(70,50,25,.85);
  display:grid; place-items:center; text-align:center;
  border:1px solid rgba(255,255,255,.35);
  z-index:6;
}
.patch::before{content:""; position:absolute; inset:5px; border:1.4px dashed rgba(50,38,22,.42); border-radius:6px}
.patch span{position:relative; z-index:2}
.p-sage{width:106px;height:84px;background:var(--sage-grad); top:-26px; left:6%; transform:rotate(-7deg); color:#2b3627; font-family:var(--round); font-size:11.5px; font-weight:700; letter-spacing:.12em}
.p-mustard{width:94px;height:74px;background:linear-gradient(160deg,#e2af74,#d29b58); bottom:-24px; right:8%; transform:rotate(6deg); color:var(--mustard-ink); font-family:var(--round); font-size:11.5px; font-weight:700; letter-spacing:.12em}
.p-fog{
  width:auto; min-width:96px; height:76px; padding:0 16px;
  background:linear-gradient(160deg,#8696ab,#6d7f96); top:41%; right:-15px; transform:rotate(9deg);
  color:#eaf0f6;
}
.p-fog span{display:inline-flex; align-items:baseline; gap:5px; font-family:var(--round); white-space:nowrap}
.p-fog b{font-size:23px; font-weight:700; letter-spacing:0; line-height:1}
.p-fog i{font-style:normal; font-size:12px; font-weight:600; letter-spacing:.04em; opacity:.95}
.eyebrow{
  text-align:center; font-family:var(--round); font-size:11.5px; font-weight:600; letter-spacing:.34em;
  color:var(--ink3); text-transform:uppercase; margin-bottom:20px;
}
.eyebrow .d{letter-spacing:.08em; color:var(--ink2); font-weight:600}
.hero h1{
  text-align:center; font-family:var(--round); font-weight:700; font-size:clamp(36px,7vw,78px);
  line-height:1.16; letter-spacing:.045em; color:var(--ink); text-wrap:balance;
}
.hero h1 .g{color:var(--brick)}
/* 副标题较长时：折行、缩小，保持层级 */
.hero h1 .g.subline{display:block; font-size:.44em; line-height:1.5; letter-spacing:.02em; margin-top:.18em; font-weight:600}
.thread-line{display:flex; align-items:center; justify-content:center; gap:10px; margin:22px 0 0}
.thread-line span{width:28px;height:1.5px;background:var(--thread); opacity:.55; border-radius:2px}
.thread-line .dot{width:7px;height:7px;border-radius:50%;background:var(--mustard); box-shadow:0 0 0 3px rgba(217,165,102,.28)}
.tagline{
  text-align:center; color:var(--ink); margin:20px auto 0;
  font-family:var(--round); font-weight:600; letter-spacing:.08em;
  font-size:clamp(17px,2.05vw,21px); line-height:1.9; max-width:34ch;
}
.tagline .sub{
  display:block; margin-top:12px; font-family:var(--sans);
  font-size:13px; font-weight:400; color:var(--ink3); letter-spacing:.02em; line-height:1.95;
  text-wrap:balance;
}
.tags{display:flex; justify-content:center; gap:10px; flex-wrap:wrap; margin-top:26px}
/* 分类角标（首屏 / 大卡片 / 文章页）共用：圆点 + 透明描边，尺寸各自覆盖 */
.meta .tg, .pmeta .tg, .tags > *{
  display:inline-flex; align-items:center; gap:6px;
  background:transparent; border:1.2px solid var(--cline, hsl(150,55%,70%));
  color:var(--ink2);
}
.meta .tg::before, .pmeta .tg::before, .tags > *::before{
  content:""; width:7px; height:7px; border-radius:50%; flex:0 0 auto;
  background:var(--cline, hsl(150,55%,70%));
}
.tags .t-more::before, .tags .fp-break::before{display:none}

.tags > *{
  font-family:var(--round); font-size:11.5px; font-weight:700; padding:5px 13px 5px 11px; border-radius:8px;
  text-decoration:none; white-space:nowrap; transition:transform .18s;
}
.tags > *{flex:0 1 auto; min-width:0}
/* 空间不够时文字自己收口打省略号，圆点和边框保持完整 */
.tags > * > span{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.tags > *:hover{transform:translateY(-2px) !important}
/* PHP 按名字哈希给出 --cbg（浅底）和 --cline（描边/圆点），这里的 hsl 只是兜底 */
.cats i, .cloud a, .ptags a{background:var(--cbg, hsl(150,55%,78%))}

/* 首屏「更多」：虚线空框，和前 6 个实心彩色块区分开 */
.tags .t-more{background:none; border:1.4px dashed var(--thread-l); color:var(--ink3); box-shadow:none}
.tags .t-more:hover{background:rgba(138,116,88,.07); border-color:var(--thread); color:var(--ink2)}
.enter{
  display:flex; align-items:center; justify-content:center; gap:12px; width:fit-content; margin:32px auto 0;
  padding:14px 30px; border-radius:99px; background:var(--ink); color:var(--cloth);
  font-family:var(--round); font-size:15.5px; font-weight:700; letter-spacing:.1em;
  box-shadow:0 6px 0 var(--ink-d),0 16px 26px -14px rgba(55,47,36,.85); transition:.16s;
}
.enter:hover{transform:translateY(3px); box-shadow:0 3px 0 var(--ink-d),0 10px 18px -14px rgba(55,47,36,.85); background:var(--brick)}
.tip{
  position:absolute; bottom:5vh; left:50%; transform:translateX(-50%);
  font-family:var(--round); font-size:12px; letter-spacing:.18em; color:var(--ink3);
}
/* 正文 */
#main{scroll-margin-top:93px}
.wrap{max-width:1080px; min-height:52vh; margin:0 auto; padding:14px clamp(16px,4vw,44px) 60px}
/* 顶部导航：吸顶，白条宽度 = 正文卡片宽度，四周圆角 */
.topnav{
  position:sticky; top:14px; z-index:40;
  width:100%;
  margin:0 auto 20px;
  padding:13px 22px;
  border-radius:14px;
  background:rgba(253,250,241,.97); backdrop-filter:blur(12px);
  box-shadow:0 1px 0 rgba(160,132,96,.45), 0 10px 24px -18px rgba(70,50,25,.55);
}
.topnav .inner{
  display:flex; align-items:center; gap:20px; position:relative;
}
/* 导航条底部一条缝线 */
.topnav .inner::after{
  content:""; position:absolute; left:2px; right:2px;
  bottom:-6px; height:1.5px;
  background:repeating-linear-gradient(90deg,var(--thread) 0 6px,transparent 6px 12px); opacity:.35;
}
.topnav .lg{display:flex; align-items:center; gap:10px; font-family:var(--round); font-weight:700; font-size:18px; color:var(--ink); transition:.18s}
.topnav .lg-ico{width:24px; height:24px; border-radius:5px; object-fit:contain; display:block; flex:0 0 auto}
/* 文字行高收到 1，行框与字号等高，图标和标题才真正居中对齐 */
.topnav .lg span{line-height:1; display:block}
.topnav .lg:hover{color:var(--brick)}
.topnav nav{display:flex; gap:18px; margin-left:auto; font-family:var(--round); font-size:14px; font-weight:600; color:var(--ink3)}
.topnav nav a:hover,.topnav nav a.on{color:var(--ink)}
.topnav nav a.on{border-bottom:2px dashed var(--brick); padding-bottom:2px}
/* 搜索按钮 */
.topnav .search{
  display:inline-flex; align-items:center; justify-content:center;
  width:27px; height:27px; border-radius:50%; margin-left:2px;
  border:1px solid var(--thread-l); color:var(--ink3);
  box-shadow:0 1px 0 rgba(160,132,96,.18); transition:.18s;
}
.topnav .search svg{width:13px; height:13px; display:block}
.topnav .search:hover{
  background:var(--cloth2); color:var(--ink); border-color:var(--thread);
  transform:translateY(-1px); box-shadow:0 3px 8px -4px rgba(70,50,25,.5);
}
/* 搜索框：展开后与导航条完全同宽同高 */
.searchbox{
  position:absolute; inset:-13px -22px; z-index:5;
  display:flex; align-items:center; gap:12px;
  padding:13px 22px; border-radius:14px;
  background:rgba(253,250,241,.995);
  opacity:0; visibility:hidden; transform:translateY(-4px);
  transition:opacity .18s ease, transform .18s ease, visibility .18s;
}
.searchbox.open{opacity:1; visibility:visible; transform:none}
.searchbox .si{width:16px; height:16px; flex:0 0 auto; color:var(--ink3)}
.searchbox input{
  flex:1; min-width:0; border:0; outline:none; background:none;
  border-bottom:1.5px dashed var(--thread-l);
  font-family:var(--sans); font-size:14.5px; color:var(--ink);
  padding:7px 2px; letter-spacing:.01em; text-align:center;
}
.searchbox input::placeholder{color:var(--ink4)}
.searchbox input::-webkit-search-cancel-button{display:none}
.searchbox .close{
  flex:0 0 auto; width:28px; height:28px; border-radius:50%;
  border:1px solid var(--thread-l); background:none; color:var(--ink3);
  font-size:12px; line-height:1; cursor:pointer; transition:.18s;
}
.searchbox .close:hover{background:var(--cloth2); color:var(--ink); border-color:var(--thread)}
.searchbox .go{
  flex:0 0 auto; height:28px; padding:0 15px; border:none; border-radius:14px;
  background:var(--brick); color:#fffdf8; font-family:var(--round); font-size:12.5px; font-weight:700;
  letter-spacing:.04em; cursor:pointer; transition:.18s;
}
.searchbox .go:hover{background:#9c4a36}
.grid{display:grid; grid-template-columns:minmax(0,1fr) 272px; gap:20px; align-items:start}
/* 文章页单栏：隐藏侧栏后正文占满整个内容宽度 */
.grid.single{grid-template-columns:minmax(0,1fr)}
/* 单栏时侧栏在桌面收起，移动端仍留在抽屉里 */
.grid.single .aside{display:none}
.grid > *{min-width:0}
.grid.single .cover{max-height:520px; object-fit:cover}
.sechead{
  display:flex; align-items:center; gap:12px; font-family:var(--round); font-size:15px; font-weight:700;
  letter-spacing:.2em; color:var(--ink); text-transform:uppercase; margin:0 0 16px;
}
.sechead::after{content:""; flex:1; height:1.6px; background:repeating-linear-gradient(90deg,var(--thread) 0 7px,transparent 7px 13px); opacity:.55}
/* 卡片 */
.card{
  position:relative; background:var(--cloth); border-radius:4px; padding:22px 24px; margin-bottom:18px;
  box-shadow:var(--lift); transition:.24s; transform:rotate(var(--tilt,-.3deg));
}
article.card:nth-of-type(even){--tilt:.35deg}
article.card:nth-of-type(3n){--tilt:-.45deg}
.card::before{
  content:""; position:absolute; inset:8px; border:1.5px dashed var(--thread-l);
  border-radius:2px; pointer-events:none;
}
.card::after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.8),inset 0 -3px 8px -5px rgba(120,95,60,.2);
}
.card:hover{transform:rotate(0) translateY(-4px); box-shadow:var(--lift-hi)}
.lead{padding:0; overflow:hidden; border-radius:18px; background:var(--cloth)}
.lead::before{border-radius:11px}
.lead .head{
  display:flex; align-items:center; gap:11px; padding:13px 26px; background:linear-gradient(90deg,var(--brick),#c26b53); color:#fff8ee;
  font-family:var(--round); font-size:13px; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  position:relative; z-index:2;
}
.lead .head::after{
  content:""; position:absolute; inset:0;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.12) 0 2px,transparent 2px 14px);
  pointer-events:none;
}
.lead .bd{padding:26px 28px 24px; position:relative; z-index:2}
.lead h2{
  font-family:var(--round); font-size:clamp(21px,2.9vw,30px); font-weight:700; line-height:1.42;
  letter-spacing:.01em; overflow-wrap:break-word;
}
.lead h2 a:hover{color:var(--brick)}
.lead p{color:var(--ink2); font-size:15px; margin-top:13px; max-width:56ch; line-height:2.05; font-weight:400; overflow-wrap:break-word}
.meta{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:20px; padding-top:15px;
  border-top:1.5px dashed var(--thread-l); font-size:12px; color:var(--ink3); letter-spacing:.08em;
  position:relative; z-index:2;
}
/* 分类胶囊：大卡片和文章页共用尺寸与截断，只有圆角、字号各自微调 */
.meta .tg, .pmeta .tg{
  font-family:var(--round); font-size:11px; font-weight:700;
  padding:2px 10px 2px 8px; max-width:140px; overflow:hidden;
}
.meta .tg > span, .pmeta .tg > span{
  min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.meta .tg{border-radius:7px}
.meta .go{margin-left:auto; color:var(--brick); font-family:var(--round); font-weight:700}
.meta .go:hover{text-decoration:underline; text-underline-offset:4px}
.item{display:grid; grid-template-columns:62px 1fr; gap:14px; align-items:center}
.item .d{font-family:var(--round); font-size:13px; color:var(--ink2); line-height:1.9; padding-top:3px; font-weight:600; text-align:center}
.item .d span{display:block}
/* 分类名优先折行，最多两行，仍放不下才省略 */
.item .d b{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  max-width:100%; overflow:hidden; white-space:normal; word-break:break-word;
  color:var(--cline, hsl(150,55%,70%));
  font-size:11.5px; letter-spacing:.12em; line-height:1.45; margin:10px 0 2px;
}
.item h3{font-family:var(--round); font-size:17px; font-weight:700; line-height:1.48}
.item h3 a:hover{color:var(--brick)}
.item p{color:var(--ink3); font-size:14px; margin-top:7px; font-weight:400; line-height:1.8}
.aside{display:grid; gap:14px; min-width:0}
.box{
  position:relative; background:var(--cloth); border-radius:var(--r); padding:20px 22px;
  box-shadow:var(--lift); min-width:0;
}
.box::before{content:""; position:absolute; inset:8px; border:1.4px dashed var(--thread-l); border-radius:calc(var(--r) - 7px); pointer-events:none; opacity:.85}
.box > *{position:relative; z-index:2}
.box h4{
  font-family:var(--round); font-size:12.5px; font-weight:700; letter-spacing:.18em; color:var(--ink);
  text-transform:uppercase; margin-bottom:10px; display:flex; align-items:center; gap:9px;
}
/* 分类标题到首项比其它分区略紧 */
.box h4:has(+ .cats){margin-bottom:6px}
.box h4::after{content:""; flex:1; height:1.5px; background:repeating-linear-gradient(90deg,var(--thread) 0 5px,transparent 5px 11px); opacity:.5}
.who{text-align:center}
.who .av{
  width:74px;height:74px;margin:4px auto 14px;border-radius:50%; overflow:hidden;
  background:var(--sage-grad);
  box-shadow:0 0 0 4px var(--cloth),0 0 0 6px rgba(138,116,88,.3),0 8px 16px -10px rgba(70,50,25,.6);
}
.who .av img{width:100%;height:100%;object-fit:cover;display:block}
.who .nm{font-family:var(--round); font-size:18px; font-weight:700}
.who .bio{font-size:12px; line-height:1.5; color:var(--ink3); margin-top:2px}
.who .st{display:flex; justify-content:space-around; margin-top:5px; padding-top:15px; border-top:1.5px dashed var(--thread-l)}
.who:has(.bio:not(:empty)) .st{margin-top:12px}   /* 简介确实有内容时才拉开间距 */
.who .st b{font-family:var(--round); font-size:19px; font-weight:700; display:block; line-height:1.2}
.who .st div:nth-child(1) b{color:var(--brick)}
.who .st div:nth-child(2) b{color:var(--sage-d)}
.who .st div:nth-child(3) b{color:var(--mustard-d)}
.who .st span{font-size:9.5px; letter-spacing:.16em; color:var(--ink3)}
.kv{display:grid; gap:11px; font-size:13.5px; min-width:0}
.kv div{display:flex; align-items:baseline; gap:9px; color:var(--ink2); line-height:1.5; min-width:0}
.kv i{flex:0 0 auto; font-style:normal; font-family:var(--round); font-weight:700; font-size:11.5px; color:var(--brick); padding-top:2px}
.kv a{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.kv em{flex:0 0 auto; font-style:normal; font-family:var(--round); font-size:10.5px; color:var(--ink4)}
.kv a:hover{color:var(--brick)}
.cloud{display:flex; flex-wrap:wrap; gap:8px}
/* 最新评论 */
.cmts div{padding:9px 0; border-bottom:1px dashed var(--thread-l); min-width:0}
.cmts div:first-child{padding-top:1px}
.cmts div:last-child{border-bottom:0; padding-bottom:0}
.cmts p{
  color:var(--ink2); font-size:12.5px; line-height:1.6; overflow-wrap:anywhere;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.cmts p b{font-family:var(--round); font-weight:600; color:var(--ink); margin-right:5px}
.cmts a{display:block; margin-top:2px; font-size:10.5px; color:var(--ink3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cmts a:hover{color:var(--brick)}
.cmts-empty{margin:2px 0 0; font-size:12.5px; line-height:1.8; color:var(--ink4)}
/* 分类列表 */
.cats{display:grid; gap:8px}
.cats a{
  display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--ink2);
  transition:.18s; padding:1px 0; min-width:0;
}
/* 分类名过长时省略，不撑破侧栏 */
.cats .c-name{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:inherit}
.cats a:hover{color:var(--ink); transform:translateX(2px)}
.cats i{width:8px; height:8px; border-radius:50%; flex:0 0 auto; transition:.18s; opacity:.9}
.cats a:hover i{transform:scale(1.3); opacity:1}
.cats span{flex:0 0 auto; margin-left:auto; font-family:var(--round); font-size:11.5px; font-weight:600; color:var(--ink4)}
/* 标签：侧栏和文章尾共用同一套样式 */
.cloud a, .ptags a{
  display:inline-block; font-size:11.5px; font-weight:600; padding:4px 11px; border-radius:7px;
  color:#463c30; border:1px solid rgba(255,255,255,.4); box-shadow:0 2px 5px -3px rgba(70,50,25,.6);
  text-decoration:none; transition:.18s;
}
/* 标签不参与收缩，长了就换行，不会被压成看不见 */
.ptags a{flex:0 0 auto; max-width:100%; word-break:break-word}
.cloud a:hover, .ptags a:hover{transform:translateY(-2px) rotate(-2deg)}
.cloud a{flex:0 0 auto; max-width:100%; word-break:break-word}
/* 列表折叠：超出的先隐藏，点「展开全部」再显示 */
.cats.limited a:nth-child(n+9){display:none}
.cats.expanded a:nth-child(n+9){display:flex}
.cloud.limited a:nth-child(n+13){display:none}
.cloud.expanded a:nth-child(n+13){display:inline-block}
.list-more{
  display:block; margin-top:9px; padding:0; border:0; background:none; cursor:pointer;
  font-family:var(--round); font-size:11px; font-weight:600; letter-spacing:.04em; color:var(--ink4);
  transition:.18s;
}
.list-more:hover{color:var(--brick)}
.scrap{
  background:linear-gradient(160deg,#e7c69b,#dfb87e); border-radius:12px; padding:17px 19px; transform:rotate(-1.6deg);
  font-family:var(--round); font-size:16px; font-weight:700; color:var(--mustard-ink); line-height:1.55;
  box-shadow:0 12px 22px -14px rgba(70,50,25,.85); border:1px solid rgba(255,255,255,.35);
  min-width:0; overflow-wrap:anywhere;
  transition:transform .24s, box-shadow .24s;
}
/* 和文章卡片一致：鼠标进入时摆正并轻轻抬起 */
.scrap:hover{transform:rotate(0) translateY(-3px); box-shadow:0 18px 30px -18px rgba(70,50,25,.9)}
.scrap-t{display:block}
.scrap-t.is-loading{opacity:.5; font-weight:600; letter-spacing:.06em}
.scrap-d{display:block; margin-top:9px; font-size:10.5px; font-weight:600; letter-spacing:.08em; opacity:.55; text-align:right}
.foot{
  margin-top:24px; padding-top:16px;
  border-top:1.6px dashed var(--thread-l);
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;
  font-size:11.5px; color:var(--ink3); letter-spacing:.1em;
}
.uptime{font-variant-numeric:tabular-nums}
.foot a{transition:color .18s}
.foot a:hover{color:var(--brick); text-decoration:underline; text-underline-offset:2px}
/* 移动端侧栏按钮 + 抽屉 */
.fp-menu-btn{display:none; flex:0 0 auto; align-items:center; justify-content:center; width:28px; height:28px; margin-right:2px; padding:0; border:1px solid var(--thread-l); border-radius:8px; background:var(--cloth2); color:var(--ink3); cursor:pointer; transition:.18s}
.fp-menu-btn:hover{color:var(--ink); border-color:var(--thread)}
.fp-menu-btn svg{width:14px; height:14px; display:block}
.fp-navbox{display:none}
.fp-navbox .blog-header-nav{display:block}
.fp-navbox .nav-list{display:flex; flex-direction:column; gap:0; list-style:none; margin:0; padding:0}
.fp-navbox .nav-link{display:block; padding:8px 2px; font-family:var(--round); font-size:14px; font-weight:600; color:var(--ink3); text-decoration:none; border-bottom:1px dashed rgba(138,116,88,.14); transition:.15s}
.fp-navbox .list-item:last-child .nav-link{border-bottom:0}
.fp-navbox .nav-link:hover{color:var(--brick)}
.fp-navbox .dropdown-menus{display:block; position:static; padding:0 0 6px 12px; border:0; background:none; box-shadow:none; min-width:0}
.fp-navbox .dropdown-menus .nav-link{padding:6px 2px; font-size:13px; border-bottom:0; color:var(--ink4)}
.fp-drawer-mask{position:fixed; inset:0; z-index:299; background:rgba(45,39,31,.38); opacity:0; visibility:hidden; transition:opacity .24s, visibility .24s}
.fp-drawer-mask.is-on{opacity:1; visibility:visible}

@media (max-width:900px){
  /* 手机端导航条元素间距减半，汉堡按钮不至于离站名太远 */
  .topnav .inner{gap:9px}
  .fp-menu-btn{display:inline-flex}
  .fp-navbox{display:block}
  .grid{grid-template-columns:1fr}
  .grid.single .aside{display:block}
  .aside{position:fixed; top:0; left:0; bottom:0; z-index:300; display:block; width:300px; padding:calc(16px + env(safe-area-inset-top)) 14px calc(28px + env(safe-area-inset-bottom)); overflow-y:auto; background:var(--linen); transform:translateX(-100%); transition:transform .26s cubic-bezier(.4,0,.2,1); gap:0}
  /* 阴影只在抽屉拉出时出现，收起时不会在屏幕左边留一条 */
  .aside.is-open{transform:translateX(0); box-shadow:8px 0 30px -14px rgba(55,47,36,.45)}
  .aside .box{margin-bottom:13px}
  .aside .box:last-child{margin-bottom:0}
  .item{grid-template-columns:1fr;gap:6px}
  /* 窄屏日期与分类排成一行，不占三行高度 */
  .meta{gap:8px 10px}
  .item .d{display:flex; align-items:center; flex-wrap:nowrap; gap:2px 8px; padding-top:0; line-height:1.4; min-width:0}
  .item .d span{display:inline; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  /* 分类名最多占一半，再长就省略，日期那一半不被挤 */
  .item .d b{display:block; margin:0 0 0 auto; flex:0 1 auto; min-width:0; max-width:50%; text-align:right;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  .item .d > span{flex:0 0 auto}
  .topnav nav{display:none}
  .topnav .search{margin-left:auto}
  .topnav .lg{min-width:0}
  .topnav .lg span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  .patch-main{transform:none}
  /* 篇数块在手机上保留，尺寸缩一号 */
  .p-fog{min-width:80px; height:64px; padding:0 12px; right:-10px}
  .p-fog b{font-size:19px}
  .p-fog i{font-size:10.5px}
}
@media (max-width:640px){
  /* 页脚在手机上竖排居中 */
  .foot{flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:7px}
  .foot .fl{display:flex; flex-direction:column; align-items:center; gap:5px}
  .foot .fl .sep{display:none}
  .foot .fr{justify-content:center}
  .hero{padding:6vh 16px 9vh}
  .patch-main{padding:54px 22px 48px}
  .patch{border-radius:8px}
  .p-sage{width:78px;height:62px;top:-16px;left:-6px;font-size:10px;letter-spacing:.1em}
  .p-mustard{width:70px;height:56px;bottom:-14px;right:-6px;font-size:10px;letter-spacing:.1em}
  .eyebrow{font-size:10px;letter-spacing:.24em}
  .enter{margin-top:34px}
}
/* emlog 菜单适配 */
.topnav nav .blog-header-nav{display:flex}
.topnav nav .nav-list{display:flex; align-items:center; gap:16px; list-style:none; margin:0; padding:0}
.topnav nav .list-item{position:relative}
.topnav nav .nav-link{display:inline-block; padding:4px 0; color:var(--ink3); font-family:var(--round); font-size:14px; font-weight:600; text-decoration:none; white-space:nowrap; transition:.18s}
.topnav nav .nav-link:hover{color:var(--ink)}
.topnav nav .nav-link[aria-current="page"], .topnav nav .nav-link.on{color:var(--ink); border-bottom:2px dashed var(--brick); padding-bottom:2px}
.topnav nav .has-down::after{content:"⌄"; margin-left:3px; font-size:11px; opacity:.55}
.topnav nav .dropdown-menus{display:none; position:absolute; top:100%; left:0; min-width:134px; padding:8px; list-style:none; background:var(--cloth); border:1px solid var(--thread-l); border-radius:12px; box-shadow:0 16px 32px -20px rgba(55,47,36,.55); z-index:30}
.topnav nav .list-item:hover .dropdown-menus{display:block}
.topnav nav .dropdown-menus .nav-link{display:block; padding:7px 10px; border-radius:8px}
.topnav nav .dropdown-menus .nav-link:hover{background:var(--cloth2)}
.topnav nav .user-menu .nav-link{display:flex; align-items:center; gap:6px}
.topnav nav .header-avatar{width:24px; height:24px; border-radius:50%; object-fit:cover}
.topnav nav .user-menu-label{font-size:13px}

/* 列表页 */
.empty{padding:46px 0; text-align:center; color:var(--ink4); font-size:14px}

/* 分页（核心 pagination 输出） */
/* 分页：文章列表与评论区共用一套外观 */
:is(.pager, #pagenavi){display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:7px}
.pager{margin:26px 0 0}
:is(.pager, #pagenavi) a, :is(.pager, #pagenavi) span, :is(.pager, #pagenavi) em{display:inline-flex; align-items:center; justify-content:center; min-width:36px; height:36px; padding:0 12px; border-radius:9px; font-family:var(--round); font-size:13px; font-style:normal; text-decoration:none; transition:.18s}
:is(.pager, #pagenavi) a{background:var(--cloth); color:var(--ink2); border:1px solid var(--thread-l); box-shadow:0 2px 5px -3px rgba(55,47,36,.3)}
:is(.pager, #pagenavi) a:hover{background:#fff; color:var(--ink); border-color:var(--thread); transform:translateY(-1px)}
:is(.pager, #pagenavi) .pg-jump{flex:0 0 auto; display:inline-flex; align-items:center; gap:4px; margin-left:6px; min-width:0; height:auto; padding:0; background:none; border:0; box-shadow:none; border-radius:0}
:is(.pager, #pagenavi) .pg-jump input{width:50px; height:36px; padding:0 8px; text-align:center; font-family:var(--round); font-size:13px; color:var(--ink); background:var(--cloth); border:1px solid var(--thread-l); border-radius:9px; outline:none; -moz-appearance:textfield}
:is(.pager, #pagenavi) .pg-jump input::-webkit-outer-spin-button,
:is(.pager, #pagenavi) .pg-jump input::-webkit-inner-spin-button{-webkit-appearance:none; margin:0}
:is(.pager, #pagenavi) .pg-jump input:focus{border-color:var(--thread)}
:is(.pager, #pagenavi) .pg-jump button{width:34px; height:36px; padding:0; font-family:var(--round); font-size:13px; color:var(--ink2); background:var(--cloth); border:1px solid var(--thread-l); border-radius:9px; cursor:pointer; box-shadow:0 2px 5px -3px rgba(55,47,36,.3); transition:.18s}
:is(.pager, #pagenavi) .pg-jump button:hover{background:#fff; color:var(--ink); border-color:var(--thread); transform:translateY(-1px)}
:is(.pager, #pagenavi) .pg-off{background:transparent; color:var(--ink4); border:1px dashed rgba(138,116,88,.28); box-shadow:none; opacity:.55; cursor:default}
:is(.pager, #pagenavi) > span:not([class]){background:var(--brick); color:#fff; border:1px solid var(--brick); box-shadow:0 3px 8px -4px rgba(176,90,68,.7)}
:is(.pager, #pagenavi) em{min-width:16px; padding:0; color:var(--ink4); background:none; border:none}

/* 详情页 */

.paper{position:relative; border:1px solid var(--thread-l); border-radius:var(--r); padding:clamp(18px,2.2vw,26px) clamp(26px,4vw,46px); box-shadow:var(--lift);
  /* 奶白纸面 + 一层几乎看不见的交叉织纹 */
  background-color:var(--cloth);
  background-image:
    repeating-linear-gradient(45deg,rgba(120,100,70,.028) 0 1px,transparent 1px 6px),
    repeating-linear-gradient(-45deg,rgba(120,100,70,.028) 0 1px,transparent 1px 6px)}
/* 独立页面没有 .pmeta，标题就是卡片里第一个元素，去掉多余上边距 */
.paper > h1:first-child{margin-top:0}
.post h1{margin:22px 0 0; font-family:var(--round); font-size:clamp(27px,3.9vw,40px); line-height:1.32; letter-spacing:-.005em; color:var(--ink); text-wrap:balance}
.pmeta{display:flex; flex-wrap:wrap; align-items:center; gap:10px; font-family:var(--round); font-size:12px; color:var(--ink4); padding-bottom:17px; border-bottom:1px dashed rgba(138,116,88,.26)}
.pmeta .tg{border-radius:6px; font-size:11.5px; letter-spacing:.04em}
.pmeta a{color:var(--brick); text-decoration:none}
/* 标题下的一道短色带，给正文起手一个节奏 */
.title-rule{width:76px; height:3px; border-radius:2px; margin:18px 0 0; background:linear-gradient(90deg,var(--brick),rgba(176,90,68,0))}
.cover{width:100%; height:auto; border-radius:14px; margin:22px 0 4px; box-shadow:0 12px 26px -20px rgba(55,47,36,.6)}

/* 正文排版 */
.prose{margin-top:22px; font-size:16.5px; line-height:1.95; color:var(--ink2); word-break:break-word}
.prose > *:first-child{margin-top:0}
.prose > *:last-child{margin-bottom:0}
.prose p{margin:1.15em 0}
.prose h2, .prose h3, .prose h4{margin:1.9em 0 .7em; color:var(--ink); font-family:var(--round); line-height:1.45}
.prose h2{font-size:23px; position:relative; padding-left:14px}
.prose h2::before{content:""; position:absolute; left:0; top:.42em; bottom:.42em; width:3px; border-radius:3px; background:var(--sage)}
.prose h3{font-size:19px}
.prose h4{font-size:17px}
.prose h5{margin:1.5em 0 .5em; font-size:16px; color:var(--ink); line-height:1.5}
.prose h6{margin:1.4em 0 .5em; font-size:15px; color:var(--ink2); line-height:1.5; letter-spacing:.02em}
.prose a{color:var(--brick); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px; text-decoration-color:rgba(176,90,68,.35)}
.prose a:hover{text-decoration-color:var(--brick)}
.prose img{max-width:100%; height:auto; border-radius:12px; margin:.6em 0; box-shadow:0 12px 26px -20px rgba(55,47,36,.65)}
.prose ul, .prose ol{margin:1em 0; padding-left:1.35em}
.prose li{margin:.32em 0}
.prose blockquote{margin:1.3em 0; padding:14px 18px; border-left:3px solid var(--mustard); border-radius:0 10px 10px 0; background:var(--cloth2); color:var(--ink3)}
.prose blockquote p{margin:.3em 0}
.prose code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace; font-size:.85em; padding:3px 6px; border-radius:6px; background:#f1f5f9; color:#ef4444; margin:0 2px}
.prose pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace; margin:1.5em 0; padding:18px; border-radius:12px; background:#1e293b; color:#f8fafc; overflow-x:auto; line-height:1.7; font-size:.9em; box-shadow:inset 0 0 10px rgba(0,0,0,.3)}
.prose pre code{padding:0; background:none; color:inherit; margin:0; border-radius:0; font-size:inherit}
/* 代码块卡片：苹果三圆点 + 语言标签 + 一键复制（1:1 复刻 lczld.cn） */
.prose .pn-code-card pre{margin:0; padding:17px 18px 19px; border-radius:0; background:transparent; box-shadow:none}
.pn-code-card{margin:1.5em 0; overflow:hidden; border:1px solid rgba(148,163,184,.18); border-radius:14px; background:#1e293b; box-shadow:0 14px 34px -24px rgba(15,23,42,.75)}
.pn-code-head{display:flex; align-items:center; gap:9px; padding:9px 13px; background:#172033; border-bottom:1px solid rgba(148,163,184,.14)}
.pn-code-dots{display:flex; align-items:center; gap:6px; flex:0 0 auto}
.pn-code-dots i{display:block; width:10px; height:10px; border-radius:50%; background:#ff5f57; box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.pn-code-dots i:nth-child(2){background:#febc2e}
.pn-code-dots i:nth-child(3){background:#28c840}
.pn-code-lang{margin-left:2px; font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; font-size:10px; font-weight:600; letter-spacing:.12em; color:#64748b}
.pn-code-copy{margin-left:auto; padding:4px 8px; border:0; border-radius:7px; background:transparent; color:#94a3b8; font-size:11px; font-weight:600; cursor:pointer; transition:color .18s ease, background-color .18s ease}
.pn-code-copy:hover{background:rgba(148,163,184,.14); color:#e2e8f0}
.pn-code-copy.is-copied{color:#34d399}
@media (hover:none){
  /* 触屏没有 hover，回复按钮直接常显 */
  .comment .com-reply{opacity:.7}
}
.prose hr{margin:2.2em 0; border:none; border-top:1.5px dashed rgba(138,116,88,.3)}
.prose table{width:100%; margin:1.3em 0; border-collapse:collapse; font-size:14.5px}
.prose th, .prose td{padding:9px 12px; border:1px solid rgba(138,116,88,.22); text-align:left}
.prose th{background:var(--cloth2); color:var(--ink); font-weight:600}
.prose iframe{max-width:100%; border-radius:12px}
.prose video, .prose audio{max-width:100%; border-radius:12px; margin:.6em 0}
.prose figure{margin:1.6em 0}
.prose figure img{margin:0}
.prose figcaption{margin-top:9px; font-size:12.5px; line-height:1.6; color:var(--ink4); text-align:center}
.prose .aligncenter{display:block; margin-left:auto; margin-right:auto}
.prose .alignright{float:right; margin:0 0 1em 1.4em}
.prose .alignleft{float:left; margin:0 1.4em 1em 0}
.prose::after{content:""; display:table; clear:both}
.paper .prose > :last-child{margin-bottom:0}
@media (max-width:640px){
  .prose{font-size:16px; line-height:1.9}
  .prose h2{font-size:21px}
  .prose h3{font-size:18px}
  .prose table{font-size:13px}
  .prose th, .prose td{padding:7px 9px}
  .prose .alignright, .prose .alignleft{float:none; margin:0 0 .8em}
}

/* 文章标签 */
.ptags{display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; padding-top:18px; border-top:1.5px dashed rgba(138,116,88,.28)}
/* 没有标签时：只留一条分隔虚线，不占高度 */
.ptags:empty{display:block; margin-top:26px; padding-top:0; height:0}
/* 文章尾标签沿用侧栏标签的样式 */

/* 上下篇 */
.neighbor{display:flex; flex-wrap:wrap; gap:12px; margin:10px 0 0}
.neighbor > span{flex:0 1 auto; max-width:calc(50% - 6px); min-width:0}
.neighbor > span > a{display:flex; align-items:baseline; gap:5px; padding:13px 18px; background:var(--cloth); border:1px solid var(--thread-l); border-radius:12px; color:var(--ink2); font-family:var(--round); font-size:13.5px; text-decoration:none; box-shadow:var(--lift); transition:.18s; overflow:hidden}
.neighbor .prev-log{margin-right:auto}
.neighbor .next-log{margin-left:auto}
.neighbor .neighbor-dir{flex:0 0 auto}
.neighbor .neighbor-title{flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.neighbor a:hover{color:var(--ink); border-color:var(--thread); transform:translateY(-1px)}

/* 正文图片放大 */
.prose img.is-zoomable{cursor:zoom-in}
.fp-lightbox{position:fixed; inset:0; z-index:9999; display:none; align-items:center; justify-content:center; padding:4vw; background:rgba(28,24,19,.93); cursor:zoom-out}
.fp-lightbox.is-on{display:flex; animation:fpLbIn .22s ease-out}
.fp-lightbox img{max-width:100%; max-height:100%; border-radius:8px; box-shadow:0 24px 70px -24px rgba(0,0,0,.7); will-change:transform; user-select:none; -webkit-user-drag:none}
.fp-lb-tip{position:absolute; left:50%; bottom:20px; transform:translateX(-50%); padding:6px 15px; border-radius:20px; background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.12); font-family:var(--round); font-size:11.5px; letter-spacing:.02em; color:rgba(253,250,241,.72); white-space:nowrap; pointer-events:none; user-select:none}
@keyframes fpLbIn{from{opacity:0}to{opacity:1}}

/* 评论 */
.comments{
  /* 上下留白一致，比左右略紧：标题不离顶边太远，底部也不拖一条空白 */
  margin-top:10px; padding:22px clamp(20px,3vw,30px);
  background:var(--cloth); border:1px solid var(--thread-l);
  border-radius:var(--r); box-shadow:var(--lift);
}
.comments > h3{font-family:var(--round); font-size:17px; color:var(--ink); margin-bottom:14px}
.comments > h3 span{margin-left:4px; font-size:13px; color:var(--ink4)}

/* 评论锚点：跳转时避开吸顶导航，并短暂高亮刚发的那条 */
.comment, .comment-child{scroll-margin-top:88px}
/* 刚发布/刚回复的那条：正文整块上暖黄底色，两秒渐退 */
.comment-content.is-new, .cc-line.is-new{
  animation:fpFlash 2s ease-out; border-radius:5px; padding:2px 5px;
}
.comment-content.is-new{display:block; margin:0 -5px}
@keyframes fpFlash{
  0%{background:rgba(217,165,102,.45)}
  65%{background:rgba(217,165,102,.16)}
  100%{background:transparent}
}

/* 主评论：紧凑排版 */
.comment{display:flex; flex-wrap:wrap; gap:9px; padding:10px 0; border-bottom:1px dashed rgba(138,116,88,.16)}
.comment:last-child{border-bottom:0; padding-bottom:0}
.comment > .avatar{flex:0 0 auto}
.comment .avatar img{width:30px; height:30px; border-radius:50%; object-fit:cover; box-shadow:0 1px 3px -2px rgba(55,47,36,.35)}
.comment .comment-infos{flex:1 1 auto; min-width:0}
.cc-name{font-family:var(--round); font-size:13px; font-weight:700; line-height:1.35; color:var(--ink)}
.comment-meta{display:flex; align-items:center; margin-top:1px; font-family:var(--round); font-size:10.5px; line-height:1.4; color:var(--ink4); letter-spacing:.01em}
.comment .comment-content{margin-top:5px; font-size:13.8px; line-height:1.62; color:var(--ink2); word-break:break-word; max-height:112px; max-height:calc(5lh); overflow-y:auto; overscroll-behavior:contain}
.comment .comment-content::-webkit-scrollbar{width:5px}
.comment .comment-content::-webkit-scrollbar-thumb{background:rgba(138,116,88,.24); border-radius:3px}
.comment .comment-content::-webkit-scrollbar-thumb:hover{background:rgba(138,116,88,.4)}

/* 回复区：浅底块，行距压紧 */
.comment-replies{flex:0 0 100%; width:100%; margin-top:5px; padding:9px 11px; background:rgba(159,176,150,.11); border-radius:9px}
.comment-child{padding:6px 0; border-bottom:1px dashed rgba(138,116,88,.1)}
.comment-child:first-child{padding-top:0}
.comment-child:last-child{padding-bottom:0; border-bottom:0}
/* 回复内容同样只露五行，超出在块内滚动 */
.cc-line{font-size:13px; line-height:1.55; color:var(--ink2); word-break:break-word; max-height:101px; max-height:calc(5lh); overflow-y:auto; overscroll-behavior:contain}
.cc-line::-webkit-scrollbar{width:4px}
.cc-line::-webkit-scrollbar-thumb{background:rgba(138,116,88,.22); border-radius:2px}
.cc-line::-webkit-scrollbar-thumb:hover{background:rgba(138,116,88,.38)}
.comment-child .cc-name{color:var(--brick); font-size:12.5px}
.cc-reply-to{margin:0 1px 0 3px; font-size:12px; font-weight:400; color:var(--ink3)}
.cc-sep{color:var(--ink4); margin-right:1px}
.cc-text{color:var(--ink2)}

/* 超过 5 条的回复折叠 */
.comment-child.cc-folded{display:none}
.comment-replies.is-open .comment-child.cc-folded{display:block}
.cc-toggle{display:block; width:100%; margin-top:2px; padding:6px 0 1px; white-space:nowrap; border:0; border-top:1px dashed rgba(138,116,88,.12); background:none; font-family:var(--round); font-size:11.5px; line-height:1.5; color:var(--ink3); text-align:center; cursor:pointer; transition:.15s}
.cc-toggle:hover{color:var(--brick)}

/* 回复按钮并入 meta 行，不单独占一行 */
.comment .com-reply{border:none; background:none; padding:0; margin-left:7px; font-family:var(--round); font-size:10.5px; line-height:1.4; color:var(--ink4); opacity:0; cursor:pointer; transition:.15s}
.comment:hover .com-reply, .comment .com-reply:focus-visible{opacity:.9}
.comment .com-reply:hover{color:var(--brick); opacity:1}

/* 评论分页：跟主分页同一套视觉 */
#pagenavi{margin:20px 0 8px}
/* 评论表单在列表上方 */
.comments, .comment-post, .commentform{scroll-margin-top:80px}
.comments .comment-post{margin-bottom:12px; padding-bottom:18px; border-bottom:1px dashed rgba(138,116,88,.24)}

.commentform{display:flex; flex-direction:column; gap:12px; margin-top:6px}
.commentform textarea, .commentform input[type=text], .commentform input[type=email], .commentform input[type=url], .commentform .captcha_input{width:100%; height:44px; padding:0 14px; font-family:inherit; font-size:14px; color:var(--ink); background:var(--cloth); border:1px solid var(--thread-l); border-radius:10px; outline:none; transition:.18s}
.commentform textarea{height:128px; height:calc(5lh + 26px); min-height:128px; min-height:calc(5lh + 26px); padding:12px 14px; resize:vertical; line-height:1.8}
.commentform textarea:focus, .commentform input:focus{border-color:var(--sage); box-shadow:0 0 0 3px rgba(159,176,150,.18)}
.commentform textarea::placeholder, .commentform input::placeholder{color:var(--ink4)}
.comment-info{display:flex; flex-wrap:wrap; align-items:center; gap:10px}
.comment-info input{flex:1; min-width:150px}
.com_submit_p{display:flex; align-items:center; gap:10px}
.commentform .btn{padding:10px 22px; border:none; border-radius:10px; background:var(--ink); color:var(--cloth); font-family:var(--round); font-size:13.5px; font-weight:600; cursor:pointer; transition:.18s; box-shadow:0 6px 14px -8px rgba(55,47,36,.8)}
.commentform .btn:hover{background:var(--brick)}
.commentform .cancel-reply{display:none}
/* 提交行：左边显示「回复 @谁」，右边按钮 */
.commentform .form-actions{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:2px}
.commentform .com_submit_p{display:flex; align-items:center; justify-content:flex-end; gap:10px; margin-left:auto}
.reply-hint{display:none; font-family:var(--round); font-size:12px; color:var(--brick); min-width:0}
.reply-hint.is-on{display:inline-flex; align-items:center; gap:5px; max-width:60%; padding:4px 10px; border-radius:7px; background:rgba(176,90,68,.1); border:1px solid rgba(176,90,68,.22); font-weight:600; letter-spacing:.01em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.reply-hint.is-on::before{content:"↩"; font-size:13px; line-height:1; opacity:.85}
.captcha-container{display:flex; align-items:center; gap:10px}
.captcha-container .captcha_input{order:1; flex:0 1 210px; width:auto; min-width:120px; max-width:210px}
.captcha-container .captcha{order:2; flex:0 0 auto; height:44px; width:auto; border:0; padding:0; background:none; object-fit:contain; cursor:pointer; transition:opacity .18s}
.captcha-container .captcha:hover{opacity:.78}

/* 404 */
.nf{padding:15vh 20px 17vh; text-align:center}
.nf-num{font-family:var(--round); font-size:clamp(64px,12vw,118px); font-weight:700; line-height:1; letter-spacing:.02em; color:var(--ink); text-shadow:3px 3px 0 rgba(159,176,150,.35), 6px 6px 0 rgba(217,165,102,.18)}
.nf p{margin:22px 0 28px; font-size:15px; line-height:1.9; color:var(--ink3)}
.nf-btn{display:inline-block; padding:11px 26px; border-radius:11px; background:var(--ink); color:var(--cloth); font-family:var(--round); font-size:14px; font-weight:600; text-decoration:none; box-shadow:0 4px 0 var(--ink-d); transition:.18s}
.nf-btn:hover{transform:translateY(2px); box-shadow:0 2px 0 var(--ink-d); background:var(--brick)}

/* 手机端分类标签：固定两行、每行均分，放不下时文字自行省略 */
@media (max-width:560px){
  /* 断点位置由 JS 计算后插入 .fp-break，两行均分 */
  .tags{
    display:flex; flex-wrap:wrap; justify-content:center;
    gap:10px 8px; margin-top:20px; overflow-x:clip;
  }
  .tags .fp-break{flex:0 0 100%; height:0; margin:0; padding:0; border:0; font-size:0}
  /* 允许收缩，收缩掉的是文字（span 内省略号），圆点和边框不受影响 */
  .tags > *{font-size:11px; padding:5px 8px; flex:0 1 auto; min-width:0}
}

/* 极窄屏（分屏/高倍缩放）：标签退回流式换行，装饰贴纸让位 */
@media (max-width:380px){
  .tags{
    display:flex; flex-wrap:wrap; justify-content:center;
    gap:8px 6px; margin-top:18px; padding:0 8px;
  }
  .tags > *{max-width:46vw}
  /* 缩小并贴边，保留布块但让开副标题 */
  .p-fog{right:-8px; transform:rotate(9deg) scale(.8)}
  .p-mustard{bottom:-16px; transform:rotate(6deg) scale(.82)}
}

/* =========================================================
   PatchNote 兼容层（主题自有功能，不影响克隆视觉）
   ========================================================= */
.pn-download-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 20px;
    border-radius: 99px;
    background: var(--ink);
    color: var(--cloth) !important;
    font-family: var(--round);
    font-weight: 700;
    font-size: 13.5px;
    border-bottom: 0 !important;
    box-shadow: 0 5px 0 var(--ink-d);
}

.pn-download-btn:hover { transform: translateY(2px); box-shadow: 0 3px 0 var(--ink-d); }

.lead .cover img { display: block; width: 100%; object-fit: cover; }


/* ============ 返回顶部 ============ */
.pn-backtop{
  position:fixed; right:18px; bottom:22px; z-index:80;
  width:44px; height:44px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--thread-l); border-radius:13px;
  background:rgba(253,250,241,.94); color:var(--ink2);
  box-shadow:var(--lift); cursor:pointer;
  opacity:0; transform:translateY(10px); pointer-events:none;
  transition:opacity .22s ease, transform .22s ease, color .18s ease, background-color .18s ease;
}
.pn-backtop.show{opacity:1; transform:translateY(0); pointer-events:auto}
.pn-backtop:hover{background:var(--cloth2); color:var(--brick); transform:translateY(-2px)}
.pn-backtop svg{width:20px; height:20px; display:block}

@media (max-width:640px){
  .pn-backtop{right:12px; bottom:16px}
}

@media (max-width:640px){
  .pn-code-head{padding:8px 11px}
  .pn-code-dots i{width:9px; height:9px}
  .prose .pn-code-card pre{padding:14px 14px 16px; font-size:.84em}
}
