@charset "UTF-8";
/* ==========================================================================
   列表页专属样式 —— category-life.html（分类 / 标签 / 搜索 / 日期列表共用）
   依赖 common.css（须先引入）
   ========================================================================== */

/* 当前导航项:列表页用下划线条强调(覆盖 common 的纯变色) */
.navitem>a[aria-current="page"]{color:var(--spot);box-shadow:inset 0 -3px 0 var(--spot);border-radius:7px 7px 0 0}

/* ===== 分类 header ===== */
.cat-head{background:linear-gradient(180deg,var(--mist),var(--paper));border-bottom:1px solid var(--line);padding:26px 0 20px}
.cat-head .crumb{margin-bottom:10px}
.cat-head h1{font-family:var(--serif);font-weight:900;font-size:clamp(26px,3.4vw,36px)}
.cat-head .intro{margin-top:10px;font-size:15px;color:var(--muted);max-width:52em;line-height:1.8}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.chips a{font-size:13px;font-weight:800;border:1.5px solid var(--line);border-radius:99px;padding:6px 15px;background:var(--paper)}
.chips a:hover{border-color:var(--ink)}
.chips a.on{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ===== 主体骨架 ===== */
.main{display:grid;grid-template-columns:1fr 320px;gap:38px;padding:28px 0 54px}
aside.side{gap:26px}

/* ===== 首屏精选大卡(本版热门前 3 篇) ===== */
.pins-head{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.pins-head b{font-size:15px;letter-spacing:2px;font-weight:900}
.pins-head::after{content:"";flex:1;height:2px;background:var(--ink)}
.pins-head .pn{font-size:12px;color:var(--muted);font-weight:600}
.pins{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:34px}
.pin{border:1.5px solid var(--line);border-radius:13px;overflow:hidden;display:flex;flex-direction:column;background:var(--paper)}
.pin:hover{box-shadow:0 10px 24px rgba(22,48,43,.10)}
.pin .thumb{aspect-ratio:16/9.5;border-radius:0;font-size:12px}
.pin .pb{padding:14px 15px 15px;display:flex;flex-direction:column;gap:9px;flex:1}
.pin h2{font-size:16px;font-weight:900;line-height:1.55}
.pin:hover h2{text-decoration:underline;text-decoration-color:var(--spot);text-decoration-thickness:2.5px;text-underline-offset:4px}
.pin .pm{margin-top:auto;font-size:12px;color:var(--muted);display:flex;gap:10px;align-items:center}

/* ===== 文章列表 ===== */
.list-head{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:2.5px solid var(--ink);margin-bottom:4px;flex-wrap:wrap}
.list-head .lt{background:var(--ink);color:#fff;font-weight:900;letter-spacing:2px;font-size:14px;padding:8px 17px;border-radius:8px 8px 0 0}
.list-head .sort{font-size:13px;color:var(--muted)}
.list-head .sort b{color:var(--spot-deep)}
.rows{list-style:none}
.row{display:flex;gap:16px;padding:17px 4px;border-bottom:1px solid var(--line);align-items:flex-start}
.row .rthumb{width:148px;aspect-ratio:16/10;border-radius:9px;background:linear-gradient(135deg,#E7F0EB,#D5E4DD);flex:none;display:flex;align-items:center;justify-content:center;color:#9FB3AC;font-size:10.5px;letter-spacing:1px;overflow:hidden}
.row .rthumb img{width:100%;height:100%;object-fit:cover}
.row .rb{flex:1;min-width:0}
.row .rm{display:flex;gap:9px;align-items:center;font-size:12px;color:var(--muted);flex-wrap:wrap;margin-bottom:6px}
.row h3{font-size:16.5px;font-weight:900;line-height:1.55}
.row a:hover h3{text-decoration:underline;text-decoration-color:var(--spot);text-decoration-thickness:2.5px;text-underline-offset:4px}
.row .ex{margin-top:5px;font-size:13.5px;color:var(--muted);line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.empty{padding:40px 4px;color:var(--muted);font-size:15px}

/* ===== 分页:结构由模板根目录 /cfg.ini 输出，class 名须与此处保持一致 ===== */
.pager{display:flex;gap:7px;justify-content:center;margin-top:30px;flex-wrap:wrap}
.pager a,.pager span{min-width:38px;text-align:center;padding:9px 12px;border:1.5px solid var(--line);border-radius:9px;font-weight:800;font-size:14px}
.pager a:hover{border-color:var(--ink)}
.pager .cur,.pager .disable{background:var(--ink);color:#fff;border-color:var(--ink)}
.pager .gap{border:none;color:var(--muted);font-weight:600}

/* ===== 侧栏:标签云(其余侧栏组件在 common.css) ===== */
.taglist{display:flex;flex-wrap:wrap;gap:8px;padding:14px}
.taglist a{font-size:12.5px;font-weight:800;border:1.5px solid var(--line);border-radius:99px;padding:5px 13px}
.taglist a:hover{border-color:var(--ink)}

/* ===== 响应式 ===== */
@media (max-width:1080px){
  .main{grid-template-columns:1fr}
  aside.side{flex-direction:row;flex-wrap:wrap}
  aside.side>*{flex:1 1 300px}
}
@media (max-width:760px){
  .pins{grid-template-columns:1fr}
  .row .rthumb{width:104px}
}
@media (max-width:600px){
  aside.side>*{flex:1 1 100%}
}