/* ============================================================================
   列表页（list.html）专属样式 · 基理设计规范 v2.1 Token 化
   ============================================================================ */

body{background:var(--bg-page);}

.list-sec{padding:var(--sp-10) 0 var(--sp-16);}

/* 页面主标题（每页唯一 700） */
.page-head{margin-bottom:var(--sp-6);}
.page-head h2{
  font-size:var(--text-3xl);font-weight:700;color:var(--text-1);
  position:relative;display:inline-block;padding-bottom:var(--sp-3);
}
.page-head h2::after{
  content:"";position:absolute;left:0;bottom:0;
  width:48px;height:4px;background:var(--brand-figure);border-radius:var(--r-sm);
}

/* 分类 Tab */
.ltab{display:flex;gap:var(--sp-2);border-bottom:2px solid var(--line-1);margin-bottom:var(--sp-4);}
.ltab span{
  padding:var(--sp-2) var(--sp-5);font-size:var(--text-sm);
  color:var(--text-2);cursor:pointer;position:relative;transition:.25s;
}
.ltab span.active{color:var(--brand-text);font-weight:500;}
.ltab span.active::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--brand-figure);
}

/* 分类标签：浅底深字，语义绑定 */
.cattag{
  display:inline-block;font-size:var(--text-xs);font-weight:400;line-height:1;
  padding:var(--sp-1) var(--sp-2);border-radius:var(--r-sm);
  margin-right:var(--sp-2);vertical-align:2px;white-space:nowrap;
}
.ct-notice{color:var(--color-info-text);background:var(--color-info-bg);}
.ct-rule{color:var(--color-warning-text);background:var(--color-warning-bg);}
.ct-news{color:var(--color-success-text);background:var(--color-success-bg);}

/* 「最新」徽章：品牌浅底深字 */
.badge{
  display:inline-block;font-size:var(--text-xs);font-weight:400;line-height:1;
  padding:var(--sp-1) var(--sp-2);border-radius:var(--r-sm);
  margin-right:var(--sp-2);vertical-align:2px;white-space:nowrap;
  color:var(--brand-text);background:var(--brand-100);
}

/* 列表卡片（品牌角饰） */
.list-card{
  background:var(--bg-card);border:1px solid var(--line-1);border-radius:var(--r-lg);
  padding:var(--sp-3) var(--sp-8);box-shadow:var(--sh-1);position:relative;
}
.list-card::before{
  content:"";position:absolute;top:-1px;left:-1px;width:24px;height:24px;
  border-top:2px solid var(--brand-figure);border-left:2px solid var(--brand-figure);
  border-top-left-radius:var(--r-lg);
}
.list-card::after{
  content:"";position:absolute;bottom:-1px;right:-1px;width:24px;height:24px;
  border-bottom:2px solid var(--brand-figure);border-right:2px solid var(--brand-figure);
  border-bottom-right-radius:var(--r-lg);
}

@media (max-width:960px){
  .list-card{padding:var(--sp-3) var(--sp-4);}
}