@charset "utf-8";
/* ============================================================
   线报站主题 lineb v2 · 主样式
   结构：基础重置 → 布局骨架 → 顶栏 → 导航 → 搜索条 → 卡片
        → 列表项 → 卡头 → 侧栏 → 文章页 → 分页 → 页脚 → 移动端
   断点：默认 = 移动优先；≥1101px = 桌面双栏；≤768px = 手机细节
   ============================================================ */

/* ---------- 基础重置 ---------- */
*,::before,::after{box-sizing:border-box}
html{font-size:100%;overflow-y:scroll;-webkit-text-size-adjust:100%}
body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,figure,blockquote,pre,form,fieldset,legend,header,footer,nav,main,article,aside,section{margin:0;padding:0}
ul,ol{list-style:none}
img{max-width:100%;height:auto;border:0;vertical-align:middle}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:none}
table{border-collapse:collapse;border-spacing:0}
[hidden]{display:none!important}

html,body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--font);
  font-size:var(--fs-14);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

.container{max-width:var(--container);margin:0 auto;padding:0 16px}
@media (min-width:1101px){ .container{padding:0 24px} }

/* 通用间距工具 */
.mb{margin-bottom:16px}
@media (max-width:1100px){ .mb{margin-bottom:10px} }
.clear{clear:both}
.fl{float:left}
.fr{float:right}

/* ---------- 布局骨架 ---------- */
#content{min-height:66vh}
#content::after{content:"";display:block;clear:both}

@media (min-width:1101px){
  #content > .inner{
    display:flex;
    flex-wrap:wrap;
    align-items:flex-start;
    gap:0 24px;
  }
  #mainbox{flex:1 1 0%;min-width:0;width:auto;float:none}
  #sidebar{width:400px;flex:none;float:none;position:sticky;top:16px}
  #content.rank-page-wrap #mainbox{flex:1 1 100%}
}
@media (max-width:1100px){
  #content > .inner{display:block}
  #mainbox{width:100%}
  #sidebar{width:100%;position:static}
}

/* ---------- 卡片 ---------- */
.card{
  background:var(--surface);
  box-shadow:var(--shadow-ring-sm);
  border-radius:var(--radius-card);
  overflow:hidden;
}

/* ============================================================
   顶栏
   ============================================================ */
.header{
  position:relative;
  z-index:99;
  width:100%;
  background:var(--surface);
  border-bottom:1px solid var(--border);
  margin-bottom:16px;
}
.h-wrap{
  max-width:var(--container);
  margin:0 auto;
  padding:0 16px;
  display:flex;
  align-items:center;
  height:var(--header-h);
  gap:0;
}
@media (min-width:1101px){ .h-wrap{padding:0 24px} }
@media (max-width:1100px){
  .header{margin-bottom:0}
  .h-wrap{padding:0 0 0 14px}
}

/* logo */
.logo-area{flex:none;margin:0}
.xb-logo{
  display:inline-flex;align-items:center;gap:var(--logo-gap);
  text-decoration:none;-webkit-user-select:none;user-select:none;
  -webkit-tap-highlight-color:transparent;
}
.xb-logo__star{height:var(--logo-star-h);width:auto;display:block;flex:none}
.xb-logo__name{
  font-size:var(--logo-text-size);
  font-weight:700;
  line-height:1;
  color:var(--logo-ink);
  white-space:nowrap;
  letter-spacing:-.5px;
}

/* 顶栏右侧按钮组（登录 / 主题 / 搜索） */
.h-actions{display:flex;align-items:center;flex:none;margin-left:auto}
.h-btn{
  display:inline-flex;align-items:center;gap:7px;
  height:34px;padding:0 16px;
  border-radius:var(--radius-pill);
  background:var(--surface-2);
  color:var(--text);
  font-size:var(--fs-13);
  font-weight:500;
  line-height:1;
  white-space:nowrap;
  transition:background var(--dur-fast),color var(--dur-fast);
  -webkit-tap-highlight-color:transparent;
}
.h-btn:hover{background:var(--surface-hover)}
.h-btn + .h-btn{margin-left:8px}
.h-btn .xb-ic{font-size:16px;line-height:1;display:block}
.h-btn .lt{display:inline}

/* 移动端：三个按钮变纯图标 */
@media (max-width:1100px){
  .h-btn{
    width:40px;height:var(--header-h);
    padding:0;gap:0;
    background:transparent;
    border-radius:0;
    justify-content:center;
  }
  .h-btn + .h-btn{margin-left:0}
  .h-btn .lt{display:none}
  .h-btn .xb-ic{font-size:20px}
  .h-btn:hover{background:transparent;color:var(--text-2)}
  .h-btn:active{background:rgba(128,128,128,.12)}
  .h-head-actions .h-btn:focus{outline:none}
}

/* ---------- 导航（桌面平铺 + 下拉；移动端抽屉） ---------- */
.pc-nav{display:flex;align-items:center;height:var(--header-h);min-width:0;margin-left:20px}
.pc-nav .nav-ul{display:flex;align-items:center}
.pc-nav li{position:relative;display:flex;align-items:center}

.pc-nav li > a{
  display:inline-flex;align-items:center;gap:3px;
  height:34px;padding:0 11px;
  border-radius:var(--radius-control);
  font-size:var(--fs-14);
  color:var(--text-2);
  white-space:nowrap;
  transition:background var(--dur-fast),color var(--dur-fast);
}
.pc-nav li > a:hover{background:var(--surface-2);color:var(--text)}
/* 当前页：浅底 + 主色下划线 */
.pc-nav li.on > a{
  background:var(--surface-2);
  color:var(--text);
  font-weight:500;
  position:relative;
}
.pc-nav li.on > a::after{
  content:"";
  position:absolute;
  left:11px;right:11px;bottom:3px;
  height:2px;border-radius:1px;
  background:var(--primary);
}

.pc-nav .toggle-btn{
  display:inline-flex;align-items:center;justify-content:center;
  width:14px;height:34px;color:var(--text-3);
  transition:transform var(--dur-fast);
}
.pc-nav .toggle-btn .xb-ic{font-size:11px}
.pc-nav li:hover > .toggle-btn .xb-ic{transform:rotate(180deg)}

/* 下拉面板 */
.pc-nav .sub-nav{
  position:absolute;
  top:calc(100% + 2px);
  left:0;
  z-index:1000;
  min-width:160px;
  padding:6px;
  background:var(--surface);
  border-radius:var(--radius-card);
  box-shadow:var(--shadow-ring-lg);
  visibility:hidden;opacity:0;
  transform:translateY(4px);
  transition:opacity var(--dur-fast) ease,transform var(--dur-fast) ease,visibility 0s linear .2s;
}
/* 桥接区：鼠标从一级移向下拉时不消失 */
.pc-nav .sub-nav::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.pc-nav li:hover > .sub-nav{visibility:visible;opacity:1;transform:none;transition-delay:0s}

.pc-nav .sub-nav li{display:block}
.pc-nav .sub-nav li > a{
  display:flex;align-items:center;gap:6px;
  height:32px;padding:0 10px;
  border-radius:7px;
  font-size:var(--fs-13);
  color:var(--text-2);
  min-width:110px;
  white-space:nowrap;
}
.pc-nav .sub-nav li > a:hover{background:var(--surface-2);color:var(--text)}
/* 三级向右展开 */
.pc-nav .sub-nav .sub-nav{top:-6px;left:calc(100% + 8px)}
.pc-nav .sub-nav li.has-sub > .toggle-btn .xb-ic{transform:rotate(-90deg)}

@media (max-width:1248px) and (min-width:1101px){
  .pc-nav li > a{padding:0 7px;font-size:var(--fs-13)}
  .pc-nav{margin-left:14px}
}
@media (max-width:1100px){
  .pc-nav{display:none}
}

/* ---------- 移动端抽屉导航 ---------- */
.nav-mask{
  position:fixed;inset:0;z-index:998;
  background:rgba(9,9,11,.5);
  opacity:0;visibility:hidden;
  transition:opacity var(--dur),visibility 0s linear var(--dur);
}
.nav-mask.on{opacity:1;visibility:visible;transition-delay:0s}

.responsive-nav{
  display:none;
}
@media (max-width:1100px){
  .responsive-nav{
    display:block;
    position:fixed;left:0;top:0;bottom:0;
    width:78%;max-width:320px;
    background:var(--zinc-950,#09090b);
    overflow-y:auto;
    z-index:999;
    transform:translateX(-100%);
    transition:transform var(--dur) var(--ease);
  }
  .responsive-nav.on{transform:none}
  .responsive-nav .m-nav-hd{
    padding:18px 20px 14px;
    color:#fafafa;font-size:var(--fs-16);font-weight:600;
    border-bottom:1px solid rgba(255,255,255,.1);
  }
  .responsive-nav .nav-ul > li{
    position:relative;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .responsive-nav .nav-ul > li > a{
    display:block;
    height:50px;line-height:50px;
    padding:0 20px;
    font-size:var(--fs-15);
    color:#fafafa;
    -webkit-tap-highlight-color:transparent;
  }
  .responsive-nav .nav-ul > li > a:active{background:rgba(255,255,255,.06)}
  .responsive-nav .nav-ul > li.current > a{color:#fff;font-weight:600}
  .responsive-nav .toggle-btn{
    position:absolute;top:0;right:0;
    width:50px;height:50px;
    display:flex;align-items:center;justify-content:center;
    color:var(--zinc-400);
    z-index:2;
  }
  .responsive-nav .toggle-btn .xb-ic{font-size:16px;transition:transform .25s var(--ease)}
  .responsive-nav li.open > .toggle-btn .xb-ic{transform:rotate(180deg);color:var(--zinc-200)}
  .responsive-nav .sub-nav{
    display:none;
    background:transparent;
    border-radius:0;
    box-shadow:none;
    padding:0;
  }
  .responsive-nav li.open > .sub-nav{display:block}
  .responsive-nav .sub-nav > li{border-bottom:1px solid rgba(255,255,255,.06)}
  .responsive-nav .sub-nav > li > a{
    display:block;height:46px;line-height:46px;
    padding:0 20px 0 34px;
    font-size:var(--fs-14);
    color:var(--zinc-200);
  }
  .responsive-nav .sub-nav .sub-nav > li > a{padding-left:48px}
  .responsive-nav .sub-nav a.cur{color:#fff;font-weight:600}
  .responsive-nav .sub-nav a.cur::before{
    content:"";position:absolute;left:20px;top:50%;
    transform:translateY(-50%);
    width:5px;height:5px;border-radius:50%;background:var(--success);
  }
}

/* ============================================================
   统一搜索条
   ============================================================ */
.h-search{display:none}
@media (min-width:1101px){
  .h-search{
    display:block;position:relative;
    flex:1 1 auto;min-width:0;
    margin:0 16px;
  }
  .hs-form{
    position:relative;
    display:flex;align-items:center;
    height:44px;padding:0 7px;gap:8px;
    background:var(--surface-2);
    border-radius:var(--radius-pill);
    transition:box-shadow var(--dur-fast);
  }
  .hs-form:focus-within{box-shadow:var(--shadow-ring-strong)}
  .hq-seg{
    display:flex;align-items:center;gap:4px;
    height:30px;padding:0 10px;
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius-control);
    min-width:0;
    transition:border-color var(--dur-fast),box-shadow var(--dur-fast);
  }
  .hq-seg:focus-within{border-color:var(--focus-ring);box-shadow:0 0 0 3px var(--focus-halo)}
  .hq-seg--k{position:relative;flex:1.9 1 0;padding-left:30px}
  .hq-seg--kp{flex:1.14 1 0}
  .hq-seg--price{flex:1 1 0}
  .hq-ico{position:absolute;left:9px;top:50%;transform:translateY(-50%);color:var(--text-3);font-size:15px;pointer-events:none}
  .hq-lb{flex:none;font-size:var(--fs-12);color:var(--text-3);white-space:nowrap;cursor:pointer}
  .hq-input{
    flex:1 1 0;min-width:0;width:auto;height:26px;
    border:0;background:transparent;padding:0;
    font-size:var(--fs-13);color:var(--text);
  }
  .hq-input:focus{outline:none}
  .hq-input::placeholder{color:var(--text-3)}
  .hq-input--num{text-align:center}
  .hq-sep{flex:none;color:var(--text-3);font-size:var(--fs-12)}
  .hq-kbd{display:inline-flex;align-items:center;gap:3px;flex:none;pointer-events:none}
  .hq-kbd kbd{
    min-width:17px;height:17px;padding:0 4px;
    border:1px solid var(--border);border-radius:4px;
    background:var(--surface-2);
    font:500 10.5px/15px var(--font-mono);
    text-align:center;color:var(--text-3);
  }
  .hs-input:not(:placeholder-shown) ~ .hq-kbd{display:none}
  .hq-submit{
    flex:none;height:30px;padding:0 18px;
    border-radius:var(--radius-pill);
    background:var(--primary);color:var(--on-primary);
    font-size:var(--fs-13);line-height:1;
    transition:background var(--dur-fast);
  }
  .hq-submit:hover{background:var(--primary-hover)}
}

/* 移动端搜索面板 */
.search-area{display:none}
@media (max-width:1100px){
  .search-area{
    display:none;
    position:fixed;left:8px;right:8px;top:calc(var(--header-h) + 8px);
    z-index:99;
    padding:12px;
    background:var(--surface);
    border-radius:var(--radius-card);
    box-shadow:var(--shadow-ring-lg);
  }
  .search-area.on{display:block}
  .fp-kwrap{
    display:flex;align-items:center;gap:8px;
    height:40px;padding:0 12px;
    background:var(--surface-2);
    border-radius:var(--radius);
    margin-bottom:10px;
  }
  .fp-kwrap .xb-ic{font-size:16px;color:var(--text-3);flex:none}
  .fp-input{flex:1;border:0;background:transparent;font-size:var(--fs-15);min-width:0}
  .fp-input:focus{outline:none}
  .fp-sub{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap}
  .fp-fd{
    display:flex;align-items:center;gap:6px;
    height:34px;padding:0 10px;
    background:var(--surface-2);border-radius:var(--radius);
    font-size:var(--fs-13);color:var(--text-2);
  }
  .fp-in2{flex:1;min-width:0;border:0;background:transparent;font-size:var(--fs-13)}
  .fp-in2:focus{outline:none}
  .fp-in2--num{width:44px;text-align:center;flex:none}
  .fp-sep{color:var(--text-3);font-size:var(--fs-12)}
  .fp-acts{display:flex;gap:8px}
  .fp-go{
    flex:1;height:40px;border-radius:var(--radius-pill);
    background:var(--primary);color:var(--on-primary);
    font-size:var(--fs-14);font-weight:500;
  }
  .fp-clear{
    flex:none;height:40px;padding:0 18px;
    border:1px solid var(--border-strong);border-radius:var(--radius-pill);
    color:var(--text-2);font-size:var(--fs-14);
  }
}

/* ============================================================
   卡头 mianbaoxie
   ============================================================ */
.mianbaoxie{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:12px 16px;
  border-bottom:1px solid var(--border);
  font-size:var(--fs-13);
}
@media (min-width:1101px){ .mianbaoxie{padding:14px 20px} }
.mianbaoxie .mbx-title{
  font-size:var(--fs-15);font-weight:600;color:var(--text);
  display:flex;align-items:center;gap:8px;
}
.mianbaoxie .mbx-title::before{
  content:"";display:block;width:3px;height:14px;border-radius:2px;
  background:var(--primary);flex:none;
}
.mianbaoxie .sub{font-size:var(--fs-12);color:var(--text-3);white-space:nowrap}
.mianbaoxie .pull-right{margin-left:auto;font-size:var(--fs-12);color:var(--text-3);white-space:nowrap}

/* 监控中 */
.xb-monitor{
  display:inline-flex;align-items:center;gap:5px;
  margin-left:auto;
  font-size:var(--fs-12);color:var(--text-3);
  white-space:nowrap;
}
.xb-monitor-dot{
  width:7px;height:7px;border-radius:50%;
  background:var(--success);flex:none;
  animation:xbMonitorPulse 1.6s ease-out infinite;
}
@keyframes xbMonitorPulse{
  0%{box-shadow:0 0 0 0 rgba(16,185,129,.5)}
  70%{box-shadow:0 0 0 6px rgba(16,185,129,0)}
  100%{box-shadow:0 0 0 0 rgba(16,185,129,0)}
}

/* ============================================================
   ★ 列表项
   ============================================================ */
.listbox{background:var(--surface)}
.new-post{display:block}

.article-list{
  display:flex;
  align-items:center;
  gap:var(--row-gap);
  width:100%;
  padding:var(--row-pad-y) 16px;
  position:relative;
  border-bottom:1px dashed var(--row-border);
  content-visibility:auto;
  contain-intrinsic-size:auto var(--row-h);
  transition:background var(--dur-fast);
}
@media (min-width:1101px){ .article-list{padding:var(--row-pad-y) 20px} }
.article-list:hover{background:var(--surface-3)}
.article-list:last-child{border-bottom:none}

/* 频道图标 */
.article-list .figure{
  flex:none;
  width:20px;height:20px;
  background-size:20px 20px;
  background-repeat:no-repeat;
  background-position:center;
  border-radius:4px;
  background-color:var(--surface-2);
}
/* 没有图标时显示分类首字 */
.article-list .figure.fallback{
  display:flex;align-items:center;justify-content:center;
  font-size:10px;font-weight:600;color:var(--text-3);
  background:var(--surface-2);
}

/* ---------- 频道图标映射（cgNN 的 NN = Z-Blog 分类 ID）---------- */
.article-list .cg1   {background-image:url(cateicon/1.webp)}
.article-list .cg2   {background-image:url(cateicon/2.webp)}
.article-list .cg3   {background-image:url(cateicon/3.webp)}
.article-list .cg4   {background-image:url(cateicon/4.webp)}
.article-list .cg5   {background-image:url(cateicon/5.webp)}
.article-list .cg6   {background-image:url(cateicon/6.webp)}
.article-list .cg7   {background-image:url(cateicon/7.webp)}
.article-list .cg8   {background-image:url(cateicon/8.webp)}
.article-list .cg9   {background-image:url(cateicon/9.webp)}
.article-list .cg10  {background-image:url(cateicon/10.webp)}
.article-list .cg11  {background-image:url(cateicon/11.webp)}
.article-list .cg12  {background-image:url(cateicon/12.webp)}
.article-list .cg13  {background-image:url(cateicon/13.webp)}
.article-list .cg14  {background-image:url(cateicon/14.webp)}
.article-list .cg16  {background-image:url(cateicon/16.webp)}
.article-list .cg17  {background-image:url(cateicon/17.webp)}
.article-list .cg18  {background-image:url(cateicon/18.webp)}
.article-list .cg19  {background-image:url(cateicon/19.webp)}
.article-list .cg20  {background-image:url(cateicon/20.webp)}
.article-list .cg22  {background-image:url(cateicon/22.webp)}
.article-list .cg23  {background-image:url(cateicon/23.webp)}
.article-list .cg24  {background-image:url(cateicon/24.webp)}
.article-list .cg25  {background-image:url(cateicon/25.webp)}
.article-list .cg27  {background-image:url(cateicon/27.webp)}
.article-list .cg28  {background-image:url(cateicon/28.webp)}
.article-list .cg30  {background-image:url(cateicon/30.webp)}
.article-list .cg31  {background-image:url(cateicon/31.webp)}
.article-list .cg32  {background-image:url(cateicon/32.webp)}

/* 标题行 */
.article-list .title{
  flex:1;
  display:flex;
  align-items:center;
  gap:var(--row-gap);
  min-width:0;
  font-size:var(--fs-14);
  font-weight:400;
  overflow:hidden;
  line-height:1.5;
}
.article-list .title > a{
  flex:1 1 auto;
  min-width:0;
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--text-body);
  order:1;
}
.article-list .title > a:hover{color:var(--link-hover)}
.article-list a:visited{color:var(--text-read)}

/* order 排序：标题1 → 置顶2 → 频道3 → 热门4 → 评论5 → 时间6 */
.article-list .title .badge,
.article-list .badge-cat,
.article-list .istop{flex:none;order:0}

.article-list .istop{
  order:2;
  display:inline-flex;align-items:center;
  height:18px;padding:0 7px;
  border-radius:4px;
  background:var(--primary);color:var(--on-primary);
  font-size:var(--fs-11);font-weight:500;line-height:1;
}
.article-list .badge-cat{
  order:3;
  display:inline-flex;align-items:center;
  height:18px;padding:0 7px;
  border-radius:var(--radius-badge);
  font-size:var(--fs-11);line-height:1;
  background:var(--surface-2);color:var(--text-2);
  white-space:nowrap;flex:none;
}
.article-list .title .badge{
  order:4;
  display:inline-flex;align-items:center;
  padding:3px 7px;
  line-height:1;
  background:var(--surface-2);
  border-radius:var(--radius-badge);
  font-size:var(--fs-11);
}
.article-list .title time.badge{
  order:6;
  color:var(--text-3);
  font-variant-numeric:tabular-nums;
  min-width:46px;
  justify-content:flex-end;
}
.article-list .title .badge.red{
  background:var(--danger-bg);
  color:var(--danger-text);
  font-weight:500;
}
.article-list .title .com{order:5;color:var(--text-3)}
.article-list .title .com .xb-ic{margin-right:2px;font-size:11px}

/* 频道名在不同容器里的显隐 */
/* 列表容器带了 .xb-nocat 时不显示频道名（单频道列表/侧栏用） */
.xb-nocat .article-list .badge-cat{display:none}

/* 两行模式 */
.listbox.xb-t2 .article-list .title > a{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  white-space:normal;
}

/* 实时新增条目的高亮底 */
.article-list.xb-new{will-change:opacity,transform}
@media (prefers-reduced-motion:reduce){
  .article-list.xb-new{transition:none!important}
}

/* 空状态 */
.xb-empty{padding:48px 20px;text-align:center;color:var(--text-3)}
.xb-empty b{display:block;font-size:var(--fs-15);color:var(--text-2);margin-bottom:6px}

/* 首屏防塌：内容区最小高度，让页脚不早早上来 */
#content{min-height:calc(100vh - var(--header-h) - 120px)}
#mainbox{display:flex;flex-direction:column;gap:16px}
@media (max-width:1100px){
  #mainbox{gap:10px}
  #content{min-height:calc(100vh - var(--header-h) - 80px)}
}

/* ============================================================
   侧栏
   ============================================================ */
#sidebar .card{margin-bottom:16px}
@media (max-width:1100px){ #sidebar .card{margin-bottom:10px} }

.side-hd{
  display:flex;align-items:center;gap:8px;
  padding:14px 16px;
  border-bottom:1px solid var(--border);
}
.side-hd b{font-size:var(--fs-15);font-weight:600;color:var(--text)}
.side-hd .sub{font-size:var(--fs-12);color:var(--text-3)}
.side-hd .side-more{margin-left:auto;font-size:var(--fs-12);color:var(--text-3)}
.side-hd .side-more:hover{color:var(--link-hover)}

.side-ft{border-top:none;padding:6px 0 10px;text-align:center}
.side-ft a{font-size:var(--fs-12);color:var(--text-2)}
.side-ft a:hover{color:var(--link-hover)}

#sidebar .article-list{padding:8px 16px}
#sidebar .article-list .title > a{font-size:var(--fs-13)}

/* 侧栏 tab 分段控件 */
.side-tabs{
  display:flex;align-items:center;flex-wrap:nowrap;
  background:var(--surface-2);
  border-radius:10px;
  margin:12px;
  padding:3px;
}
.side-tabs a{
  flex:1 1 0;min-width:0;
  display:flex;align-items:center;justify-content:center;
  height:28px;padding:0 4px;
  border-radius:8px;
  font-size:var(--fs-12);
  color:var(--text-2);
  white-space:nowrap;
  transition:background var(--dur-fast),color var(--dur-fast);
}
.side-tabs a.on{
  background:var(--surface);
  color:var(--text);
  font-weight:500;
  box-shadow:var(--shadow-ring-sm);
}

/* 胶囊标签 */
.xb-tags{display:flex;flex-wrap:wrap;gap:8px;padding:12px 16px 14px}
.xb-tag{
  display:inline-flex;align-items:center;
  height:26px;padding:0 12px;
  border-radius:var(--radius-badge);
  font-size:var(--fs-12);
  color:var(--text-2);
  background:var(--surface);
  box-shadow:var(--shadow-ring);
  transition:color var(--dur-fast),box-shadow var(--dur-fast);
  max-width:100%;
}
.xb-tag:hover{color:var(--text);box-shadow:var(--shadow-ring-pop)}
.xb-tag > span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 订阅卡 */
.dy-cap{padding:12px 16px 0;font-size:var(--fs-12);color:var(--text-3)}
.dy-cap + .xb-tags{padding-top:8px}

/* ============================================================
   文章页
   ============================================================ */
article.art-main{padding:0}
.art-main > .mianbaoxie{
  padding:14px 16px;
  border-bottom:1px solid var(--border);
  font-size:var(--fs-13);
  margin:0;
  gap:6px;
}
@media (min-width:1101px){ .art-main > .mianbaoxie{padding:16px 24px 14px} }
.art-main > .mianbaoxie a{color:var(--text-2)}
.art-main > .mianbaoxie a:hover{color:var(--link-hover)}
.art-main > .mianbaoxie .sub{color:var(--text-3)}
.art-main > .mianbaoxie .cur{color:var(--text-3)}

.art-head{padding:14px 16px 0}
@media (min-width:1101px){ .art-head{padding:20px 24px 0} }

.art-title{
  font-size:var(--fs-22);
  font-weight:600;
  line-height:1.45;
  color:var(--text);
  word-break:break-word;
}
@media (max-width:1100px){ .art-title{font-size:calc(20px*var(--fscale))} }

.head-info{
  display:flex;align-items:center;flex-wrap:wrap;
  gap:14px;
  padding-top:10px;
  font-size:var(--fs-13);
  color:var(--text-3);
}
.head-info .author a{color:var(--text-2)}
.head-info .author a:hover{color:var(--link-hover)}
.head-info .report a{color:var(--text-3)}
.head-info .report a:hover{color:var(--danger-text)}
.head-info time{font-variant-numeric:tabular-nums}

.art-content{
  font-size:var(--fs-15);
  line-height:1.9;
  word-break:break-word;
  padding:16px 16px 24px;
  margin:0;
}
@media (min-width:1101px){ .art-content{padding:16px 24px 28px} }
.art-content p{margin:0 0 .8em}
.art-content p:last-child{margin-bottom:0}
.art-content img{max-width:100%;height:auto;border-radius:8px;display:block;margin:10px 0}
.art-content a{color:var(--link-ext);word-break:break-all}
.art-content a:hover{color:var(--link-ext-hover);text-decoration:underline}
.art-content br{line-height:2}

/* 文章底：版权说明 */
.art-foot{
  padding:12px 16px 16px;
  border-top:1px solid var(--border);
}
@media (min-width:1101px){ .art-foot{padding:14px 24px 18px} }
.art-copyright{
  font-size:var(--fs-12);
  line-height:1.7;
  color:var(--text-3);
  background:var(--surface-3);
  border-radius:var(--radius);
  padding:10px 12px;
}

/* 相关列表 */
.xiangguan{margin-top:16px}
.xiangguan .article-list{padding-left:16px;padding-right:16px}
@media (min-width:1101px){ .xiangguan .article-list{padding-left:20px;padding-right:20px} }

/* ============================================================
   分页
   ============================================================ */
.pagebar{text-align:center;padding:16px 16px 20px}
.pagebar .pager{
  display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:center;
}
.pagebar a,.pagebar span{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:32px;height:32px;padding:0 10px;
  border-radius:var(--radius-control);
  background:var(--surface);
  color:var(--text-2);
  font-size:var(--fs-13);
  box-shadow:var(--shadow-ring-strong);
  transition:background var(--dur-fast),color var(--dur-fast);
}
.pagebar a:hover{background:var(--surface-2);color:var(--text)}
.pagebar span.now{background:var(--primary);color:var(--on-primary);font-weight:500}
.pagebar .dots{box-shadow:none;background:transparent;color:var(--text-3)}

/* ============================================================
   页脚
   ============================================================ */
.footer{
  width:100%;
  margin-top:24px;
  background:var(--surface-3);
  border-top:1px solid var(--border);
  color:var(--text-2);
}
.footer .main{
  max-width:var(--container);
  margin:0 auto;
  padding:28px 16px 8px;
}
@media (min-width:1101px){
  .footer .main{
    padding:36px 24px 8px;
    display:grid;
    grid-template-columns:minmax(0,1.7fr) minmax(0,1fr) minmax(0,.9fr) minmax(0,.9fr);
    gap:24px 40px;
    align-items:start;
  }
}
.footer .title{
  font-size:var(--fs-14);
  font-weight:600;
  color:var(--text);
  padding-bottom:12px;
}
.footer .intro{
  font-size:var(--fs-13);
  line-height:1.8;
  color:var(--text-2);
  margin-bottom:12px;
  max-width:460px;
}
.footer .f-nav p{margin:0 0 6px}
.footer .f-nav a,.footer .f-contact p{font-size:var(--fs-13);color:var(--text-2)}
.footer .f-nav-list{
  display:flex;
  flex-wrap:wrap;
  gap:4px 14px;
  max-width:240px;
}
.footer .f-nav-list a{
  display:inline-block;
  padding:2px 0;
  font-size:var(--fs-13);
  color:var(--text-2);
  line-height:1.6;
  white-space:nowrap;
}
.footer a:hover{color:var(--link-hover)}
.footer small{
  display:block;
  font-size:var(--fs-12);
  color:var(--text-3);
  padding-bottom:20px;
  line-height:1.8;
}
.footer small .icp{display:block;margin-top:4px}
@media (max-width:1100px){
  .footer .main{padding:20px 16px 0}
  .footer .f-about{margin-bottom:18px}
  .footer .f-nav{display:flex;flex-wrap:wrap;gap:0 14px;margin-bottom:14px}
  .footer .f-nav .title{width:100%;padding-bottom:8px}
  .footer .f-nav p{margin:0 0 4px}
  .footer .f-contact{margin-bottom:10px}
}

/* ============================================================
   通用小件
   ============================================================ */
/* SVG 图标统一尺寸 */
.xb-ic{display:inline-block;width:1em;height:1em;fill:currentColor;vertical-align:-.125em;flex:none}
svg.xb-svg{width:1em;height:1em;fill:currentColor;vertical-align:-.125em;flex:none;display:inline-block}

/* 骨架占位 */
.skel{
  background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface-3) 37%,var(--surface-2) 63%);
  background-size:400% 100%;
  animation:skelShine 1.4s ease infinite;
  border-radius:6px;
}
@keyframes skelShine{
  0%{background-position:100% 50%}
  100%{background-position:0 50%}
}

/* 无障碍隐藏 */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* 减少动效偏好 */
@media (prefers-reduced-motion:reduce){
  *,::before,::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}

/* 回到顶部 */
.to-top{
  position:fixed;right:20px;bottom:24px;z-index:90;
  width:42px;height:42px;
  display:none;align-items:center;justify-content:center;
  border-radius:50%;
  background:var(--surface);
  box-shadow:var(--shadow-ring-lg);
  color:var(--text-2);
  transition:opacity var(--dur),transform var(--dur);
}
.to-top.on{display:flex}
.to-top:hover{color:var(--text);transform:translateY(-2px)}
@media (max-width:1100px){ .to-top{right:14px;bottom:18px;width:40px;height:40px} }
