/* ===== 补充样式：源站 CSS 中缺失的组件 ===== */

/* ===== 筛选栏 ===== */
.filter-bar{padding:16px 20px;background:var(--bg-white);border-radius:var(--radius-lg);margin-bottom:16px;box-shadow:var(--shadow-sm)}
.filter-item{display:flex;align-items:flex-start;gap:10px;padding:6px 0}
.filter-item:not(:last-child){border-bottom:1px solid var(--border-light)}
.filter-label{font-size:14px;color:var(--text-light);flex-shrink:0;min-width:50px;line-height:28px}
.filter-tags{display:flex;flex-wrap:wrap;gap:6px}
.filter-tag{font-size:13px;color:var(--text-light);padding:4px 14px;border-radius:16px;background:var(--border-light);transition:all .15s;cursor:pointer}
.filter-tag:hover{color:var(--primary);background:rgba(0,128,255,.08)}
.filter-tag.active{background:var(--primary);color:#fff;font-weight:600}

/* ===== 分页 ===== */
.page-container{display:flex;justify-content:center;align-items:center;padding:24px 0;gap:6px}
.page-list{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.page-list a,.page-list span{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 10px;font-size:14px;color:var(--text);background:var(--bg-white);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:all .15s}
.page-list a:hover{color:var(--primary);box-shadow:var(--shadow)}
.page-list .active{background:var(--primary);color:#fff;font-weight:600}

/* ===== 消息/跳转页 ===== */
.msg-box,.jump-box{max-width:500px;margin:60px auto;padding:40px 30px;background:var(--bg-white);border-radius:var(--radius-lg);box-shadow:var(--shadow);text-align:center}
.msg-box h3,.jump-box h3{font-size:20px;font-weight:700;margin-bottom:14px;color:var(--text)}
.msg-box p,.jump-box p{font-size:14px;color:var(--text-light);line-height:1.8;margin-bottom:18px}
.msg-box a,.jump-box a{display:inline-block;padding:8px 24px;background:var(--primary);color:#fff;border-radius:var(--radius);font-size:14px;font-weight:600;transition:opacity .2s}
.msg-box a:hover,.jump-box a:hover{opacity:.9}

/* ===== 搜索分类筛选 ===== */
.facet-bar{display:flex;flex-wrap:wrap;gap:8px;padding:12px 0;margin-bottom:12px}
.facet-chip{display:inline-flex;align-items:center;gap:4px;padding:6px 14px;font-size:13px;color:var(--text-light);background:var(--bg-white);border:1px solid var(--border);border-radius:20px;cursor:pointer;transition:all .15s}
.facet-chip:hover{border-color:var(--primary);color:var(--primary)}
.facet-chip.active{background:var(--primary);color:#fff;border-color:var(--primary);font-weight:600}
.facet-count{font-size:11px;opacity:.7}

/* ===== 文章卡片 ===== */
.art-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.art-card{background:var(--bg-white);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);transition:all .2s}
.art-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.art-card-thumb{width:100%;padding-top:52%;position:relative;overflow:hidden;background:var(--border-light)}
.art-card-thumb img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform .3s}
.art-card:hover .art-card-thumb img{transform:scale(1.04)}
.art-card-body{padding:14px 16px 18px}
.art-card-title{font-size:15px;font-weight:600;margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.art-card-meta{font-size:12px;color:var(--text-lighter)}

/* ===== 专题卡片 ===== */
.topic-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.topic-card{background:var(--bg-white);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);transition:all .2s}
.topic-card:hover{transform:translateY(-3px)}
.topic-card-thumb{width:100%;padding-top:42%;position:relative;overflow:hidden}
.topic-card-thumb img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform .3s}
.topic-card:hover .topic-card-thumb img{transform:scale(1.04)}
.topic-card-body{padding:16px 18px 20px}
.topic-card-title{font-size:17px;font-weight:700;margin-bottom:6px}
.topic-card-desc{font-size:13px;color:var(--text-lighter);line-height:1.6}

/* ===== 评论/留言 ===== */
.comment-wrap,.gbook-wrap{max-width:800px;margin:0 auto;padding:24px 20px}
.comment-item,.gbook-item{background:var(--bg-white);padding:18px;border-radius:var(--radius);margin-bottom:12px;box-shadow:var(--shadow-sm)}
.comment-head,.gbook-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.comment-avatar,.gbook-avatar{width:36px;height:36px;border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}
.comment-name,.gbook-name{font-size:14px;font-weight:600}
.comment-time,.gbook-time{font-size:12px;color:var(--text-lighter);margin-left:auto}
.comment-body,.gbook-body{font-size:14px;color:var(--text-light);line-height:1.7}
.comment-form,.gbook-form{background:var(--bg-white);padding:20px;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin-bottom:20px}
.comment-form textarea,.gbook-form textarea{width:100%;min-height:80px;padding:12px 16px;font-size:14px;border:1px solid var(--border);border-radius:var(--radius);resize:vertical;background:var(--bg);color:var(--text)}
.comment-form textarea:focus,.gbook-form textarea:focus{border-color:var(--primary);background:var(--bg-white)}

/* ===== 用户中心 ===== */
.user-info-card{background:var(--bg-white);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm);margin-bottom:16px}
.user-info-header{display:flex;align-items:center;gap:16px;margin-bottom:20px}
.user-avatar-lg{width:64px;height:64px;border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0}
.user-info-name{font-size:18px;font-weight:700}
.user-info-meta{font-size:13px;color:var(--text-lighter);margin-top:4px}

/* ===== 暗色主题补充 ===== */
html[data-mx-theme="black"] .filter-bar,
html[data-mx-theme="black"] .art-card,
html[data-mx-theme="black"] .topic-card,
html[data-mx-theme="black"] .comment-item,
html[data-mx-theme="black"] .gbook-item,
html[data-mx-theme="black"] .comment-form,
html[data-mx-theme="black"] .gbook-form,
html[data-mx-theme="black"] .user-info-card{background:#1A1C1F}
html[data-mx-theme="black"] .filter-tag{background:#25252b;color:#e1e3e5}
html[data-mx-theme="black"] .facet-chip{background:#1A1C1F;border-color:#25252b;color:#e1e3e5}
html[data-mx-theme="black"] .page-list a,
html[data-mx-theme="black"] .page-list span{background:#1A1C1F;color:#e1e3e5}
html[data-mx-theme="black"] .comment-form textarea,
html[data-mx-theme="black"] .gbook-form textarea{background:#16161a;border-color:#25252b;color:#e1e3e5}