/* ==========================================================
   手机CMS · 前台样式
   000 号版式铁律：
     · 内容区 1360px，手机与电脑显示一致（不做响应式收缩）
     · 不设右侧边栏（其它 CMS 的侧栏区块一律不复用）
     · 顶部栏 50px：站点名 + 搜索框 + 登录按钮 + 访问统计
     · 主导航 64px：可点击的栏目（000 号「导航栏高 64px」说的是这一条，不是顶部栏）
     · 导航横向超出可滑动（手机一屏 6 个栏目，电脑十几个才滑）

   ★ 高度别再搞反：顶部栏矮、主导航高。
     主导航才是站长最该被看到的东西 —— 一进站能点的栏目就该是最显眼的一块。
   ========================================================== */

:root {
    --blue: #2f6fed;
    /* 主导航紫色：与社群CMS(sqcms) 统一，三栏CMS 用的是蓝 #3b6ef5 */
    --purple: #6c5ce7;      /* 主色 */
    --purple-d: #5a4bd1;    /* 深色：hover */
    --purple-l: #a29bfe;    /* 浅色 */
    --purple-bg: #f3f1fe;   /* 导航底色 */
    --text: #2c3e50;
    --muted: #8b96a3;
    --line: #e8ecf1;
    --bg: #f5f7fa;
    --white: #fff;
    --topbar-h: 50px;   /* 顶部栏：矮，只放站名/搜索/登录/统计 */
    --nav-h: 64px;      /* 主导航：高，栏目是主角 */
}

* { box-sizing: border-box; }

html, body {
    margin: 0;
    padding: 0;
    background: var(--bg);
    color: var(--text);
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
    font-size: 14px;
    line-height: 1.75;
    -webkit-font-smoothing: antialiased;
}
a { color: var(--blue); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; height: auto; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4 { margin: 0; font-weight: 600; }

/* ---------- 主体容器：1360px ---------- */
.wrap {
    width: 1360px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ==========================================================
   顶部栏（000 号第 5 条）—— 50px，矮的一层，只放辅助功能
   ========================================================== */
.topbar {
    background: var(--white);
    border-bottom: 1px solid var(--line);
}
.tb-inner {
    width: 1360px;
    margin: 0 auto;
    padding: 0 20px;
    height: var(--topbar-h);   /* ★ 50px，不是 64px */
    display: flex;
    align-items: center;
    gap: 18px;
}

/* 站点名称 / Logo */
.tb-logo { flex-shrink: 0; max-width: 260px; }
.logo-text {
    font-size: 20px;          /* 50px 栏里 22px 偏大，收到 20px 更协调 */
    font-weight: 700;
    color: var(--text);
    letter-spacing: .5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}
.logo-text:hover { text-decoration: none; color: var(--blue); }
/* 002 号：图片 Logo 建议高 50px；但顶部栏只有 50px，
   留 5px 余量用 40px，否则图片会顶满整栏、看不出是 logo */
.logo-img { max-height: 40px; display: block; }

/* 搜索框：站点名称的右侧 */
.tb-search {
    flex: 0 1 340px;
    display: flex;
    position: relative;
}
.tb-search-input {
    width: 100%;
    height: 34px;             /* 50px 栏里 38px 偏挤，收到 34px */
    padding: 0 40px 0 16px;
    border: 1px solid #dfe3e8;
    border-radius: 17px;      /* 胶囊式 */
    font-size: 14px;
    font-family: inherit;
    background: #f7f8fa;
}
.tb-search-input:focus {
    outline: 0;
    background: #fff;
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(47, 111, 237, .1);
}
.tb-search-btn {
    position: absolute;
    right: 3px; top: 3px;
    width: 28px; height: 28px;
    border: 0;
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
}
.tb-search-btn:hover { color: var(--blue); background: #eef2f8; }

/* 登录按钮：搜索框的右侧 */
.tb-account { flex-shrink: 0; }
.tb-login-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 34px;             /* 与搜索框同高，50px 栏里看着协调 */
    padding: 0 16px;
    border-radius: 17px;
    background: var(--blue);
    color: #fff;
    font-size: 14px;
}
.tb-login-btn:hover { background: #2559c9; text-decoration: none; color: #fff; }
.tb-login-btn.on { background: #1a9d4b; }
.tb-login-btn.on:hover { background: #17853f; }

/* 访问统计：接着显示 本页/全站（002 号） */
.tb-stat {
    margin-left: auto;
    flex-shrink: 0;
    font-size: 13px;
    color: var(--muted);
    white-space: nowrap;
}
.tb-stat b { color: var(--text); font-weight: 600; }

/* ==========================================================
   主导航（987 号：横向滑动 + 紫色胶囊样式）
   000 号：「导航栏高 64px」说的就是这一条 —— 可点击的栏目才叫导航栏。

   配色与社群CMS 统一（--purple 系列，取自 sqcms 的 --primary）：
     底色浅紫、字深紫、选中实心紫 —— 顶部栏保持白色，只有主导航是紫的，
     两层一白一紫，一眼分得清谁是辅助、谁是主角。
   ========================================================== */
.navbar {
    background: #f3f1fe;                 /* 浅紫底，比纯白更托得出胶囊 */
    border-bottom: 1px solid #e3dffa;
    position: sticky;
    top: 0;
    z-index: 100;
}
.nav-inner { width: 1360px; margin: 0 auto; padding: 0 20px; }

/* 横向滚动容器：出屏时可左右滑动（无可见滚动条） */
.nav-scroll {
    overflow: hidden;           /* 隐藏滚动条 */
    scrollbar-width: none;      /* Firefox */
    -ms-overflow-style: none;
}
.nav-scroll::-webkit-scrollbar { display: none; }

.nav-list {
    display: flex;
    align-items: center;
    height: var(--nav-h);   /* ★ 64px */
    white-space: nowrap;
    gap: 8px;               /* 胶囊之间留缝，一颗颗分开 */
}
.nav-item { position: relative; flex-shrink: 0; }

/* 胶囊本体：圆角药丸，浅紫底 + 深紫字 */
.nav-link {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 0 20px;
    height: 38px;            /* 胶囊不必撑满 64px，上下留白才像「一颗颗」 */
    border-radius: 19px;     /* 胶囊形 */
    background: #fff;
    color: var(--purple);
    font-size: 15px;
    cursor: pointer;
    transition: background .18s, color .18s;
    text-decoration: none;
}
.nav-link:hover {
    background: var(--purple);
    color: #fff;
    text-decoration: none;
}
/* 当前栏目：实心紫，一眼定位 */
.nav-item > .nav-link.on {
    background: var(--purple);
    color: #fff;
    font-weight: 600;
}

/* 层级标识：收起=▶（尖尖朝右），展开=▼（尖尖朝下）
   987 号规定：收起 ▶ 蓝色、展开 ▼ 蓝色。手机CMS 目前只有一级栏目用不到，
   保留规则不动，将来加子栏目时颜色才和 987 号一致 */
.nav-arrow, .sub-arrow {
    width: 0; height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 6px solid #2f6fed;    /* ▶ 尖尖朝右 */
    transition: transform .18s;
    display: inline-block;
}
.nav-item.open > .nav-link .nav-arrow,
.sub-item.open > a .sub-arrow { transform: rotate(90deg); }   /* ▼ 尖尖朝下 */

/* 下拉面板 */
.submenu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 170px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 6px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .1);
    padding: 6px 0;
    display: none;
    max-height: 70vh;
    overflow-y: auto;
    z-index: 101;
}
.nav-item.open > .submenu { display: block; }

.sub-item { position: relative; }
.sub-item > a {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 9px 16px 9px 26px;   /* 缩进表示层级 */
    color: #4a5768;
    font-size: 14px;
    white-space: nowrap;
}
.sub-item:hover > a { background: #f5f8ff; color: var(--blue); text-decoration: none; }
.sub-item > a.on { color: var(--blue); font-weight: 600; }

/* 三级及以上：出现在二级右侧，垂直一条下来，顶部与上级对齐 */
.submenu-3 { left: 100%; top: -6px; }

/* 靠近屏幕右边界时改为向左弹出（987 号第五条） */
.submenu.flip-left { left: auto; right: 0; }
.submenu-3.flip-left { left: auto; right: 100%; }

/* ==========================================================
   主体内容区（不设右侧边栏，只有主体）
   ========================================================== */
.main-body { padding: 22px 0 40px; }

.crumb {
    font-size: 13px;
    color: var(--muted);
    margin-bottom: 16px;
}
.crumb a { color: var(--muted); }
.crumb a:hover { color: var(--blue); }
.crumb span.sep { margin: 0 7px; color: #c8d0da; }

.page-title {
    font-size: 21px;
    margin-bottom: 4px;
}
.page-desc {
    color: var(--muted);
    font-size: 13.5px;
    margin-bottom: 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--line);
}

/* ---------- 文章列表 ---------- */
.post-list { background: #fff; border: 1px solid var(--line); border-radius: 8px; }
.post-row {
    display: flex;
    gap: 20px;
    padding: 20px 24px;
    border-bottom: 1px solid #f2f4f7;
}
.post-row:last-child { border-bottom: 0; }
.post-row:hover { background: #fafbfc; }

.post-thumb {
    flex: 0 0 180px;
    width: 180px; height: 120px;
    border-radius: 6px;
    overflow: hidden;
    background: #f2f4f7;
}
.post-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---------- 封面伪图（986 号第二节第 3 条）----------
   缩略图不用真图片，用 CSS 生成：文字 = 封面关键词（没填取标题前 2 字），
   背景色由文字算出来（同一篇永远同色，刷新也不变）。省图片空间、加载快。 */
.post-thumb.fake {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    /* 深浅两层：一层纯色打底，一层斜向高光，避免大色块显得死板 */
    background-image: linear-gradient(135deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,0) 62%);
}
.post-thumb.fake .fk-txt {
    color: #fff;
    font-size: 26px;
    font-weight: 700;
    letter-spacing: 2px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, .2);
    user-select: none;
    /* 关键词超长时缩小字号，保证 4 个字也能塞进 180px */
    max-width: 160px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* ---------- 置顶区块（986 号附：单独成块，最多 5 条）---------- */
.top-posts {
    margin-bottom: 20px;
    padding: 16px 18px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 10px;
}
.top-posts-hd {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 10px;
    padding-bottom: 9px;
    border-bottom: 1px solid #f2f4f7;
}
.top-posts-hd .tt {
    font-size: 15.5px;
    font-weight: 700;
    color: var(--text);
    padding-left: 10px;
    position: relative;
}
/* 标题左侧一条紫色竖条，和主导航的紫色呼应 */
.top-posts-hd .tt::before {
    content: '';
    position: absolute;
    left: 0; top: 50%;
    transform: translateY(-50%);
    width: 3px; height: 15px;
    background: var(--purple, #6c5ce7);
    border-radius: 2px;
}
.top-posts-hd .td { font-size: 12.5px; color: var(--muted); }
.top-posts-list li { border-bottom: 1px dashed #f2f4f7; }
.top-posts-list li:last-child { border-bottom: 0; }
.top-posts-list a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 2px;
    color: var(--text);
}
.top-posts-list a:hover { background: #fafbff; text-decoration: none; }
.top-posts-list .tp-cat {
    flex-shrink: 0;
    padding: 1px 8px;
    border-radius: 10px;
    background: rgba(108, 92, 231, .09);
    color: var(--purple, #6c5ce7);
    font-size: 12px;
}
.top-posts-list .tp-title {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.top-posts-list a:hover .tp-title { color: var(--purple, #6c5ce7); }
.top-posts-list .tp-date {
    flex-shrink: 0;
    font-size: 12.5px;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
}

.post-info { flex: 1; min-width: 0; }
.post-title {
    font-size: 17px;
    margin-bottom: 7px;
    line-height: 1.5;
}
.post-title a { color: var(--text); }
.post-title a:hover { color: var(--blue); text-decoration: none; }
.post-summary {
    color: var(--muted);
    font-size: 13.5px;
    line-height: 1.8;
    margin-bottom: 10px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.post-meta { font-size: 12.5px; color: #a8b1bd; }
.post-meta a { color: var(--muted); }
.post-meta a:hover { color: var(--blue); }
.post-meta .dot { margin: 0 8px; color: #d5dae1; }

/* ---------- 文章详情 ---------- */
.article {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 34px 40px 40px;
}
.article h1 { font-size: 26px; line-height: 1.5; margin-bottom: 14px; }
.article-meta {
    font-size: 13px;
    color: var(--muted);
    padding-bottom: 18px;
    margin-bottom: 24px;
    border-bottom: 1px solid var(--line);
}
.article-meta .dot { margin: 0 9px; color: #d5dae1; }
.article-body { font-size: 15.5px; line-height: 2; word-wrap: break-word; }
.article-body img { border-radius: 6px; margin: 10px 0; }
.article-body p { margin: 0 0 18px; }
.article-body h2 { font-size: 20px; margin: 28px 0 14px; }
.article-body h3 { font-size: 17px; margin: 24px 0 12px; }
.article-body ul, .article-body ol { margin: 0 0 18px; padding-left: 24px; list-style: disc; }
.article-body li { margin-bottom: 7px; }
.article-body blockquote {
    margin: 20px 0;
    padding: 12px 18px;
    background: #f7f9fc;
    border-left: 3px solid var(--blue);
    color: #5a6672;
}
.article-body pre {
    background: #1f2a3d;
    color: #e6edf3;
    padding: 16px 18px;
    border-radius: 6px;
    overflow-x: auto;
    font-size: 13px;
    line-height: 1.7;
    font-family: Consolas, Monaco, "Courier New", monospace;
}
.article-body code {
    background: #f2f4f7;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 13.5px;
    font-family: Consolas, Monaco, "Courier New", monospace;
}
.article-body pre code { background: none; padding: 0; color: inherit; }
.article-body table { width: 100%; border-collapse: collapse; margin: 0 0 18px; }
.article-body th, .article-body td { padding: 9px 12px; border: 1px solid var(--line); text-align: left; }
.article-body th { background: #f7f9fc; font-weight: 600; }

/* 文章标签 */
.article-tags { margin-top: 26px; padding-top: 18px; border-top: 1px solid var(--line); }
.article-tags a {
    display: inline-block;
    padding: 3px 12px;
    margin: 0 8px 8px 0;
    background: #f2f4f7;
    border-radius: 12px;
    font-size: 12.5px;
    color: #5a6672;
}
.article-tags a:hover { background: var(--blue); color: #fff; text-decoration: none; }

/* ==========================================================
   关键词内链 / 标签内链（982 号）
   关键词内链 = 实体下划线；标签内链 = 虚线下划线
   ========================================================== */
.kw-intlink {
    text-decoration: underline;
    text-underline-offset: 2px;
    color: inherit;
    font-weight: 500;
}
.kw-intlink:hover { color: var(--blue); }
.tag-intlink {
    text-decoration: underline dashed;
    text-underline-offset: 2px;
    color: inherit;
}
.tag-intlink:hover { color: var(--blue); }

/* 本文地址：标签下一行。
   ★ 自己带 border-top —— 文章没有标签时 .article-tags 不输出，
     这行就变成标签位置的第一行，仍要有分隔线，不能光秃秃贴着正文。 */
.article-url {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
    font-size: 13px;
    line-height: 1.7;
    word-break: break-all;
}
.au-label { color: #8b96a3; }
.au-link { color: var(--blue); text-decoration: none; }
.au-link:hover { text-decoration: underline; }
/* 有标签时紧跟标签块，间距收紧（标签块自带 border-top，避免双线） */
.article-tags + .article-url {
    margin-top: 14px;
    padding-top: 0;
    border-top: 0;
}

/* 上下篇：只在当前栏目内 */
.article-nav {
    display: flex;
    gap: 14px;
    margin-top: 26px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
    font-size: 14px;
}
.article-nav .an-prev,
.article-nav .an-next { flex: 1; min-width: 0; }
.article-nav .an-prev { text-align: left; }
.article-nav .an-next { text-align: right; }
.article-nav .an-label { color: var(--muted); font-size: 12.5px; display: block; margin-bottom: 3px; }
.article-nav .an-title {
    display: block;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* ---------- 分页 ---------- */
.pager {
    display: flex;
    justify-content: center;
    gap: 7px;
    margin-top: 26px;
}
.pager a, .pager span {
    min-width: 36px;
    height: 36px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 6px;
    color: #5a6672;
    font-size: 14px;
}
.pager a:hover { border-color: var(--blue); color: var(--blue); text-decoration: none; }
.pager .on { background: var(--blue); border-color: var(--blue); color: #fff; }
.pager .off { color: #c8d0da; background: #f7f8fa; }

/* ---------- 空状态 ---------- */
.empty-box {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 80px 20px;
    text-align: center;
    color: var(--muted);
}
.empty-box svg { color: #ccd3dc; margin-bottom: 14px; }
.empty-box p { margin: 0 0 6px; }

/* ---------- 侧栏替代：标签云放在内容下方（因为不设右侧边栏）---------- */
.tag-cloud {
    margin-top: 22px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 20px 24px;
}
.tag-cloud h3 { font-size: 15px; margin-bottom: 14px; }
.tag-cloud a {
    display: inline-block;
    padding: 4px 13px;
    margin: 0 8px 8px 0;
    background: #f2f4f7;
    border-radius: 13px;
    font-size: 13px;
    color: #5a6672;
}
.tag-cloud a:hover { background: var(--blue); color: #fff; text-decoration: none; }

/* ==========================================================
   页脚（998 号：系统级渲染，主题目录里没有任何版权文字）
   ========================================================== */
.footer {
    background: #fff;
    border-top: 1px solid var(--line);
    padding: 28px 0 30px;
    margin-top: 30px;
}
.footer-inner { width: 1360px; margin: 0 auto; padding: 0 20px; text-align: center; }
.footer-text p { margin: 0 0 7px; font-size: 13.5px; color: #5a6672; }
.f-slogan { font-size: 15px !important; color: var(--text) !important; font-weight: 500; }
.footer-record { margin-bottom: 11px; font-size: 13px; display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; align-items: center; }
.footer-record a { color: var(--muted); }
.footer-record a:hover { color: var(--blue); }
.f-police img, .f-license img { display: inline-block; vertical-align: middle; }
.footer-code { margin-bottom: 12px; font-size: 12px; }
.footer-copyright { font-size: 13px; color: var(--muted); }
.f-copy { margin-right: 10px; }
.f-powered a { color: var(--muted); }
.f-powered a:hover { color: var(--blue); }

/* 996 号：前台页脚友情链接（footerHtml() 输出，一条都没有时不渲染此块） */
.footer-links {
    margin-bottom: 12px;
    font-size: 13px;
    color: var(--muted);
    display: flex;
    flex-wrap: wrap;
    gap: 4px 14px;
    justify-content: center;
    align-items: center;
}
.footer-links-label { color: #8b96a3; flex-shrink: 0; }
.footer-links a { color: var(--blue); }
.footer-links a:hover { color: #1a5fd0; text-decoration: underline; }

/* ==========================================================
   网址导航前台页（995 号）：介绍卡 + 区块 + 网址（无右侧栏）
   ========================================================== */
.nav-intro { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 26px 28px; margin-bottom: 18px; }
.nav-title { font-size: 24px; margin: 0 0 8px; }
.nav-desc { color: var(--muted); font-size: 14px; line-height: 1.7; margin: 0; }
.nav-block { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 20px 24px; margin-bottom: 16px; }
.nav-block-title { font-size: 17px; margin: 0 0 14px; padding-left: 11px; border-left: 4px solid var(--purple, #6c5ce7); line-height: 1.3; }
.nav-block-empty { color: var(--muted); font-size: 13px; margin: 4px 0 0; }
.nav-links { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.nav-link-card {
    display: flex; flex-direction: column; gap: 3px;
    padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px;
    background: #fafbfc; text-decoration: none; color: var(--text);
    transition: border-color .15s, box-shadow .15s, transform .15s; min-width: 0;
}
.nav-link-card:hover { border-color: var(--purple, #6c5ce7); box-shadow: 0 4px 14px rgba(108,92,231,.12); transform: translateY(-1px); }
.nav-link-name { font-size: 15px; font-weight: 600; color: #2c333a; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav-link-url { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.empty-box { text-align: center; padding: 50px 20px; color: var(--muted); }
.empty-box a { color: var(--blue); }

/* ==========================================================
   手机端发布页（login.php / my.php）
   布局跟电脑一致（1360px），只是按钮更大，方便手指点
   ========================================================== */
.m-login { max-width: 400px; margin: 60px auto; }
.m-card { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 30px 28px; }
.m-card h2 { font-size: 19px; margin-bottom: 6px; }
.m-sub { color: var(--muted); font-size: 13px; margin-bottom: 22px; }

.m-row { margin-bottom: 16px; }
.m-label { display: block; font-size: 13.5px; font-weight: 600; margin-bottom: 6px; }
.m-input, .m-textarea, select.m-input {
    width: 100%;
    padding: 11px 13px;
    border: 1px solid #dfe3e8;
    border-radius: 7px;
    font-size: 15px;      /* 手机上字号大一点更好点 */
    font-family: inherit;
    background: #fff;
}
.m-textarea { min-height: 200px; line-height: 1.8; resize: vertical; }
.m-input:focus, .m-textarea:focus, select.m-input:focus {
    outline: 0; border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(47, 111, 237, .1);
}
.m-btn {
    display: block;
    width: 100%;
    padding: 13px;
    background: var(--blue);
    color: #fff;
    border: 0;
    border-radius: 7px;
    font-size: 16px;
    font-family: inherit;
    cursor: pointer;
}
.m-btn:hover { background: #2559c9; }
.m-btn.gray { background: #eef0f3; color: #5a6672; }
.m-btn.danger { background: #e5484d; }
.m-btn.sm { padding: 9px 18px; font-size: 14px; width: auto; display: inline-block; }

.m-msg { padding: 11px 15px; border-radius: 7px; font-size: 14px; margin-bottom: 18px; }
.m-msg.ok { background: #eaf7ef; color: #1a7a3a; }
.m-msg.err { background: #fef2f2; color: #c93c40; }
.m-tip { font-size: 12.5px; color: var(--muted); line-height: 1.8; margin-top: 12px; }

/* 密码框 + 右侧眼睛图标（993 号，与后台同款）
   眼睛用 top+bottom 双边定位，不用 calc(100% - 8px)：
   双边定位由浏览器自己去贴合输入框高度，不用算、也不会因为父元素高度没解析而跑出框外 */
.m-eye-wrap { position: relative; }
.m-eye-wrap .m-input.has-eye { padding-right: 44px; }
.m-eye {
    position: absolute; right: 4px; top: 4px; bottom: 4px;
    width: 36px;
    background: none; border: 0; padding: 0;
    cursor: pointer; color: #a8b1bd;
    display: flex; align-items: center; justify-content: center;
    border-radius: 5px;
}
.m-eye:hover { color: var(--blue); background: #f2f4f7; }

/* 手机端列表项操作 */
.m-list-item {
    display: flex; align-items: center; gap: 14px;
    padding: 14px 0;
    border-bottom: 1px solid #f2f4f7;
}
.m-list-item:last-child { border-bottom: 0; }
.m-li-info { flex: 1; min-width: 0; }
.m-li-title { font-size: 15px; margin-bottom: 3px; }
.m-li-meta { font-size: 12.5px; color: var(--muted); }
.m-li-act { flex-shrink: 0; display: flex; gap: 8px; }
.m-li-act a, .m-li-act button {
    padding: 6px 13px;
    font-size: 13px;
    border-radius: 6px;
    border: 1px solid var(--line);
    background: #fff;
    color: #5a6672;
    cursor: pointer;
    font-family: inherit;
}
.m-li-act a:hover { border-color: var(--blue); color: var(--blue); text-decoration: none; }
.m-li-act .del:hover { border-color: #e5484d; color: #e5484d; }

/* ---------- 搜索页 ---------- */
.search-form { display: flex; gap: 10px; margin-bottom: 24px; }
.search-form input {
    flex: 1;
    padding: 11px 16px;
    border: 1px solid #dfe3e8;
    border-radius: 7px;
    font-size: 15px;
    font-family: inherit;
}
.search-form input:focus { outline: 0; border-color: var(--blue); }
.search-form button {
    padding: 11px 30px;
    background: var(--blue);
    color: #fff;
    border: 0;
    border-radius: 7px;
    font-size: 15px;
    cursor: pointer;
    font-family: inherit;
}
.search-form button:hover { background: #2559c9; }

/* ==========================================================
   手机宽度适配：
   000 号 —— 手机与电脑显示「一致」，但导航能滑动的栏目数不同。
   所以主体保持 1360px 不变（与电脑一致），只让顶栏在窄屏下压缩间距，
   保证手机上看到的还是同一套内容，而不是另一套响应式布局。
   ========================================================== */
@media (max-width: 1400px) {
    .wrap, .tb-inner, .nav-inner, .footer-inner { width: 100%; }
}

/* ==========================================================
   标签四件套（989 单索引 / 990 详情 / 991 中心）
   本站不设右侧边栏，相关标签区块直接放在内容下方。
   ========================================================== */
/* ---------- 991 标签中心（严格照 991 号参考截图）----------
   顶部：纯文字链接的 27 索引条，白卡、无按钮底色
   下方：每个索引一张白卡 —— 紫色索引字母 + 共N个 + 右侧「查看X索引全部 »」+ 分隔线 + 标签胶囊 */
.tc-title { font-size: 24px; font-weight: 700; color: #1f262e; margin-bottom: 16px; }

.idx-bar {
    display: flex; flex-wrap: wrap; gap: 4px 6px;
    margin: 0 0 20px; padding: 18px 20px;
    background: #fff; border: 1px solid var(--line); border-radius: 8px;
}
.idx-link {
    display: inline-block; min-width: 26px; padding: 3px 6px;
    color: #3c4652; font-size: 14px; text-align: center; text-decoration: none;
}
.idx-link:hover { color: var(--blue); text-decoration: none; }
/* 989 单索引页：当前索引高亮（991 中心页无当前索引，不加 on） */
.idx-link.on { color: var(--blue); font-weight: 700; }

/* 单个索引卡片 */
.tc-card {
    background: #fff; border: 1px solid var(--line); border-radius: 8px;
    margin-bottom: 16px; overflow: hidden;
}
.tc-card-hd {
    display: flex; align-items: baseline; gap: 10px;
    padding: 16px 20px 13px;
}
.tc-idx {
    margin: 0; font-size: 20px; font-weight: 700;
    color: var(--blue);            /* 索引字母：紫色 */
}
.tc-tot { color: var(--muted); font-size: 13px; }
.tc-more {
    margin-left: auto; color: var(--muted); font-size: 13px; text-decoration: none;
}
.tc-more:hover { color: var(--blue); text-decoration: none; }
.tc-card-bd {
    border-top: 1px solid #f2f4f7;    /* 头部分隔线 */
    padding: 16px 20px 18px;
}
.tc-empty { color: #a8b1bd; font-size: 13.5px; margin: 0; }

/* 标签胶囊容器：横向流动、一行多个、自动换行（绝不做一行一个的竖列） */
.tag-cloud { margin: 0; background: none; border: 0; padding: 0; }
.tag-cloud h3 { font-size: 15px; margin-bottom: 14px; }
.tag-item {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 6px 14px; margin: 0 10px 10px 0;
    background: #f2f4f7; border-radius: 16px;
    font-size: 13.5px; color: #3c4652; text-decoration: none;
}
.tag-item:hover { background: #e6ebf3; color: #1f262e; text-decoration: none; }
.tag-badge {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 18px; height: 18px; padding: 0 5px;
    background: #dfe4ea; border-radius: 9px;
    color: #6b7682; font-size: 11.5px; line-height: 1;
}
.tag-item:hover .tag-badge { background: #cfd6de; }
.idx-more-btn {
    margin-top: 4px; padding: 5px 14px; border: 1px solid var(--line);
    background: #fff; border-radius: 6px; cursor: pointer; color: var(--blue);
    font-size: 13px;
}
.idx-more-btn:hover { background: #f6f9ff; }

/* 单索引页（989）已改为复用标签中心的胶囊横排（.tc-card + .tag-item），
   原来的「一行一个」竖列表 .tag-list-rows / .tag-row 已删除。 */

/* 详情页：标签名 + 描述 + 篇数 合成一个白色圆角区块（站长 2026-10-04 要求） */
.tag-hero {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 22px 24px;
    margin-bottom: 20px;
}
.tag-hero-name {
    font-size: 22px;
    font-weight: 700;
    color: #1f262e;
    margin: 0;
}
.tag-hero-desc {
    margin: 10px 0 0;
    color: #5a6672;
    font-size: 14px;
    line-height: 1.75;
}
.tag-hero-count {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #f2f4f7;
    color: var(--muted);
    font-size: 13.5px;
}
.tag-hero-count b { color: #1f262e; }
/* 详情页页脚「相关标签」：白卡容器 + 横向胶囊流 */
/* 栏目单页（988 号 content_model=page）：正文装在白色圆角区块里
   （与标签详情页 .tag-hero 视觉统一，站长 2026-10-04 要求） */
.cat-page-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 26px 30px 30px;
}
.cat-page-title {
    font-size: 22px;
    font-weight: 700;
    color: #1f262e;
    margin: 0;
}
/* 标题下的横线 + 发布时间（站长 2026-10-04 要求） */
.cat-page-meta {
    margin-top: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid #f2f4f7;
    color: var(--muted);
    font-size: 13px;
}
.cat-page-desc {
    margin-top: 10px;
    padding-bottom: 14px;
    border-bottom: 1px solid #f2f4f7;
    color: #5a6672;
    font-size: 14px;
    line-height: 1.75;
}
.cat-page-body {
    margin-top: 18px;
    font-size: 15px;
    line-height: 1.9;
    color: #333c46;
}
/* 横线/简介之后紧接正文时，收紧间距避免出现空当 */
.cat-page-meta + .cat-page-body,
.cat-page-desc + .cat-page-body { margin-top: 16px; }

.rel-tags {
    margin-top: 20px;
    background: #fff; border: 1px solid var(--line); border-radius: 8px;
    padding: 18px 20px 6px;
}
.rel-title {
    font-size: 15px; margin: 0 0 12px; color: #2b333c; font-weight: 600;
}