/* chaopmuban 主样式（异步加载）。critical.css 内联到 head 承担首屏。 */
:root {
--cp-bg: #f5f6f7;
--cp-card: #ffffff;
--cp-ink: #1f2937;
--cp-mut: #6b7280;
--cp-line: #e5e7eb;
--cp-blue: #1e73be;
--cp-blue-d: #155a95;
--cp-radius: 10px;
}
body.cp-night {
--cp-bg: #0d1117; /* 深海军蓝底 */
--cp-card: #161b22; /* 卡片：GitHub dark 蓝灰 */
--cp-ink: #dce3ea;
--cp-mut: #8b949e;
--cp-line: #21262d;
--cp-blue: #58a6ff;
--cp-blue-d: #79b8ff;
}
* { box-sizing: border-box; }
body {
margin: 0;
background: var(--cp-bg);
color: var(--cp-ink);
font: 15px/1.75 -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}
img { max-width: 100%; height: auto; }
a { color: var(--cp-blue); text-decoration: none; }
a:hover { color: var(--cp-blue-d); }
.container { max-width: 1240px; margin: 0 auto; padding: 0 20px; }
/* ---------- 页头（默认：蓝色渐变） ---------- */
.cp-header {
background: linear-gradient(45deg, #0B4182 1%, #1e88e5 64%, #40BAF5 97%);
position: sticky; top: 0; z-index: 90;
}
.cp-header, .cp-header a, .cp-logo { color: #fff; }
/* 页头样式：白底（设置里选「白色」时） */
body.cp-header-default .cp-header { background: #fff; border-bottom: 1px solid var(--cp-line); }
body.cp-header-default .cp-header,
body.cp-header-default .cp-header a,
body.cp-header-default .cp-logo { color: var(--cp-ink); }
body.cp-night.cp-header-default .cp-header { background: var(--cp-card); }
/* 夜间：蓝色渐变页头压暗（保留品牌色相），否则暗色页面顶着一大块高亮蓝很刺眼。
特异性 0-2-0 < 上面 cp-header-default 的 0-3-0，故白底页头不受影响。 */
body.cp-night .cp-header { background: linear-gradient(45deg, #0a2444 1%, #14456f 64%, #1b5c8c 97%); }
/* 页头尺寸对齐参考站 blog.upx8.com（.page-navbar.navbar-fixed：高 76px / padding 13px / 菜单 16px 500） */
.cp-header-inner { display: flex; align-items: center; height: 76px; gap: 16px; }
.cp-logo { font-size: 24px; font-weight: 700; white-space: nowrap; display: flex; align-items: center; gap: 8px; }
.cp-tagline { font-size: 12.5px; font-weight: 400; opacity: .8; }
.cp-logo img.cp-logo-img { max-height: 48px; width: auto; display: block; }
/* 页头搜索框（半透明深色底 + 浅蓝 placeholder + 放大镜按钮） */
.cp-navsearch { flex: 1; min-width: 0; max-width: 350px; margin: 0 8px; }
.cp-navsearch-box { display: flex; align-items: center; background: rgba(0,0,0,.22); border-radius: 6px; padding: 0 6px 0 12px; }
.cp-navsearch-input {
flex: 1; min-width: 0; border: 0; outline: 0; background: transparent;
color: #fff; font-size: 14px; line-height: 1; padding: 13px 0;
-webkit-appearance: none; appearance: none;
}
.cp-navsearch-input::placeholder { color: #a9d6ff; opacity: 1; }
.cp-navsearch-btn {
background: none; border: 0; cursor: pointer; padding: 6px 8px;
color: #cfe8ff; display: flex; align-items: center;
}
.cp-navsearch-btn:hover { color: #fff; }
body.cp-header-default .cp-navsearch-input { color: var(--cp-ink); }
body.cp-header-default .cp-navsearch-input::placeholder { color: #7fb4e6; }
body.cp-header-default .cp-navsearch-btn { color: var(--cp-blue); }
/* 页头功能按钮 */
.cp-nav { flex: 0 0 auto; }
.cp-nav ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; flex-wrap: wrap; }
.cp-nav li { margin: 0; }
.cp-nav a { display: block; padding: 8px 16px; border-radius: 6px; font-size: 16px; font-weight: 500; }
.cp-nav a:hover { background: rgba(255,255,255,.16); }
body.cp-header-default .cp-nav a:hover { background: #f0f3f6; color: var(--cp-blue); }
/* 右侧功能区：VIP / 个人中心 / 退出（或登录·注册）+ 夜间，整体靠右对齐 */
.nav-user { list-style: none; margin: 0 0 0 auto; padding: 0; display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.nav-user li { margin: 0; }
.nav-user a { display: block; padding: 8px 12px; font-size: 14px; border-radius: 6px; white-space: nowrap; }
.nav-user a:hover { background: rgba(255,255,255,.16); }
.nav-user .nav-vip a { background: rgba(255,255,255,.14); }
.nav-user .nav-btn-reg { background: #fff; color: #0B4182 !important; font-weight: 600; }
.nav-user .nav-btn-reg:hover { background: #eaf4ff; }
body.cp-header-default .nav-user a:hover { background: #f0f3f6; color: var(--cp-blue); }
body.cp-header-default .nav-user .nav-vip a { background: #eef4fb; color: var(--cp-blue); }
body.cp-header-default .nav-user .nav-btn-reg { background: var(--cp-blue); color: #fff !important; }
.cp-night-toggle {
background: none; border: 0; cursor: pointer; color: inherit; padding: 6px 8px;
flex: 0 0 auto; display: flex; align-items: center; border-radius: 6px;
}
.cp-night-toggle:hover { background: rgba(255,255,255,.16); }
.cp-night-toggle .cp-ico-sun { display: none; }
body.cp-night .cp-night-toggle .cp-ico-moon { display: none; }
body.cp-night .cp-night-toggle .cp-ico-sun { display: block; }
body.cp-header-default .cp-night-toggle:hover { background: #f0f3f6; }
/* 移动端汉堡菜单按钮 + 下拉面板（≤768px 才显示按钮，面板也只在移动端启用） */
.cp-mnav-toggle {
display: none; background: none; border: 0; cursor: pointer; color: inherit;
padding: 6px 8px; margin-left: -8px; border-radius: 6px;
flex: 0 0 auto; align-items: center;
}
.cp-mnav-toggle:hover { background: rgba(255,255,255,.16); }
body.cp-header-default .cp-mnav-toggle:hover { background: #f0f3f6; }
.cp-mnav-toggle .cp-ico-x { display: none; }
.cp-mnav-toggle.on .cp-ico-bars { display: none; }
.cp-mnav-toggle.on .cp-ico-x { display: block; }
/* 面板：绝对定位挂在 sticky 页头下方，展开时盖在内容上（不把页面往下推） */
.cp-mnav {
display: none; position: absolute; top: 100%; left: 0; right: 0; z-index: 89;
background: var(--cp-card); border-bottom: 1px solid var(--cp-line);
box-shadow: 0 14px 26px -14px rgba(16,24,40,.28);
max-height: 68vh; overflow-y: auto; -webkit-overflow-scrolling: touch;
}
.cp-mnav.open { display: block; }
.cp-mnav-menu { list-style: none; margin: 0; padding: 6px 0; }
.cp-mnav-menu li { margin: 0; }
.cp-mnav-menu a {
display: block; padding: 11px 20px; color: var(--cp-ink);
font-size: 15px; border-bottom: 1px dashed var(--cp-line);
}
.cp-mnav-menu li:last-child > a { border-bottom: 0; }
.cp-mnav-menu a:hover { color: var(--cp-blue); background: rgba(30,115,190,.06); }
.cp-mnav-menu .sub-menu { list-style: none; margin: 0; padding: 0; }
.cp-mnav-menu .sub-menu a { padding-left: 38px; font-size: 14px; color: var(--cp-mut); }
body.cp-night .cp-mnav-menu a:hover { background: rgba(255,255,255,.05); }
@media (max-width: 768px) {
.cp-header-inner { height: auto; flex-wrap: wrap; gap: 8px; padding-top: 8px; padding-bottom: 8px; }
.cp-mnav-toggle { display: flex; }
.cp-logo { font-size: 19px; }
.cp-logo .cp-tagline { display: none; }
.cp-navsearch { order: 3; flex: 1 0 100%; max-width: none; margin: 0; }
.cp-navsearch-input { padding: 11px 0; }
.nav-user { margin-left: auto; }
.nav-user a { padding: 7px 8px; font-size: 13.5px; }
}
/* 主体 */
.cp-main { padding: 24px 0 60px; }
.cp-grid { display: grid; grid-template-columns: 1fr 320px; gap: 24px; }
@media (max-width: 900px) { .cp-grid { grid-template-columns: 1fr; } }
.cp-content { min-width: 0; }
/* 列表卡片 */
.cp-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.cp-card { background: var(--cp-card); border: 1px solid var(--cp-line); border-radius: var(--cp-radius); overflow: hidden; transition: box-shadow .2s; }
.cp-card:hover { box-shadow: 0 8px 24px -12px rgba(16,24,40,.18); }
.cp-card-img { display: block; aspect-ratio: 3/2; overflow: hidden; background: #eef1f4; }
.cp-card-img img { width: 100%; height: 100%; object-fit: cover; }
.cp-card-title { margin: 0; padding: 10px 14px 14px; font-size: 15px; font-weight: 500; line-height: 1.5; }
.cp-card-title a { color: var(--cp-ink); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-card-title a:hover { color: var(--cp-blue); }
/* 首页分类卡片（[mocat]） */
.mocat { background: var(--cp-card); border: 1px solid var(--cp-line); border-radius: var(--cp-radius); padding: 20px 22px 18px; }
.mocat h2 { margin: 0 0 12px; font-size: 17px; line-height: 1.4; border-bottom: 1px solid var(--cp-line); padding-bottom: 10px; position: relative; }
.mocat h2:after { content: ""; position: absolute; left: 0; bottom: -1px; width: 30px; height: 3px; background: var(--cp-blue); border-radius: 2px; }
.mocat .lists .grid { padding: 9px 0; border-bottom: 1px solid #f0f2f5; }
body.cp-night .mocat .lists .grid { border-bottom-color: #232b34; }
.mocat .lists .grid h3 { margin: 0; font-size: 15px; font-weight: 400; }
.mocat .lists .grid h3 a { color: var(--cp-ink); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mocat .lists .grid h3 a:hover { color: var(--cp-blue); }
.mocat .more { margin-top: 14px; text-align: center; }
.mocat .more a { display: block; padding: 7px 0; font-size: 13px; color: var(--cp-blue) !important; border: 1px solid rgba(30,115,190,.3); border-radius: var(--cp-radius); }
.mocat .more a:hover { background: rgba(30,115,190,.07); }
/* ---------- 首页：分类卡片网格（Hero 已取消，头部改为导航栏渐变） ---------- */
.cp-blocks {
display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px;
padding: 0 0 50px; align-items: stretch;
}
.cp-block {
background: var(--cp-card); border: 1px solid var(--cp-line); border-radius: 4px;
padding: 26px 30px; box-shadow: 0 5px 20px -5px rgba(11,27,38,.12);
display: flex; flex-direction: column;
min-width: 0; /* 网格轨道防撑爆：否则 nowrap 标题会把 1fr 轨道顶出视口（手机端横向溢出 175px 的元凶） */
}
body.cp-night .cp-block { box-shadow: none; }
.cp-block-title { margin: 0 0 20px; font-size: 20px; font-weight: 600; line-height: 1.4; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cp-block-name { color: var(--cp-ink); }
.cp-block-name:hover { color: var(--cp-blue); }
.cp-block-alias { color: var(--cp-mut); font-weight: 400; }
/* 「更多」按钮：品牌渐变小药丸，突出显示 */
.cp-block-more {
flex: 0 0 auto; display: inline-flex; align-items: center; gap: 3px;
padding: 5px 14px 5px 16px; border-radius: 999px; font-size: 13px; font-weight: 500;
color: #fff !important; background: linear-gradient(45deg, #0B4182 1%, #1e88e5 64%, #40BAF5 97%);
box-shadow: 0 4px 12px -4px rgba(30,136,229,.65);
transition: transform .2s ease, box-shadow .2s ease;
}
.cp-block-more:hover { transform: translateY(-1px); box-shadow: 0 8px 18px -6px rgba(30,136,229,.85); color: #fff !important; }
.cp-block-more svg { display: block; }
.cp-block-list { list-style: none; margin: 0; padding: 0; flex: 1; }
.cp-block-list li { position: relative; padding-left: 30px; margin-bottom: 13px; }
.cp-block-list li:last-child { margin-bottom: 0; }
.cp-block-list li::before {
content: ""; position: absolute; top: 4px; left: 0; width: 17px; height: 19px;
background-color: var(--cp-mut);
-webkit-mask: url("data:image/svg+xml;utf8,") center / contain no-repeat;
mask: url("data:image/svg+xml;utf8,") center / contain no-repeat;
}
.cp-block-list li a { display: block; color: var(--cp-mut); }
.cp-block-list li a:hover .cp-block-item-text { color: var(--cp-blue); }
.cp-block-item-text {
display: block; color: var(--cp-ink); font-size: 15px; line-height: 1.6;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
transition: color .25s ease-in-out;
}
/* 平板（≤1024）：首页分类卡片改单栏。
轨道必须写 minmax(0,1fr)，不能用 1fr —— 1fr 的最小值是 auto，
会被 nowrap 的标题顶开，把网格撑出容器造成横向溢出（实测手机端多出 175px）。
⚠️ 其余 ≤768 的手机端覆盖统一放在本文件**末尾**「手机端自适应」一节，
因为同优先级下后写的规则才生效，写在中途会被下面的基础规则反超。 */
@media (max-width: 1024px) {
.cp-blocks { grid-template-columns: minmax(0, 1fr); padding: 0 0 40px; }
}
/* 文章页 */
.cp-single-head { margin-bottom: 20px; }
.cp-single-title { font-size: 26px; line-height: 1.4; margin: 12px 0 8px; }
.cp-meta { color: var(--cp-mut); font-size: 13px; }
.cp-meta a { color: var(--cp-mut); }
.cp-article { background: var(--cp-card); border: 1px solid var(--cp-line); border-radius: var(--cp-radius); padding: 28px; font-size: 16px; }
.cp-article img { border-radius: 6px; }
.cp-article h2, .cp-article h3 { line-height: 1.4; margin: 1.4em 0 .6em; }
.cp-article p { margin: 1em 0; }
.cp-tags { margin-top: 20px; }
.cp-tags a { display: inline-block; background: #f0f3f6; color: var(--cp-ink); padding: 3px 12px; border-radius: 20px; margin: 0 6px 6px 0; font-size: 13px; }
/* 卡片元信息 / 价格标记 / 上一篇下一篇 / 横排列表模式 */
.cp-card-meta { margin-top: 6px; font-size: 12.5px; color: var(--cp-mut); }
.cp-card-meta a { color: var(--cp-mut); text-decoration: none; }
.cp-card-meta .cp-free { color: #1a9e55; }
.cp-card-meta .cp-paid { color: #d9534f; }
/* v1.7.8：卡片元信息行的下载次数（svg 与数字基线对齐） */
.cp-card-meta .cp-downloads { display: inline-flex; align-items: center; gap: 3px; }
.cp-post-nav { display: flex; justify-content: space-between; gap: 12px; margin-top: 24px; font-size: 14px; }
.cp-post-nav a { text-decoration: none; }
.cp-post-nav .pn-next { text-align: right; }
body.cp-liststyle-list .cp-cards { display: flex; flex-direction: column; gap: 14px; }
body.cp-liststyle-list .cp-card { display: flex; align-items: center; gap: 14px; }
body.cp-liststyle-list .cp-card-img { flex: 0 0 150px; }
body.cp-liststyle-list .cp-card-img img { height: 100px !important; object-fit: cover; }
body.cp-liststyle-list .cp-card-title { margin: 0; }
.cp-captcha { margin: 12px 0; }
.cp-captcha input { margin-left: 6px; padding: 6px 8px; border: 1px solid #ddd; border-radius: 6px; }
.cp-page-links { margin-top: 18px; }
/* 文章分享栏 */
/* ---------- 广告位（v1.7.7 统一口径：正文下方 + 侧栏 共用一套类名） ----------
* 取值优先级见 inc/ads.php：广告图片 > 广告代码 > 虚线占位框。
* 配色沿用主题变量（--cp-card / --cp-line / --cp-radius / --cp-mut），
* 因此夜间模式无需额外覆盖 —— 变量在 body.cp-night 下已自动换成深色系。
*/
.cp-post-ad { margin-top: 22px; }
.cp-ad .widget.widget-text {
background: var(--cp-card);
border: 1px solid var(--cp-line);
border-radius: var(--cp-radius);
padding: 18px;
text-align: center;
}
/* 同上：.nopadding = 后台「无卡片样式」开关 */
.cp-ad .widget.widget-text.nopadding { padding: 0; background: none; border: 0; border-radius: 0; }
.cp-ad .widget-title { font-size: 15px; margin: 0 0 12px; padding-bottom: 8px; border-bottom: 1px solid var(--cp-line); text-align: left; }
.cp-ad .widget.nopadding .widget-title { margin-top: 0; }
/* 广告图：满宽 + 高度上限（不再按原图尺寸把版面撑大） */
.cp-ad .cp-ad-img { display: block; width: 100%; height: auto; max-width: 100%; object-fit: contain; margin: 0 auto; border-radius: 6px; }
.cp-ad .cp-ad-link { display: block; }
/* 无图无代码时的虚线占位框 —— 把原先塞在侧栏小工具里的那段内联 div 样式
搬进主题、改用 CSS 变量，日间夜间自动跟随 */
.cp-ad .cp-ad-ph {
width: 100%; box-sizing: border-box;
border: 2px dashed var(--cp-line); border-radius: 6px;
text-align: center; color: var(--cp-mut);
font-size: 20px; letter-spacing: 2px; overflow: hidden;
}
/* 「手机端显示」关闭时只在窄屏隐藏：用 CSS 判断而不是 PHP 端 wp_is_mobile()，
因为本站有整页缓存（缓存键 = md5(REQUEST_URI)，桌面与手机共用一份 HTML），
PHP 端设备判断会被缓存固化而失效。 */
@media (max-width: 768px) { .cp-ad.cp-ad-nowap { display: none !important; } }
/* 广告联盟常见的内容容器，避免撑破正文宽度 */
.cp-ad iframe,
.cp-ad ins,
.cp-ad embed { max-width: 100%; }
.cp-sharebar { display: flex; gap: 10px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--cp-line); }
.cp-btn { display: inline-block; padding: 8px 18px; border-radius: 7px; border: 1px solid var(--cp-line); background: var(--cp-bg); color: var(--cp-ink); font-size: 13.5px; cursor: pointer; }
.cp-btn:hover { border-color: var(--cp-blue); color: var(--cp-blue); }
.cp-copy-ok { color: var(--cp-green, #3a6); border-color: var(--cp-green, #3a6); }
/* 侧栏 */
.cp-sidebar { position: relative; }
/* 侧栏：不做 sticky 固定，跟随页面整体滚动（2026-10-02 用户要求取消吸顶与内部滚动条）。
旧实现是 .cp-sidebar-inner { position: sticky; top: 92px } + 内容超高时 JS 加
.cp-sidebar-scroll 内部滚动 —— 两套都已移除，侧栏就是普通文档流的一列。 */
.cp-sidebar-inner { position: static; }
.cp-sidebar .widget { background: var(--cp-card); border: 1px solid var(--cp-line); border-radius: var(--cp-radius); padding: 18px; margin-bottom: 20px; }
.cp-sidebar .widget-title { font-size: 15px; margin: 0 0 12px; padding-bottom: 8px; border-bottom: 1px solid var(--cp-line); }
/* ---------- 侧栏小工具（移植 Modown：标签云 / 文章列表 / 广告） ---------- */
/* .nopadding = 后台「无卡片样式」开关（v1.7.10 前名为「No padding（无边距）」，
名字容易让人以为只是调内边距，实际把底色/边框/圆角/内边距全部去掉）。
侧栏小工具默认一律卡片式；勾了这个才变成裸列表。 */
.cp-sidebar .widget.nopadding { padding: 0; background: none; border: 0; border-radius: 0; }
.cp-sidebar .widget.nopadding .widget-title { margin-top: 0; }
.cp-widget-empty { color: var(--cp-mut); font-size: 13px; }
/* 标签云 */
.cp-sidebar .widget-tags .items { display: flex; flex-wrap: wrap; gap: 8px; }
.cp-sidebar .widget-tags .items a {
display: inline-block; padding: 4px 12px; font-size: 13px; line-height: 1.6;
color: var(--cp-mut); background: rgba(30,115,190,.07);
border: 1px solid var(--cp-line); border-radius: 999px;
transition: color .18s, background .18s, border-color .18s;
}
.cp-sidebar .widget-tags .items a:hover { color: #fff; background: var(--cp-blue); border-color: var(--cp-blue); }
/* 文章列表 */
.cp-sidebar .widget-postlist ul { list-style: none; margin: 0; padding: 0; }
.cp-sidebar .widget-postlist li { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px dashed var(--cp-line); }
.cp-sidebar .widget-postlist li:first-child { padding-top: 0; }
.cp-sidebar .widget-postlist li:last-child { padding-bottom: 0; border-bottom: 0; }
.cp-sidebar .widget-postlist li .img { flex: 0 0 105px; width: 105px; height: 66px; border-radius: 6px; overflow: hidden; background: rgba(30,115,190,.07); display: block; }
.cp-sidebar .widget-postlist li .img img { width: 105px; height: 66px; object-fit: cover; display: block; }
.cp-sidebar .widget-postlist li .txt { flex: 1 1 auto; min-width: 0; }
.cp-sidebar .widget-postlist li h4 { margin: 0; font-size: 14px; font-weight: 400; line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cp-sidebar .widget-postlist li h4 a { color: var(--cp-ink); }
.cp-sidebar .widget-postlist li h4 a:hover { color: var(--cp-blue); }
.cp-sidebar .widget-postlist li .meta { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 5px 0 0; font-size: 12px; color: var(--cp-mut); }
.cp-sidebar .widget-postlist li .meta .views { display: inline-flex; align-items: center; gap: 3px; }
.cp-sidebar .widget-postlist li .price .fee { display: inline-flex; align-items: center; gap: 3px; color: #e6a817; }
.cp-sidebar .widget-postlist li .price .fee-free { color: #5cb85c; }
.cp-sidebar .widget-postlist li .price .vip { color: #c99700; font-weight: 600; }
/* 纯图模式：忽略文字，两列铺图 */
.cp-sidebar .widget-postlist ul.hasimg2 { display: flex; flex-wrap: wrap; gap: 8px; }
.cp-sidebar .widget-postlist ul.hasimg2 li { flex: 0 0 calc(50% - 4px); padding: 0; border: 0; }
.cp-sidebar .widget-postlist ul.hasimg2 li .img { flex: none; width: 100%; height: 78px; }
body.cp-night .cp-sidebar .widget-tags .items a { background: rgba(88,166,255,.1); }
body.cp-night .cp-sidebar .widget-tags .items a:hover { color: #0d1117; background: var(--cp-blue); }
body.cp-night .cp-sidebar .widget-postlist li .img { background: #232a33; }
body.cp-night .cp-sidebar .widget-postlist li .price .fee { color: #e3b341; }
body.cp-night .cp-sidebar .widget-postlist li .price .vip { color: #e3b341; }
/* 分页
* ⚠️ WP 的 paginate_links( type=list ) 输出 - …，
*
必须显式 list-style:none + flex，否则 - 块级堆叠（竖排成一列）并带圆点。 */
.cp-pagination { margin-top: 30px; }
.cp-pagination .nav-links { display: flex; justify-content: center; }
.cp-pagination ul.page-numbers {
display: flex; flex-wrap: wrap; gap: 8px;
align-items: center; justify-content: center;
list-style: none; margin: 0; padding: 0;
}
.cp-pagination ul.page-numbers > li { margin: 0; list-style: none; }
.cp-pagination a, .cp-pagination .page-numbers.current { display: inline-flex; align-items: center; padding: 6px 14px; background: var(--cp-card); border: 1px solid var(--cp-line); border-radius: 6px; color: var(--cp-ink); }
.cp-pagination .page-numbers.current { color: #fff; background: var(--cp-blue); border-color: var(--cp-blue); }
.cp-pagination .page-numbers.dots { padding: 6px 2px; color: var(--cp-mut); background: none; border: 0; }
/* 面包屑 */
.cp-breadcrumbs { color: var(--cp-mut); font-size: 13px; margin-bottom: 8px; }
.cp-breadcrumbs .bc-sep { margin: 0 8px; }
.cp-breadcrumbs .bc-cur { color: var(--cp-ink); }
/* ---------- 分类页：Wiki 风格单列清单（复刻 blog.upx8.com/Free） ---------- */
.cp-catwrap { background: var(--cp-card); border: 1px solid var(--cp-line); border-radius: var(--cp-radius); padding: 26px 30px 20px; }
.cp-cathead { margin: 0 0 14px; font-size: 22px; font-weight: 600; color: var(--cp-ink); }
.cp-cathead .cp-catname { color: #ff6600; }
.cp-catlist { list-style: none; margin: 0; padding: 0; }
.cp-catlist li { border-bottom: 1px solid #f0f2f4; }
.cp-catlist li:last-child { border-bottom: 0; }
.cp-catlist li a { display: flex; align-items: baseline; gap: 18px; padding: 13px 10px; }
.cp-catdate { flex: 0 0 78px; color: var(--cp-mut); font-size: 13px; }
.cp-cattitle { color: var(--cp-ink); font-size: 14.5px; line-height: 1.6; display: inline-block; transition: transform .25s ease; }
.cp-catlist li a:hover .cp-cattitle { transform: translateX(8px); }
.cp-catlist li:hover { background: #f5f7f9; }
body.cp-night .cp-catlist li { border-bottom-color: rgba(255,255,255,.06); }
body.cp-night .cp-catlist li:hover { background: rgba(255,255,255,.05); }
.cp-catempty { color: var(--cp-mut); padding: 20px 10px; margin: 0; }
@media (max-width: 768px) {
.cp-catwrap { padding: 18px 14px 12px; }
.cp-cathead { font-size: 18px; }
.cp-catlist li a { gap: 12px; padding: 11px 6px; }
.cp-catdate { flex-basis: 72px; font-size: 12px; }
.cp-cattitle { font-size: 14px; }
}
/* ---------- 资源下载分类：缩略图+标题+价格 卡片 ----------
* 规格复刻 Modown 主题 static/css/base.css 的 `.grids .grid`
* 卡片 285×180（容器 1200 = 4×285 + 3×20）、白底、阴影 0 0 15px rgba(0,0,0,.075)、圆角 4px */
.cp-resgrids { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-bottom: 20px; }
.cp-resgrid {
position: relative; background: var(--cp-card); border-radius: 4px;
box-shadow: 0 0 15px rgba(0,0,0,.075);
transition: box-shadow .3s ease 0s, transform .3s ease 0s;
}
.cp-resgrid:hover { box-shadow: 0 0 15px rgba(0,0,0,.15); transform: translateY(-3px); }
.cp-resgrid-img { position: relative; height: 180px; overflow: hidden; border-radius: 4px 4px 0 0; background: #eef1f4; }
.cp-resgrid-img a { display: block; height: 100%; }
/* 移动端不下载真图时会被 包一层；picture 默认 inline 会让 height:100% 失效（2026-09-29） */
.cp-resgrid-img picture { display: block; height: 100%; }
.cp-resgrid-thumb {
width: 100%; height: 100%; object-fit: cover; display: block; font-size: 0;
border-radius: 4px 4px 0 0; background: #fff; transition: transform .3s ease-out 0s;
}
.cp-resgrid-img a:hover .cp-resgrid-thumb { transform: scale(1.03); }
.cp-resgrid-ph { display: flex; align-items: center; justify-content: center; color: #c3cad2; background: #eef1f4; }
.cp-resgrid-title { margin: 10px; font-size: 15px; font-weight: 400; line-height: 20px; height: 20px; overflow: hidden; }
.cp-resgrid-title a { color: var(--cp-ink); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-resgrid-title a:hover { color: var(--cp-blue); }
.cp-resgrid-meta { display: flex; align-items: center; color: var(--cp-mut); padding: 0 10px 10px; font-size: 12px; height: 30px; overflow: hidden; }
.cp-resgrid-time, .cp-resgrid-views { display: inline-flex; align-items: center; gap: 3px; margin-right: 8px; }
.cp-resgrid-meta svg { flex: 0 0 auto; }
.cp-resgrid-price { margin-left: auto; }
.cp-resgrid-fee {
display: inline-flex; align-items: center; gap: 2px; background: #ababab; color: #fff;
padding: 1px 4px; border-radius: 2px; position: relative; top: 1px; white-space: nowrap;
}
.cp-resgrid-fee svg { display: block; }
.cp-resgrid-fee-free { background: #5cb85c; }
.cp-resgrid-fee-vip { background: #e0bf73; color: #4e342e; }
/* 左上角标：VIP（金色渐变）/ 免费（绿色） */
.cp-resgrid-tag {
position: absolute; top: 0; left: 0; z-index: 10;
background: #e0bf73; background-image: linear-gradient(90deg, #f0d68d 0%, #e0bf73 100%);
color: #4e342e; padding: 0 4px; font-size: 12px; line-height: 20px; min-width: 32px;
border-radius: 4px 0 4px 0;
}
.cp-resgrid-tag i { font-style: normal; }
.cp-resgrid-tag-free { background: #5cb85c; background-image: none; color: #fff; }
/* 右上角「推荐」（Modown .recommend-tag，带左上小三角） */
.cp-resgrid-recommend {
position: absolute; top: -5px; right: 10px; height: 20px; line-height: 20px;
border-radius: 2px; border-top-left-radius: 0;
background: var(--cp-blue); color: #fff; font-size: 12px; padding: 0 4px;
}
.cp-resgrid-recommend:before {
content: ""; position: absolute; left: -5px; top: 0; width: 0; height: 0;
border-style: solid; border-width: 0 0 5px 5px;
border-color: transparent transparent var(--cp-blue) transparent;
}
body.cp-night .cp-resgrid-img, body.cp-night .cp-resgrid-ph { background: #232a33; }
body.cp-night .cp-resgrid-ph { color: #4b5563; }
@media (max-width: 1024px) { .cp-resgrids { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 768px) {
.cp-resgrids { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cp-resgrid-img { height: 130px; }
.cp-resgrid-title { font-size: 14px; }
}
/* ---------- 正文图片：左对齐 + 统一宽度（粘贴图片无需逐张调整） ---------- */
.cp-article-content img:not(.wp-smiley):not(.emoji) {
display: block;
width: 100%;
max-width: 100%;
height: auto;
margin: 14px auto 14px 0; /* 左对齐 */
border-radius: 6px;
}
/* 图片对齐类的旧习惯容器一并拉平，保证统一左对齐等宽 */
.cp-article-content .wp-block-image.aligncenter,
.cp-article-content .wp-block-image.alignright,
.cp-article-content .aligncenter,
.cp-article-content .alignright { float: none; margin-left: 0; margin-right: auto; text-align: left; }
.cp-article-content figure { margin: 14px 0; }
.cp-article-content figure img { margin: 0; }
/* ---------- 正文「外部复制」污染护栏 v2（常驻，2026-10-02 加固） ----------
* 第三道防线：即使前两道（入库净化 / 运行时净化）都漏了，CSS 也要把版面和夜间配色兜住。
* 覆盖两类外部痕迹：
* ① 撑破容器：内联 width / max-width / table-layout:fixed / overflow:hidden
* ② 夜间白底黑字：内联 background-color:#fff* / #f5f5f5* / #eee* …、color:#000* / #444* / #555* / #666*
* 内联样式优先级高，必须 !important 才能压过去。
*/
/* ① 表格一律自适应，不再按内联固定宽渲染 */
.cp-article-content table {
width: 100% !important;
max-width: 100% !important;
table-layout: auto !important;
border-collapse: collapse;
}
.cp-article-content td,
.cp-article-content th { max-width: 100%; }
/* ② 带内联固定宽 / overflow 的容器拉平为自适应 */
.cp-article-content div[style*="width"],
.cp-article-content p[style*="width"],
.cp-article-content span[style*="width"],
.cp-article-content section[style*="width"],
.cp-article-content table[style*="width"],
.cp-article-content [style*="max-width"] {
width: auto !important;
max-width: 100% !important;
}
.cp-article-content [style*="overflow"] { overflow: visible !important; }
.cp-article-content [style*="table-layout"] { table-layout: auto !important; }
/* ③ 夜间模式：清掉外部带进来的白/浅底与深色字，回归主题配色。
* 用「属性前缀」选择器覆盖全部色深档位；属性选择器不区分大小写由 [style*=""] 逐项列出。 */
body.cp-night .cp-article-content [style*="#fff"],
body.cp-night .cp-article-content [style*="#FFF"],
body.cp-night .cp-article-content [style*="#ffffff"],
body.cp-night .cp-article-content [style*="#FFFFFF"],
body.cp-night .cp-article-content [style*="#fefefe"],
body.cp-night .cp-article-content [style*="#f5f5f5"],
body.cp-night .cp-article-content [style*="#f8f8f8"],
body.cp-night .cp-article-content [style*="#fafafa"],
body.cp-night .cp-article-content [style*="#eee"],
body.cp-night .cp-article-content [style*="#EEE"],
body.cp-night .cp-article-content [style*="#eeeeee"],
body.cp-night .cp-article-content [style*="#e0e0e0"],
body.cp-night .cp-article-content [style*="#ddd"],
body.cp-night .cp-article-content [style*="#DDD"],
body.cp-night .cp-article-content [style*="#dddddd"],
body.cp-night .cp-article-content [style*="background:white"],
body.cp-night .cp-article-content [style*="background-color:white"] {
background-color: transparent !important;
background-image: none !important;
}
body.cp-night .cp-article-content [style*="#000"],
body.cp-night .cp-article-content [style*="#111"],
body.cp-night .cp-article-content [style*="#222"],
body.cp-night .cp-article-content [style*="#333"],
body.cp-night .cp-article-content [style*="#444"],
body.cp-night .cp-article-content [style*="#555"],
body.cp-night .cp-article-content [style*="#666"],
body.cp-night .cp-article-content [style*="color:black"] {
color: inherit !important;
}
/* 带内联颜色的链接：夜间强制用主题亮蓝，否则深色链接在深底上几乎看不见 */
body.cp-night .cp-article-content a[style*="color"] { color: var(--cp-blue) !important; }
/* ---------- 网站公告条（页头 / 样式二首页内容区共用，卡片式） ----------
* 2026-10-02 v1.7.9：原为「蓝色实底横条」(.cp-notice-bar)，现与样式二首页
* 「专题入口」下方那条统一成同一种卡片（白底 + 左侧红竖条 + 红色标签）。
* 两个位置的结构由 inc/helpers.php 的 cp_notice_html() 统一产出。 */
.cp-notice-wrap { padding: 12px 0 0; }
.cp-notice {
display: flex;
align-items: center;
gap: 8px;
padding: 12px 18px;
background: var(--cp-card);
border: 1px solid var(--cp-line);
border-left: 3px solid #e4393c;
border-radius: 6px;
}
.cp-notice-tag { flex: 0 0 auto; color: #e4393c; font-size: 15px; font-weight: 700; }
.cp-notice-text {
flex: 1 1 auto;
min-width: 0;
font-size: 15px;
font-weight: 600;
line-height: 26px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.cp-notice-text a { color: inherit; text-decoration: none; }
.cp-notice-text a:hover { color: #e4393c; }
body.cp-night .cp-notice { border-left-color: #f0645f; }
body.cp-night .cp-notice-tag { color: #f0645f; }
body.cp-night .cp-notice-text a:hover { color: #f0645f; }
/* 样式二首页：公告已显示在内容区「专题入口」下方，收起页头那条避免出现两次 */
body.cp-s2 .cp-notice-wrap { display: none; }
/* 页脚 */
.cp-footer { background: #fff; border-top: 1px solid var(--cp-line); padding: 30px 20px 40px; }
body.cp-night .cp-footer { background: var(--cp-card); }
.cp-footer-inner { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; color: var(--cp-mut); font-size: 13.5px; }
.cp-footer-widgets { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; padding: 0 0 24px; }
.cp-footer-widgets .widget-title { font-size: 15px; margin: 0 0 10px; }
/* 搜索框 */
.cp-search { display: flex; gap: 0; }
.cp-search input[type=search] { border: 1px solid var(--cp-line); border-right: 0; border-radius: 6px 0 0 6px; padding: 7px 12px; color: var(--cp-ink); background: #fff; outline: none; }
.cp-search button { border: 1px solid var(--cp-line); border-left: 0; background: var(--cp-blue); color: #fff; border-radius: 0 6px 6px 0; cursor: pointer; padding: 0 16px; }
/* 下载框位置（独立模块/内容上/内容下/边栏） */
.cp-down-module, .cp-down-above, .cp-down-below { margin: 18px 0; }
.cp-down-module .erphpdown-box, .cp-down-above .erphpdown-box, .cp-down-below .erphpdown-box { margin: 0; }
.cp-sidebar-box { background: var(--cp-card); border: 1px solid var(--cp-line); border-radius: var(--cp-radius); padding: 16px; margin-bottom: 16px; }
.cp-sidebar-box .erphpdown-box { margin: 0; }
/* 评论区基础 */
#comments { background: var(--cp-card); border: 1px solid var(--cp-line); border-radius: var(--cp-radius); padding: 24px; margin-top: 24px; }
/* VIP 介绍区 */
.cp-vip-intro, .cp-vip-faq { margin-top: 28px; }
.cp-section-title { font-size: 18px; margin: 0 0 14px; padding-bottom: 10px; border-bottom: 1px solid var(--cp-line); }
.cp-vip-tiers { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.cp-vip-tier { background: var(--cp-bg); border: 1px solid var(--cp-line); border-radius: 10px; padding: 16px; }
.cp-vip-tier-name { font-size: 15px; margin: 0 0 10px; }
.cp-vip-tier ul { margin: 0; padding: 0; list-style: none; }
.cp-vip-tier li { padding: 4px 0 4px 18px; position: relative; font-size: 13.5px; color: var(--cp-mut); }
.cp-vip-tier li::before { content: ''; position: absolute; left: 0; top: 12px; width: 6px; height: 6px; border-radius: 50%; background: var(--cp-blue); }
.cp-faq-item { padding: 12px 0; border-bottom: 1px solid var(--cp-line); }
.cp-faq-item:last-child { border-bottom: 0; }
.cp-faq-item b { display: block; font-size: 14.5px; margin-bottom: 4px; }
.cp-faq-item p { font-size: 13.5px; color: var(--cp-mut); margin: 0; }
/* 用户中心（[erphpdown_sc_user] 输出结构）
* 插件原 CSS：wrap 有 padding-left:150px，aside 是 position:absolute;top:0;bottom:0（不撑高容器）
* ⇒ 菜单比内容长时整列溢出到卡片外。这里全部改回正常文档流 + flex。 */
.cp-user-center .erphpdown-sc-user-wrap { position: static; padding-left: 0; display: flex; gap: 24px; }
.cp-user-center .erphpdown-sc-user-aside { position: static; flex: 0 0 190px; width: auto; list-style: none; margin: 0; padding: 0; }
.cp-user-center .erphpdown-sc-user-aside li { margin: 0 0 6px; }
.cp-user-center .erphpdown-sc-user-aside li a { display: block; padding: 9px 14px; border-radius: 7px; color: var(--cp-ink); font-size: 14px; background: var(--cp-bg); }
.cp-user-center .erphpdown-sc-user-aside li.active a { background: var(--cp-blue); color: #fff; }
/* 触屏上「按住拖动滚动」会把 :hover 留在手指落点 ⇒ 菜单会莫名多出一个蓝底项
* （2026-10-06 手机端个人中心的截图里「个人资料」无端变蓝就是这个原因）
* ⇒ 悬停反馈只给真正支持悬停的设备。 */
@media (hover: hover) and (pointer: fine) {
.cp-user-center .erphpdown-sc-user-aside li a:hover { background: var(--cp-blue); color: #fff; }
}
.cp-user-center .erphpdown-sc-user-content { flex: 1; min-width: 0; border: 0; }
/* 推广链接：高亮 + 一键复制 */
.cp-user-center .cp-aff-link {
display: inline-block; margin: 0 2px; padding: 2px 12px; border-radius: 14px;
background: rgba(30,115,190,.12); border: 1px solid rgba(30,115,190,.35);
color: var(--cp-blue) !important; font-weight: 600; word-break: break-all;
}
.cp-aff-copy {
display: inline-block; margin-left: 8px; padding: 2px 14px; border: 0; border-radius: 14px;
background: var(--cp-blue); color: #fff; font-size: 12.5px; line-height: 20px; cursor: pointer; vertical-align: middle;
}
.cp-aff-copy:hover { background: var(--cp-blue-d); }
.cp-aff-copy.cp-copy-ok { background: #1a9e55; }
@media (max-width: 768px) {
/* 用户中心菜单：等宽三列网格
* 原写法是 flex-wrap + li{flex:1 1 auto} —— 每格宽度随文字长度自动伸缩，
* 「充值记录 / VIP记录 / 申请提现」这类 4~5 字混排时宽窄不一、行距只剩 6px，
* 视觉上就是「全挤在一起」。改用 grid 等分 + 统一格高 + 外框卡片拉开层次。
* 另：插件 CSS 给 li 写了 padding:10px 20px 10px 30px、给 li.active 加了橙色竖条，
* 这里必须一并归零，否则每格横向被吃掉 50px、文字会被挤到换行。 */
.cp-user-center .erphpdown-sc-user-wrap { flex-direction: column; gap: 14px; }
.cp-user-center .erphpdown-sc-user-aside {
flex: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 8px; padding: 10px; width: auto;
background: var(--cp-card); border: 1px solid var(--cp-line); border-radius: 12px;
}
.cp-user-center .erphpdown-sc-user-aside li { margin: 0; padding: 0; }
.cp-user-center .erphpdown-sc-user-aside li.active::before { display: none; }
.cp-user-center .erphpdown-sc-user-aside li a {
display: flex; align-items: center; justify-content: center;
min-height: 44px; padding: 8px 4px; border-radius: 9px;
background: var(--cp-bg); border: 1px solid var(--cp-line);
font-size: 13px; line-height: 1.2; text-align: center;
}
.cp-user-center .erphpdown-sc-user-aside li.active a { border-color: var(--cp-blue); font-weight: 600; }
/* 退出登录是「离开」类动作，单独用红字提示，避免误点 */
.cp-user-center .erphpdown-sc-user-aside li a[href*="action=logout"] { color: #d4380d; }
/* 插件给内容区写死 min-height:580px，短面板（邮件通知等）会拖出一大片空白 */
.cp-user-center .erphpdown-sc-user-content { min-height: 0; }
}
/* 夜间模式：插件用户中心 / 表格 / 表单的硬编码浅色覆盖 */
body.cp-night .cp-user-center .erphpdown-sc-user-wrap { background: var(--cp-card); }
body.cp-night .cp-user-center .erphpdown-sc-user-aside { background: rgba(255,255,255,.04); }
body.cp-night .cp-user-center .erphpdown-sc-user-aside li a { color: var(--cp-ink); }
/* 夜间：上面那条 li a 选择器权重 (0,3,3) 会反超 .active 的 (0,3,2)，
* 会让选中项变成「深灰字 + 蓝底」。补一条更高权重的修正，并给退出项配夜间的红。 */
body.cp-night .cp-user-center .erphpdown-sc-user-aside li.active a { color: #fff; }
body.cp-night .cp-user-center .erphpdown-sc-user-aside li a[href*="action=logout"] { color: #ff7b72; }
body.cp-night .cp-user-center .erphpdown-sc-user-content { border-color: var(--cp-line); }
body.cp-night .cp-article .erphpdown-sc h2,
body.cp-night .cp-article .erphpdown-sc-user-content h2,
body.cp-night .cp-article .erphpdown-sc-user-content h3 { color: var(--cp-ink); }
body.cp-night .cp-article .erphpdown-sc table,
body.cp-night .cp-user-center table { color: var(--cp-ink); }
body.cp-night .cp-article .erphpdown-sc table th,
body.cp-night .cp-article .erphpdown-sc table td,
body.cp-night .cp-user-center table th,
body.cp-night .cp-user-center table td { border-color: var(--cp-line) !important; background: transparent; }
body.cp-night .cp-article input[type=text],
body.cp-night .cp-article input[type=number],
body.cp-night .cp-article input[type=email],
body.cp-night .cp-article input[type=password],
body.cp-night .cp-article input[type=tel],
body.cp-night .cp-article select,
body.cp-night .cp-article textarea {
background: #0d1117; color: var(--cp-ink); border-color: #30363d;
}
body.cp-night .cp-aff-link { background: rgba(88,166,255,.14); border-color: rgba(88,166,255,.4); }
/* 按钮通用 */
.button { display: inline-block; padding: 8px 20px; border-radius: 7px; border: 1px solid var(--cp-line); color: var(--cp-ink); }
.button-primary { background: var(--cp-blue); border-color: var(--cp-blue); color: #fff; }
.button-primary:hover { background: var(--cp-blue-d); color: #fff; }
/* 登录表单 */
#loginform input[type=text], #loginform input[type=password], #loginform input[type=email] { width: 100%; padding: 9px 12px; border: 1px solid var(--cp-line); border-radius: 7px; margin-bottom: 12px; font-size: 14px; color: var(--cp-ink); background: #fff; }
#loginform .button-primary, #loginform input[type=submit] { width: 100%; }
/* ================================================================================
* 手机端自适应（≤768px）
* ⚠️ 这一节必须留在文件**最末尾**：同优先级下后写的规则生效，
* 写在中途会被上面的基础规则（.cp-article 边框 / .cp-single-title 26px 等）反超。
* ================================================================================ */
@media (max-width: 768px) {
/* 骨架收紧 */
.cp-main { padding: 14px 0 36px; }
.cp-grid { gap: 16px; }
/* 首页分类卡片（[mocat] 区块） */
.cp-block { padding: 18px 16px; }
.cp-block-title { font-size: 18px; margin-bottom: 14px; gap: 8px; min-width: 0; }
.cp-block-name { min-width: 0; overflow-wrap: anywhere; }
.cp-block-more { padding: 4px 12px 4px 14px; font-size: 12.5px; }
.cp-block-list li { padding-left: 26px; margin-bottom: 11px; }
.cp-block-item-text { font-size: 14.5px; }
/* 文章页：取消正文卡片边框 / 圆角 / 阴影；标题降字号；正文保留 16px 便于阅读 */
.cp-article { border: 0; border-radius: 0; box-shadow: none; padding: 18px 14px 20px; font-size: 16px; }
.cp-single-head { margin-bottom: 14px; }
.cp-single-title { font-size: 21px; line-height: 1.45; margin: 8px 0 6px; }
.cp-article-content h2 { font-size: 20px; }
.cp-article-content h3 { font-size: 17px; }
.cp-article-content img:not(.wp-smiley):not(.emoji) { margin: 12px auto 12px 0; }
.cp-tags { margin-top: 16px; }
.cp-sharebar { flex-wrap: wrap; gap: 8px; }
.cp-post-nav { flex-direction: column; gap: 6px; font-size: 13.5px; }
.cp-post-nav .pn-next { text-align: left; }
.cp-down-module, .cp-down-above, .cp-down-below { margin: 14px 0; }
/* 评论 / 分页 / 页脚 */
#comments { padding: 18px 14px; margin-top: 20px; }
.cp-pagination { margin-top: 22px; }
.cp-footer { padding: 24px 20px 32px; }
/* 卡片列表（首页/归档/搜索/最新发布/相关文章）：手机端两列；标题放开两行，避免只显示半句 */
.cp-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cp-card-title { font-size: 13.5px; padding: 8px 10px 10px; }
.cp-card-title a { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cp-card-meta { font-size: 12px; }
/* VIP 档位单列 */
.cp-vip-tiers { grid-template-columns: minmax(0, 1fr); }
/* 资源下载分类：取消缩略图卡片，改为标题清单行（与其它分类的 Wiki 清单统一） */
.cp-resgrids { display: block; margin-bottom: 10px; }
.cp-resgrid {
display: flex; align-items: center; gap: 10px;
background: transparent; box-shadow: none; border-radius: 0;
padding: 12px 2px; border-bottom: 1px solid #f0f2f4;
}
.cp-resgrid:last-child { border-bottom: 0; }
.cp-resgrid:hover { box-shadow: none; background: #f5f7f9; transform: none; }
.cp-resgrid-img, .cp-resgrid-tag { display: none; } /* 取消缩略图与图上角标 */
.cp-resgrid-title { flex: 1 1 auto; min-width: 0; margin: 0; height: auto; font-size: 14.5px; line-height: 1.55; }
.cp-resgrid-title a { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cp-resgrid-meta { flex: 0 0 auto; height: auto; padding: 0; gap: 6px; font-size: 11.5px; }
.cp-resgrid-time, .cp-resgrid-views { margin-right: 0; }
.cp-resgrid-recommend { position: static; order: -1; flex: 0 0 auto; height: 17px; line-height: 17px; margin: 0 6px 0 0; border-radius: 3px; font-size: 11px; }
.cp-resgrid-recommend:before { display: none; }
body.cp-night .cp-resgrid { border-bottom-color: rgba(255,255,255,.06); }
body.cp-night .cp-resgrid:hover { background: rgba(255,255,255,.05); }
}
/* ---------------------------------------------------------------------------
* 首页 H1（SEO / 无障碍）与分类页描述（2026-10-01）
* ------------------------------------------------------------------------- */
.cp-home-title { margin: 0 0 18px; font-size: 22px; font-weight: 600; color: var(--cp-ink); }
.cp-archive-desc {
margin: 16px 0 4px;
padding: 12px 16px;
background: var(--cp-card);
border: 1px solid var(--cp-line);
border-radius: 8px;
color: var(--cp-mut);
font-size: 13.5px;
line-height: 1.8;
}
.cp-archive-desc p { margin: 0 0 8px; }
.cp-archive-desc p:last-child { margin-bottom: 0; }
@media (max-width: 768px) {
.cp-home-title { font-size: 18px; }
.cp-archive-desc { font-size: 13px; padding: 10px 12px; }
}
/* ---------------------------------------------------------------------------
* 空状态（分类暂无内容 / 文旅课堂建设中 / 404 页）
* ------------------------------------------------------------------------- */
.cp-empty {
margin: 10px 0 6px;
padding: 56px 24px;
text-align: center;
background: var(--cp-card);
border: 1px solid var(--cp-line);
border-radius: 12px;
}
.cp-empty-icon { display: inline-flex; color: var(--cp-blue); opacity: .75; margin-bottom: 14px; }
.cp-empty-code { display: block; font-size: 64px; font-weight: 700; line-height: 1; color: var(--cp-blue); letter-spacing: 2px; margin-bottom: 10px; }
.cp-empty-title { margin: 0 0 10px; font-size: 20px; font-weight: 600; color: var(--cp-ink); }
.cp-empty-desc { margin: 0 auto; max-width: 560px; color: var(--cp-mut); font-size: 14px; line-height: 1.8; }
.cp-empty-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 22px; }
.cp-empty-btn { display: inline-block; padding: 9px 22px; border-radius: 8px; background: var(--cp-blue); color: #fff; font-size: 14px; text-decoration: none; }
.cp-empty-btn:hover { background: var(--cp-blue-d); color: #fff; }
.cp-empty-btn-ghost { background: transparent; color: var(--cp-ink); border: 1px solid var(--cp-line); }
.cp-empty-btn-ghost:hover { background: var(--cp-bg); color: var(--cp-ink); }
.cp-empty-search { max-width: 420px; margin: 20px auto 0; }
.cp-empty-search .searchform { display: flex; gap: 8px; }
.cp-empty-search input[type="search"],
.cp-empty-search input[type="text"] {
flex: 1 1 auto; min-width: 0; padding: 9px 12px;
border: 1px solid var(--cp-line); border-radius: 8px;
background: var(--cp-card); color: var(--cp-ink); font-size: 14px;
}
.cp-empty-search input[type="submit"] {
flex: 0 0 auto; padding: 9px 18px; border: 0; border-radius: 8px;
background: var(--cp-blue); color: #fff; font-size: 14px; cursor: pointer;
}
@media (max-width: 768px) {
.cp-empty { padding: 36px 16px; }
.cp-empty-code { font-size: 48px; }
.cp-empty-title { font-size: 17px; }
}
/* ---------- 侧栏小工具：开通会员（widget-vip，复刻参考样式 2026-10-02） ---------- */
.cp-sidebar .widget-vip .widget-title {
position: relative;
padding-left: 12px;
border-bottom: 1px solid var(--cp-line);
}
.cp-sidebar .widget-vip .widget-title::before {
content: "";
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 4px;
height: 16px;
border-radius: 2px;
background: var(--cp-blue);
}
.cp-vip { color: var(--cp-ink); }
.cp-vip-desc { margin: 0 0 12px; font-size: 13.5px; line-height: 1.8; color: var(--cp-ink); }
.cp-vip-sub { margin: 0 0 10px; font-size: 14px; font-weight: 700; color: var(--cp-ink); }
.cp-vip-perks {
list-style: none;
margin: 0 0 14px;
padding: 0;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 10px 8px;
}
.cp-vip-perks li { display: flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--cp-ink); min-width: 0; }
.cp-vip-perks li span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cp-vip-check { flex: 0 0 auto; color: var(--cp-blue); }
.cp-vip-btn {
display: block;
padding: 11px 12px;
border-radius: 8px;
color: #fff;
font-size: 15px;
font-weight: 600;
letter-spacing: 2px;
text-align: center;
text-decoration: none;
cursor: pointer;
transition: filter .15s ease;
}
a.cp-vip-btn:hover { filter: brightness(.92); color: #fff; }
@media (max-width: 768px) {
.cp-vip-perks { gap: 8px 6px; }
.cp-vip-btn { padding: 10px 12px; font-size: 14px; }
}
/* ---------- 文旅课堂·视频分类（v1.7.0 2026-10-02） ---------- */
.cp-videogrids {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 20px;
margin-bottom: 20px;
}
.cp-videocard {
background: var(--cp-card);
border: 1px solid var(--cp-line);
border-radius: 10px;
overflow: hidden;
transition: box-shadow .2s ease, transform .2s ease;
}
.cp-videocard:hover { box-shadow: 0 6px 20px rgba(0,0,0,.08); transform: translateY(-2px); }
.cp-videocard-img { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.cp-videocard-thumb { width: 100%; height: 100%; object-fit: cover; display: block; }
.cp-videocard-ph { display: flex; align-items: center; justify-content: center; color: #c3cad2; background: #eef1f4; }
.cp-videocard-play {
position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
width: 46px; height: 46px; border-radius: 50%;
background: rgba(0,0,0,.55); color: #fff;
display: flex; align-items: center; justify-content: center;
transition: background .15s ease;
}
.cp-videocard:hover .cp-videocard-play { background: var(--cp-blue); }
.cp-videocard-play svg { margin-left: 3px; }
.cp-videocard-dur {
position: absolute; right: 6px; bottom: 6px;
background: rgba(0,0,0,.7); color: #fff; font-size: 12px;
padding: 1px 6px; border-radius: 4px; line-height: 1.6;
}
.cp-videocard-vip {
position: absolute; left: 6px; top: 6px;
background: linear-gradient(135deg,#ff7a18,#ffb347); color: #fff;
font-size: 12px; font-weight: 700; padding: 1px 7px; border-radius: 4px;
}
.cp-videocard-title { margin: 0; padding: 10px 10px 0; font-size: 15px; line-height: 1.5; }
.cp-videocard-title a { color: var(--cp-ink); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cp-videocard-meta { display: flex; align-items: center; gap: 10px; color: var(--cp-mut); padding: 6px 10px 12px; font-size: 12px; }
.cp-videocard-time, .cp-videocard-views, .cp-videocard-price { display: inline-flex; align-items: center; gap: 3px; }
.cp-videocard-price { color: #e6a817; margin-left: auto; }
/* 单页视频播放块 */
.cp-video-block { margin: 4px 0 22px; }
.cp-video-inner { position: relative; width: 100%; aspect-ratio: 16 / 9; background: #000; border-radius: 8px; overflow: hidden; }
.cp-video-el, .cp-video-frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.cp-video-locked {
position: relative;
aspect-ratio: 16 / 9; background: #11161c center/cover no-repeat; border-radius: 8px;
display: flex; flex-direction: column; align-items: center; justify-content: center;
gap: 12px; padding: 16px; overflow: hidden;
}
/* 有封面图时压暗，做成"视频封面 + 锁定浮层"的观感 */
.cp-video-locked[style*="background-image"]::before {
content: ""; position: absolute; inset: 0;
background: linear-gradient(180deg, rgba(8,12,18,.34) 0%, rgba(8,12,18,.72) 60%, rgba(8,12,18,.84) 100%);
}
.cp-video-locked > * { position: relative; z-index: 1; }
.cp-video-mask { display: flex; align-items: center; justify-content: center; }
.cp-video-play {
width: 54px; height: 54px; border-radius: 50%;
background: rgba(255,255,255,.92); color: #11161c;
display: flex; align-items: center; justify-content: center;
}
.cp-video-play svg { margin-left: 4px; }
.cp-video-locktext { color: #fff; text-align: center; font-size: 14px; line-height: 1.8; max-width: 92%; text-shadow: 0 1px 4px rgba(0,0,0,.65); }
.cp-video-locktext .erphpdown-price { color: #ffcf6b; font-weight: 700; }
.cp-video-locktext a.erphpdown-buy,
.cp-video-locktext a.erphpdown-vip {
display: inline-block; margin: 8px 6px 0; padding: 7px 18px;
border-radius: 6px; color: #fff; text-decoration: none; font-size: 14px;
text-shadow: none;
}
.cp-video-locktext a.erphpdown-buy { background: var(--cp-blue); }
.cp-video-locktext a.erphpdown-vip { background: #e6a817; }
@media (max-width: 768px) {
.cp-video-locked { gap: 8px; padding: 12px 10px; }
.cp-video-play { width: 44px; height: 44px; }
.cp-video-play svg { width: 26px; height: 26px; }
.cp-video-locktext { font-size: 12.5px; line-height: 1.6; max-width: 96%; }
.cp-video-locktext a.erphpdown-buy,
.cp-video-locktext a.erphpdown-vip { margin-top: 6px; padding: 6px 14px; font-size: 13px; }
}
/* 分集菜单 */
.cp-video-eps { margin: 16px 0 0; }
.cp-video-eps-title { margin: 0 0 8px; font-size: 15px; font-weight: 600; color: var(--cp-ink); }
.cp-video-eps-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 6px 16px; }
.cp-video-eps-list li a {
color: var(--cp-ink); display: block; padding: 8px 10px;
border-radius: 6px; background: var(--cp-bg); border: 1px solid var(--cp-line);
}
.cp-video-eps-list li.active a { border-color: var(--cp-blue); color: var(--cp-blue); font-weight: 600; }
.cp-video-eps-time { float: right; color: var(--cp-mut); font-size: 12px; }
@media (max-width: 768px) {
.cp-videogrids { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.cp-video-eps-list { grid-template-columns: 1fr; }
}