/*!
 * kaiche —— 信息流型影视/资讯主题
 * 视觉参照 heiliao.com：暗色 + 橙色主色 + 窄栏居中 + 超宽横幅信息流
 * 2026-10-04
 */

/* ============ 1. 设计变量 ============ */
/* ⚠️ 字号一律对齐 heiliao 实测值（2026-10-05）：
   heiliao 根字号 16px、body line-height 1.52，
   信息流标题 18px / 角标 14px / 分类胶囊 15px / 正文 1rem·行高 1.52 / 详情标题 1.3rem。
   改这些之前先回 heiliao 量一遍，别凭感觉调。 */
:root {
    --kc-bg: #000;
    --kc-bg-soft: #0a0a0a;
    --kc-card: #151515;
    --kc-card-hi: #1d1d1d;
    --kc-border: #2e2e2e;
    --kc-border-soft: #242424;

    --kc-text: #fff;
    --kc-text-2: #b7b7b7;
    --kc-text-3: #7d7d7d;

    --kc-accent: #f3951b;
    /* 橙 */
    --kc-accent-soft: rgba(243, 149, 27, .14);
    --kc-hot: #ff2d2d;

    /* 站名 logo —— 照 heiliao 的 logo 图实测取色（不是 --kc-accent，它更饱和）。
       字体用系统自带的特粗字重近似 heiliao 那张特制几何黑体（不挂 webfont，
       中文 webfont 动辄几 MB，为五个字不值当）。 */
    --kc-logo: #ff9000;
    --kc-logo-font: "PingFang SC", "HarmonyOS Sans SC", "Source Han Sans SC", "Noto Sans SC",
        "Microsoft YaHei", "Heiti SC", "Hiragino Sans GB", sans-serif;

    --kc-max: 660px;
    /* 主栏宽度，跟 heiliao 一致 */
    --kc-gap: 8px;
    --kc-radius: 8px;
    --kc-radius-sm: 4.8px;

    --kc-base-font: 16px;
    /* = heiliao 的 --base-font-size */
    --kc-line: 1.52;
    /* = heiliao 的 body line-height */
}

/* ============ 2. 基础重置 ============ */
* {
    box-sizing: border-box;
}

/* ⚠️ 绝对不要在这里设 html 的 font-size！
   这套默认主题的 jquery-adaptive.js 会按视口宽度给 <html> 写行内 font-size
   （实测 1rem = 40px，不是 16px）。本主题的尺寸**一律用 px 写死**，
   与那个自适应基准解耦；去动根字号只会跟它打架。 */
html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body.kc-body {
    margin: 0;
    padding: 0;
    background: var(--kc-bg);
    color: var(--kc-text);
    font-size: 16px;
    line-height: var(--kc-line);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
        "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
    overflow-x: hidden;
}

/* ⚠️ 这条 reset 必须比默认主题的 a:link, a:visited（(0,1,1)）强，所以是 (0,1,2)。
   副作用：它也会压掉单类 <a> 颜色规则（(0,1,0)）—— 那些规则靠文件末尾
   「补丁：链接颜色提权」那一节（body.kc-body .xxx）来生效。
   ⚠️ 注意 a:link 本身就是 (0,1,1)，**就算删掉这条 reset，单类规则也赢不过它**
   （2026-10-07 试过，全站变 #666），所以那些提权是必需的，不是多此一举。 */
body.kc-body a {
    color: inherit;
    text-decoration: none;
}

body.kc-body img {
    border: 0;
    vertical-align: middle;
    display: block;
}

body.kc-body ul,
body.kc-body ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

body.kc-body h1,
body.kc-body h2,
body.kc-body h3,
body.kc-body h4 {
    margin: 0;
    font-weight: 700;
    line-height: 1.45;
}

.kc-hide {
    display: none !important;
}

/* 主栏容器：窄栏居中 */
.kc-wrap {
    width: 100%;
    max-width: var(--kc-max);
    margin: 0 auto;
    padding: 0 var(--kc-gap);
}

/* 滚动条（暗色） */
body.kc-body ::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

body.kc-body ::-webkit-scrollbar-track {
    background: var(--kc-bg);
}

body.kc-body ::-webkit-scrollbar-thumb {
    background: #333;
    border-radius: 999px;
}

/* ============ 3. 顶栏 ============ */
.kc-header {
    position: sticky;
    top: 0;
    z-index: 98;
    background: var(--kc-bg);
    border-bottom: 1px solid var(--kc-border-soft);
}

.kc-header__bar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    height: 52px;
    padding: 0 var(--kc-gap);
    max-width: var(--kc-max);
    margin: 0 auto;
}

/* 图标按钮（汉堡 / 搜索 / 个人中心）—— heiliao 顶栏两侧用的就是这个形态 */
.kc-iconbtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    flex: none;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--kc-text);
    cursor: pointer;
    transition: background .15s, color .15s;
}

.kc-iconbtn:hover {
    background: var(--kc-card);
    color: var(--kc-accent);
}

.kc-header__right {
    display: flex;
    align-items: center;
    gap: 2px;
    flex: none;
}

/* 中间 logo（真居中：绝对定位，否则左右图标数量不等会偏） */
.kc-logo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    max-width: calc(100% - 190px);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--kc-logo-font);
    font-size: 19px;
    font-weight: 900;
    letter-spacing: -.01em;
    color: var(--kc-logo);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kc-logo img {
    height: 26px;
    width: auto;
}

.kc-nav {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    gap: 8px;
    padding: 7.2px var(--kc-gap) 8.8px;
    max-width: var(--kc-max);
    margin: 0 auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
}

.kc-nav::-webkit-scrollbar {
    display: none;
}

.kc-nav__item {
    flex: none;
    border: 1px solid var(--kc-border);
    border-radius: var(--kc-radius);
    color: var(--kc-text-2);
    font-size: 15px;
    /* = heiliao .slider-item */
    font-weight: 700;
    line-height: 1.4;
    padding: 6.72px 12.8px;
    white-space: nowrap;
    transition: color .15s, border-color .15s, background .15s;
}

.kc-nav__item:hover {
    color: var(--kc-text);
    border-color: #3d3d3d;
}

.kc-nav__item.is-active {
    color: var(--kc-accent);
    border-color: var(--kc-accent);
    background: var(--kc-accent-soft);
}

/* ============ 3.5 左侧抽屉（汉堡点开）+ 个人中心面板 ============
   照 heiliao：汉堡 → 左侧滑出抽屉（顶部 logo+关闭、下面分类树、遮罩点击关闭）；
   头像 → 弹出面板。都是遮罩 + 滑入/淡入，点遮罩或 × 关闭，Esc 也能关。 */
.kc-drawer,
.kc-sheet {
    position: fixed;
    inset: 0;
    z-index: 900;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    /* ⚠️ visibility 是离散属性，不能给时长 —— 给了会"卡住"：
       关闭时 is-open 摘掉了，但 visibility/opacity 停在打开状态、面板关不掉（踩过）。
       正解：durations 0s，关闭时延迟到淡出后再切 hidden，打开时立刻切 visible。 */
    transition: opacity .25s, visibility 0s .25s;
}

.kc-drawer.is-open,
.kc-sheet.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity .25s, visibility 0s 0s;
}

.kc-drawer__mask,
.kc-sheet__mask {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .62);
    cursor: pointer;
}

.kc-drawer__panel {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: min(80vw, 304px);
    display: flex;
    flex-direction: column;
    background: var(--kc-bg);
    border-right: 1px solid var(--kc-border-soft);
    transform: translateX(-100%);
    transition: transform .28s cubic-bezier(.4, 0, .2, 1);
    overflow-y: auto;
    overscroll-behavior: contain;
}

.kc-drawer.is-open .kc-drawer__panel {
    transform: translateX(0);
}

.kc-drawer__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 14px 14px 12px;
    border-bottom: 1px solid var(--kc-border-soft);
    flex: none;
}

.kc-drawer__logo {
    font-family: var(--kc-logo-font);
    font-size: 17px;
    font-weight: 900;
    letter-spacing: -.01em;
    color: var(--kc-logo);
}

.kc-drawer__close,
.kc-sheet__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--kc-text-2);
    cursor: pointer;
}

.kc-drawer__close:hover,
.kc-sheet__close:hover {
    background: var(--kc-card);
    color: var(--kc-text);
}

.kc-drawer__nav {
    padding: 6px 0 24px;
}

.kc-tnode__link {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 12px 16px;
    border: 0;
    background: transparent;
    color: var(--kc-text-2);
    font-size: 15px;
    line-height: 1.4;
    text-align: left;
    cursor: pointer;
}

.kc-tnode__link.is-active {
    color: var(--kc-accent);
}

.kc-tnode__link:hover {
    background: var(--kc-card);
    color: var(--kc-text);
}

.kc-tnode__title {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kc-tnode__arrow {
    flex: none;
    display: inline-flex;
    color: var(--kc-text-3);
    transition: transform .22s;
}

.kc-tnode__toggle[aria-expanded="true"] .kc-tnode__arrow {
    transform: rotate(180deg);
}

/* 子菜单：默认折叠，点父项展开（照 heiliao 的 nav-child） */
.kc-tnode__child {
    display: none;
    padding: 2px 0 6px;
    background: var(--kc-bg-soft);
}

.kc-tnode--open .kc-tnode__child {
    display: block;
}

.kc-tchild__link {
    display: block;
    padding: 9px 16px 9px 30px;
    color: var(--kc-text-3);
    font-size: 14px;
    line-height: 1.4;
}

.kc-tchild__link:hover,
.kc-tchild__link.is-active {
    color: var(--kc-accent);
}

/* —— 个人中心：从**右侧**滑出（跟左侧分类抽屉对称，同 heiliao）—— */
.kc-sheet__panel {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: min(84vw, 320px);
    display: flex;
    flex-direction: column;
    background: var(--kc-bg);
    border-left: 1px solid var(--kc-border-soft);
    transform: translateX(100%);
    transition: transform .28s cubic-bezier(.4, 0, .2, 1);
    overflow-y: auto;
    overscroll-behavior: contain;
}

.kc-sheet.is-open .kc-sheet__panel {
    transform: translateX(0);
}

.kc-sheet__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex: none;
    padding: 14px 14px 12px;
    border-bottom: 1px solid var(--kc-border-soft);
    color: var(--kc-text);
    font-size: 15px;
    font-weight: 700;
}

.kc-sheet__body {
    padding: 6px 0 20px;
}

.kc-sheet__item {
    display: block;
    padding: 13px 18px;
    color: var(--kc-text-2);
    font-size: 15px;
}

/* 个人中心面板：已登录时顶部那行「已登录 昵称」（2026-10-07 加，配合退出登录） */
.kc-sheet__user {
    padding: 6px 18px 12px;
    margin-bottom: 4px;
    border-bottom: 1px solid var(--kc-border-soft);
    font-size: 12.5px;
    color: var(--kc-text-3);
}

.kc-sheet__user em {
    color: var(--kc-accent);
    font-style: normal;
    font-weight: 600;
}

/* 退出登录：跟其它项之间加条分隔线，悬停用警示红 */
.kc-sheet__item--out {
    margin-top: 4px;
    border-top: 1px solid var(--kc-border-soft);
    color: var(--kc-text-3);
}

.kc-sheet__item--out:hover {
    color: var(--kc-hot);
}

.kc-sheet__item:hover {
    background: var(--kc-card-hi);
    color: var(--kc-accent);
}

/* 抽屉/面板打开时锁滚动 */
html.kc-no-scroll,
html.kc-no-scroll body {
    overflow: hidden;
}

/* ============ 4. 信息流条目（核心） ============ */
.kc-feed {
    padding: 2.4px 0 19.2px;
}

.kc-item {
    margin-top: 10.4px;
}

.kc-item__link {
    display: block;
    position: relative;
}

/* 超宽横幅图
   ⚠️ 比例别照抄 heiliao 的 710/240（=2.96）：
   采集来的视频封面实测统一是 1300×640（=2.03），
   用 2.96 的框 object-fit:cover 会上下各裁掉约 16%（总共 31%）。
   跟着内容走，改一处就够。 */
.kc-item__cover {
    position: relative;
    width: 100%;
    aspect-ratio: 710 / 240;
    border-radius: var(--kc-radius-sm);
    overflow: hidden;
    background: var(--kc-card);
}

.kc-item__cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    background: #000;
}

/* 🔴 原来这里有一层 `.kc-item__cover::after` 的暗色渐变蒙版
   （linear-gradient(180deg, rgba(0,0,0,.30) → .68)），2026-10-07 **按用户要求整个删掉**。
   用户：「我的卡片比 heiliao 显示的要暗」—— 那层是全图常驻压暗，平均暗掉约 48%，
   而 heiliao 的卡片看着是亮的。
   删掉之后标题的可读性靠 `.kc-item__title` 上已有的 text-shadow 兜底
   （`0 1px 6px rgba(0,0,0,.8), 0 0 2px rgba(0,0,0,.45)`，本来就不弱）。
   ⚠️ 顺手也解决了另一件事：**广告卡片现在只有图没有文字**，蒙版对它是纯损失。
   ⚠️ 要是哪天遇到特别亮的底图标题发虚，别急着把整层加回来 ——
      优先加强 text-shadow，或者只压底部（标题在正中，压底效果有限）。 */

/* 标题层：负责「压在图正中」
   ⚠️ 居中必须由这一层做。之前把 flex 居中直接写在 h3 上，
      同一个元素又写了 display:-webkit-box（截断行数），后者覆盖前者
      → align-items 失效、标题贴在卡片顶部（2026-10-05 踩过）。 */
.kc-item__title-wrap {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 17.6px;
    pointer-events: none;
}

/* 标题文字：只管截断 + 排版，不碰居中 */
.kc-item__title {
    margin: 0;
    max-width: 100%;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
    text-shadow: 0 1px 6px rgba(0, 0, 0, .8), 0 0 2px rgba(0, 0, 0, .45);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-word;
}

/* 角标 */
.kc-badge {
    position: absolute;
    z-index: 3;
    background: #000;
    border-radius: 2px;
    font-size: 14px;
    /* = heiliao */
    line-height: 1.2;
    padding: 1.6px 4.8px;
}

.kc-badge--date {
    left: 4.8px;
    top: 4.8px;
    color: var(--kc-accent);
}

.kc-badge--hot {
    right: 4.8px;
    top: 4.8px;
    color: var(--kc-hot);
}

.kc-badge--new {
    right: 4.8px;
    top: 4.8px;
    color: var(--kc-accent);
}

.kc-badge--note {
    right: 4.8px;
    bottom: 4.8px;
    color: var(--kc-text-2);
    background: rgba(0, 0, 0, .75);
    max-width: 45%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 图下补充信息（摘要/分类），可选 */
.kc-item__meta {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6.4px 1.6px 0;
    color: var(--kc-text-3);
    font-size: 12.48px;
}

/* ============ 4.5 文章列表的两种形态 ============ */

/* —— A) BBS 纯文字列表（小说类：无封面）—— */
.kc-thread {
    border-top: 1px solid var(--kc-border-soft);
    margin-top: 4.8px;
}

.kc-thread__item {
    border-bottom: 1px solid var(--kc-border-soft);
}

.kc-thread__item a {
    display: flex;
    align-items: center;
    gap: 12.8px;
    padding: 9.92px 4px;
    font-size: 16px;
    transition: background .15s;
}

.kc-thread__item a:hover {
    background: #0e0e0e;
}

.kc-thread__title {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #dcdcdc;
}

.kc-thread__item a:hover .kc-thread__title {
    color: var(--kc-accent);
}

.kc-thread__meta {
    flex: none;
    display: flex;
    align-items: center;
    gap: 11.2px;
    color: var(--kc-text-3);
    font-size: 14px;
}

.kc-thread__meta em {
    font-style: normal;
}

/* 前 3 条右侧数字给点亮色，像论坛热帖 */
.kc-thread__item:nth-child(-n+3) .kc-thread__meta em:first-child {
    color: var(--kc-accent);
}

/* —— B) 竖版卡片墙（图集类：有封面）—— */
.kc-feed.kc-feed--poster {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 11.2px;
    align-items: start;
}

.kc-art-card a {
    display: block;
}

/* 封面 2:3 竖版，跟采集来的封面（425×600）一致，不裁 */
.kc-art-card__cover {
    position: relative;
    aspect-ratio: 425 / 600;
    border-radius: var(--kc-radius-sm);
    overflow: hidden;
    background: var(--kc-card);
    border: 1px solid var(--kc-border-soft);
}

.kc-art-card__cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform .3s;
}

.kc-art-card a:hover .kc-art-card__cover img {
    transform: scale(1.03);
}

.kc-art-card__title {
    margin: 7.2px 0 0;
    font-size: 14.4px;
    line-height: 1.4;
    font-weight: 600;
    color: #dcdcdc;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.kc-art-card a:hover .kc-art-card__title {
    color: var(--kc-accent);
}

.kc-art-card__meta {
    margin-top: 3.2px;
    color: var(--kc-text-3);
    font-size: 12.48px;
}

/* —— C) 混合列表：同一页里既有图集卡片、又有小说文字行 ——
   用在 /art/index（全部文章）：库里漫画（有封面）和小说（无封面）按时间天然分成两段，
   但在分界那一页两种形态会同时出现。
   kc_art_item 是「有封面→.kc-art-card / 无封面→.kc-thread__item」二选一，
   直接丢进 .kc-feed--poster 的网格里，文字行会被挤进一个 163px 的格子。
   → 让文字行**跨满整行**，卡片照旧按网格排，两种形态共存都不散。 */
.kc-feed--mixed .kc-thread__item {
    grid-column: 1 / -1;
}

/* ============ 5. 区块标题 ============ */
.kc-type-head {
    padding: 14.4px 1.6px 4.8px;
}

.kc-type-head__title {
    font-size: 20.8px;
    /* = heiliao .detail-title */
    color: var(--kc-text);
}

.kc-type-head__des {
    margin: 6.4px 0 0;
    color: var(--kc-text-3);
    font-size: 13.12px;
    line-height: 1.7;
}

/* 子分类导航（分类5 那种有子类的，列出子类；在子类页显示「全部+兄弟类」） */
.kc-subnav {
    display: flex;
    flex-wrap: wrap;
    gap: 6.4px;
    padding: 1.6px 1.6px 11.2px;
}

.kc-subnav__item {
    border: 1px solid var(--kc-border);
    border-radius: var(--kc-radius);
    padding: 4.8px 12px;
    font-size: 14px;
    line-height: 1.4;
    color: var(--kc-text-2);
    transition: color .15s, border-color .15s, background .15s;
}

.kc-subnav__item:hover {
    color: var(--kc-text);
    border-color: #3d3d3d;
}

.kc-subnav__item.is-active {
    color: var(--kc-accent);
    border-color: var(--kc-accent);
    background: var(--kc-accent-soft);
}

.kc-section {
    margin-top: 22.4px;
}

.kc-section__head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 1.6px 9.6px;
}

.kc-section__head h2 {
    font-size: 18px;
    /* 18px，跟信息流标题一致 */
    color: var(--kc-text);
    display: flex;
    align-items: center;
    gap: 6.4px;
}

.kc-section__head h2::before {
    content: '';
    display: inline-block;
    width: 3px;
    height: 16px;
    border-radius: 2px;
    background: var(--kc-accent);
}

.kc-section__more {
    margin-left: auto;
    color: var(--kc-text-3);
    font-size: 12.8px;
}

.kc-section__more:hover {
    color: var(--kc-accent);
}

/* —— 收藏按钮 ——
   用的是 MacCMS 自带的收藏：JS 在 template/default/asset/js/public-home-stack.js
   （每页都加载）里绑了 a.mac_ulog，点击会调
   /index.php/user/ajax_ulog/?ac=set&mid=<1视频|2文章>&id=<id>&type=2
   —— type=2 就是「我的收藏」（User::favs() 查的就是它）。
   未登录会先弹登录；接口是「已存在只更新时间」，所以点两次不会重复也不会取消。
   点成功后 JS 会给它加 .disabled。
   ⚠️ 它是 <a>，颜色靠文件末尾「补丁：链接颜色提权」那节的 body.kc-body .kc-fav 生效。 */
.kc-fav {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
    /* 在 .kc-section__head 里推到最右（那个容器没有 space-between） */
    padding: 5px 11px;
    border: 1px solid var(--kc-border);
    border-radius: var(--kc-radius);
    font-size: 13px;
    line-height: 1.2;
    color: var(--kc-text-2);
    cursor: pointer;
    user-select: none;
}

.kc-fav:hover {
    border-color: var(--kc-accent);
    color: var(--kc-accent);
}

/* 已收藏 —— 服务端渲染的初始态和 JS 点完之后加的类同名 */
.kc-fav.disabled {
    border-color: var(--kc-accent);
    color: var(--kc-accent);
    cursor: default;
}

.kc-fav__ico {
    font-size: 13px;
    line-height: 1;
}

/* 文章详情页里它跟在标题下面，不需要自动靠右 */
.kc-art-head .kc-fav {
    margin: 8px 0 0;
}

/* ============ 6. 分页 ============ */
.kc-paging {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 5.6px;
    padding: 25.6px 4.8px 19.2px;
}

.kc-paging a,
.kc-paging span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    /* = heiliao .pagination .page-item 的 38×38 */
    height: 38px;
    padding: 0 8px;
    background: var(--kc-card);
    border-radius: 5px;
    color: var(--kc-text-2);
    font-size: 16px;
    /* = heiliao */
}

.kc-paging a:hover {
    color: var(--kc-accent);
    background: var(--kc-card-hi);
}

.kc-paging .is-active span,
.kc-paging .is-active a {
    color: #0a001f;
    background: var(--kc-accent);
    font-weight: 700;
}

.kc-paging .is-disabled {
    opacity: .35;
    pointer-events: none;
}

.kc-paging__total {
    width: 100%;
    text-align: center;
    color: var(--kc-text-3);
    font-size: 12.48px;
    margin-top: 8px;
}

/* ============ 7. 详情页 ============ */
.kc-detail {
    padding-top: 9.6px;
}

/* 播放页单栏 —— 2026-10-07
   选集已从右栏搬到播放器下方、猜你喜欢已删 → 右栏空了，把 1fr+380px 收成单栏。
   ⚠️ **必须按 body 类限定**：详情页共用 .kc-detail，它仍有三块 .kc-section--side 要占右栏。
   （特异性 (0,2,0) 压得过媒体查询里那条 (0,1,0) 的 grid-template-columns，不用 !important） */
body.kc-play-page .kc-detail {
    grid-template-columns: minmax(0, 1fr);
}

/* 评论区宽度收拢 —— 2026-10-07
   默认主题给评论区写死了 **1200px**，而本站内容区（.kc-wrap）只有 **1060px**
   → 评论那块比同级模块宽出 ~165px、溢出容器（无页面级横向滚动，所以只是看着别扭）。
   这里统一收到容器宽度。加 !important 是因为没找到那条规则的出处（CSS 是压缩的），
   用 !important 保证压得住。 */
.kc-detail #pinglun,
.kc-detail #pinglun > *,
#pinglun .mac_comment,
#pinglun .comm_list,
#pinglun .comm_list_box {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
}

/* ── 评论表单统一配色 —— 2026-10-07 用户要求「评论按钮统一一下颜色风格」
   默认主题的评论表单是**浅色设计**：输入框白底、验证码 #f9f9f9、
   发布按钮用的是**默认主题自己的绿** rgb(64,204,146)。本站是暗色橙调，全部统一过来。
   ⚠️ 表单是 `MAC.Comment` 用 JS 拼出来的（不是模板），改不了 DOM，只能按类名覆盖。 */

.mac_comment .comment_content,
.mac_comment .verify {
    background: var(--kc-card) !important;
    border: 1px solid var(--kc-border) !important;
    border-radius: var(--kc-radius-sm) !important;
    color: var(--kc-text) !important;
}

.mac_comment .comment_content::placeholder,
.mac_comment .verify::placeholder {
    color: var(--kc-text-3) !important;
}

.mac_comment .comment_content:focus,
.mac_comment .verify:focus {
    border-color: var(--kc-accent) !important;
    outline: 0 !important;
}

/* 验证码图片：给它跟输入框一致的边框/圆角
   （图是服务端 /verify/index.html 生成的，底色改不了，只能靠外框统一） */
.mac_comment .comm-code {
    background: var(--kc-card);
    border: 1px solid var(--kc-border) !important;
    border-radius: var(--kc-radius-sm) !important;
    cursor: pointer;
}

/* 「发布」按钮：默认是绿的 → 换站点橙，跟全站主操作一致 */
.mac_comment .comment_submit,
.mac_comment .cmt_post {
    background: var(--kc-accent) !important;
    border: 0 !important;
    border-radius: var(--kc-radius-sm) !important;
    color: #0a001f !important;
    font-weight: 700 !important;
}

.mac_comment .comment_submit:hover,
.mac_comment .cmt_post:hover {
    background: #ffa42f !important;
}

/* 「还可以输入 200 字」 */
.mac_comment .comm_tips {
    color: var(--kc-text-3);
}

/* 「暂无留言」空状态**整块去掉**（用户 2026-10-07 要求）。
   两个来源都盖住：服务端模板 `comment/ajax.html` 和 JS 拼的 `public-home-stack.js`。 */
.mac_comment .no-message {
    display: none !important;
}

/* ── 评论**列表项**配色 —— 2026-10-07 用户反馈「留言字体颜色不对」
   默认主题这套是给**浅色底**设计的，搬到暗底上全错：
     正文 .cmt-text 是 #333（黑底上几乎看不见）、名字/时间 #999（太灰）。
   列表项同样是 MAC.Comment 用 JS 拼的，改不了 DOM → 只能按类名覆盖，用 !important。
   ⚠️ 表单那边用的是 `.comment_content`（多一个 "ent"），列表项是 `.comm_content`，两者别搞混。 */
#pinglun .cmt-text,
#pinglun .comm_list .comm_content,
#pinglun .cmt-replies .comm_content {
    color: #e6e6e6 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

#pinglun .cmt-name {
    color: var(--kc-text-2) !important;
    font-size: 13.5px !important;
}

#pinglun .cmt-time,
#pinglun .part_tips {
    color: var(--kc-text-3) !important;
}

/* 楼层之间的分隔线：默认主题的线在暗底上不对，统一成站点的软边框 */
#pinglun .comm_each,
#pinglun .cmt-thread,
#pinglun .line_top {
    border-color: var(--kc-border-soft) !important;
}

/* 回复 / 举报 这类小操作链接 */
#pinglun .cmt-actions a,
#pinglun .gw_action a,
#pinglun .comm_cont a {
    color: var(--kc-text-3) !important;
}

#pinglun .cmt-actions a:hover,
#pinglun .gw_action a:hover,
#pinglun .comm_cont a:hover {
    color: var(--kc-accent) !important;
}

/* ── 「以 XX 的身份发言」（登录后才输出这段 DOM，见 vod/play.html）── */
.kc-cmt-as {
    margin: 0 0 8px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--kc-text-3);
}

.kc-cmt-as em {
    color: var(--kc-text-2);
    font-style: normal;
    font-weight: 600;
}

/* ── 评论空状态（2026-10-07 用户要求）──
   默认主题那个「暂无留言」已经用 `.mac_comment .no-message{display:none}` 藏了，
   这里换成我们自己的引导块。DOM 一直输出、平时 display:none，
   **靠 :has() 判断评论容器里有没有 .no-message** 来决定显示：
     · 没有评论时，JS/模板会往 .mac_comment 里塞一个 .no-message → 命中 → 显示
     · 有评论时不塞 → 不命中 → 保持隐藏
   ⚠️ `:has()` 老浏览器不支持 → 这块就永远不显示（降级安全，不会出错）。
   ⚠️ 空状态那块 DOM **必须紧跟在 `.mac_comment` 后面**，中间不能夹别的元素（用的是相邻兄弟 +）。 */
.kc-cmt-empty {
    display: none;
}

.mac_comment:has(.no-message)+.kc-cmt-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    margin-top: 4px;
    padding: 28px 16px 30px;
    border: 1px dashed var(--kc-border);
    border-radius: var(--kc-radius);
    text-align: center;
}

.kc-cmt-empty__t {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: var(--kc-text-3);
}

.kc-cmt-empty__btns {
    display: flex;
    gap: 10px;
}

/* ── 评论翻页 —— 2026-10-07 用户反馈「没和全站风格对齐」
   默认主题这套是浅色的，搬到暗底上问题比看着还多（实测）：
     · 普通页码 / 下一页 / 尾页 → **白字 + 白底，根本看不见**
     · 当前页 → 白字 + **它自己的绿 rgb(64,204,146)**
     · 禁用态 → #888 / 底 #f8f8f8
     · 「共 N 条数据」→ 白
   统一成站点的暗色橙调（当前页用站点橙）。跟其它评论覆盖一样用 !important
   （列表/翻页都是 MAC.Comment 用 JS 拼的，且没找到默认规则的出处）。 */
.mac_comment .page {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 14px 0 6px;
}

.mac_comment .page li {
    list-style: none;
}

.mac_comment .page a,
.mac_comment .page span.num {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 32px;
    padding: 0 10px;
    border: 1px solid var(--kc-border) !important;
    border-radius: var(--kc-radius-sm) !important;
    background: var(--kc-card) !important;
    color: var(--kc-text-2) !important;
    font-size: 13px !important;
    line-height: 1 !important;
    text-decoration: none;
}

.mac_comment .page a:hover {
    border-color: var(--kc-accent) !important;
    color: var(--kc-accent) !important;
}

/* 当前页 */
.mac_comment .page a.page_current,
.mac_comment .page a.page_current:hover {
    background: var(--kc-accent) !important;
    border-color: var(--kc-accent) !important;
    color: #0a001f !important;
    font-weight: 700 !important;
}

/* 禁用态（首页/上一页在头一页、下一页/尾页在末一页） */
.mac_comment .page .btns_disad {
    background: var(--kc-bg-soft) !important;
    border-color: var(--kc-border-soft) !important;
    color: var(--kc-text-3) !important;
    cursor: default;
}

/* 「共 N 条数据 / 当前 x/y 页」 */
.mac_comment .page_tips {
    color: var(--kc-text-3) !important;
    font-size: 12.5px !important;
    text-align: center;
    padding-bottom: 6px;
}

/* 播放入口：封面 + 播放按钮 */
.kc-play-entry {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: var(--kc-radius-sm);
    overflow: hidden;
    background: #000;
    border: 1px solid var(--kc-border-soft);
}

.kc-play-entry img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .82;
    transition: opacity .2s, transform .3s;
}

.kc-play-entry:hover img {
    opacity: .95;
    transform: scale(1.02);
}

.kc-play-entry__btn {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 51.2px;
    height: 51.2px;
    line-height: 51.2px;
    text-align: center;
    padding-left: 3.2px;
    border-radius: 50%;
    background: rgba(243, 149, 27, .92);
    color: #0a001f;
    font-size: 18.4px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, .55);
}

/* 演职员 */
.kc-detail__crew {
    padding: 3.2px 0 9.6px;
    font-size: 13.12px;
    color: var(--kc-text-2);
    line-height: 1.9;
}

.kc-detail__crew p {
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kc-detail__crew em {
    color: var(--kc-text-3);
    font-style: normal;
    margin-right: 7.2px;
}

.kc-detail__player {
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #000;
    border-radius: var(--kc-radius-sm);
    overflow: hidden;
    border: 1px solid var(--kc-border-soft);
}

/* 播放页播放器 */
.kc-player {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #000;
    border-radius: var(--kc-radius-sm);
    overflow: hidden;
    border: 1px solid var(--kc-border-soft);
}

.kc-player .MacPlayer,
.kc-player iframe,
.kc-player video,
.kc-player embed,
.kc-player object {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    border: 0;
    display: block;
}

.kc-player__tip {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: var(--kc-text-3);
    font-size: 14.4px;
    padding: 0 16px;
    text-align: center;
}

/* —— 播放权限引导（没权限时盖在播放窗口里，见 vod/play.html）——
   ⚠️ 里面两个按钮是 <a>，颜色靠文件末尾「补丁：链接颜色提权」那节生效 */
.kc-player__tip--gate {
    flex-direction: column;
    /* 下面那颗播放按钮是绝对定位的，得有个定位祖先 */
    position: relative;
}

/* 左下角那颗播放按钮（用户 2026-10-07：「请登录/注册后观看那个页面看不出来是视频框」）
   —— 呼应播放器的播放键，**纯装饰、不可点**（权限不够，点了也播不了），
      所以 `pointer-events: none`：别做成一个"看着能点、点了没反应"的死按钮。 */
.kc-gate__play {
    position: absolute;
    left: 18px;
    bottom: 18px;
    width: 54px;
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(0, 0, 0, .55);
    border: 2px solid rgba(255, 255, 255, .82);
    color: #fff;
    pointer-events: none;
}

.kc-gate {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}

.kc-gate__t {
    margin: 0;
    font-size: 15px;
    line-height: 1.5;
    color: var(--kc-text-2);
}

.kc-gate__btns {
    display: flex;
    gap: 10px;
}

.kc-gate__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 96px;
    height: 38px;
    padding: 0 18px;
    border: 1px solid var(--kc-accent);
    border-radius: var(--kc-radius);
    background: var(--kc-accent);
    color: #0a001f;
    font-size: 14px;
    font-weight: 600;
}

.kc-gate__btn:hover {
    filter: brightness(1.08);
}

.kc-gate__btn--ghost {
    background: transparent;
    border-color: var(--kc-border);
    color: var(--kc-text-2);
}

.kc-gate__btn--ghost:hover {
    border-color: var(--kc-accent);
    color: var(--kc-accent);
}

/* 当前集名 */
.kc-detail__ep {
    color: var(--kc-accent);
    font-size: 15.2px;
    font-weight: 500;
}

/* 上/下一集 */
.kc-playnav {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11.2px 0 3.2px;
}

.kc-playnav a,
.kc-playnav span {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36.8px;
    background: var(--kc-card);
    border: 1px solid var(--kc-border-soft);
    border-radius: var(--kc-radius-sm);
    color: var(--kc-text-2);
    font-size: 13.76px;
}

.kc-playnav a:hover {
    color: var(--kc-accent);
    border-color: var(--kc-accent);
}

.kc-playnav .is-disabled {
    opacity: .35;
}

/* 搜索排序 */
.kc-sort {
    display: flex;
    gap: 8px;
    padding: 3.2px 1.6px 9.6px;
}

.kc-sort__item {
    border: 1px solid var(--kc-border);
    border-radius: var(--kc-radius);
    padding: 5.6px 12.8px;
    font-size: 13.44px;
    color: var(--kc-text-2);
}

.kc-sort__item:hover {
    color: var(--kc-text);
}

.kc-sort__item.is-active {
    color: var(--kc-accent);
    border-color: var(--kc-accent);
    background: var(--kc-accent-soft);
}

.kc-detail__player iframe,
.kc-detail__player video {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}

.kc-detail__title {
    font-size: 20.8px;
    line-height: 1.55;
    color: var(--kc-text);
    margin: 16px 0 8px;
}

.kc-detail__date {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9.6px;
    padding-bottom: 11.2px;
    border-bottom: 1px solid var(--kc-border-soft);
    color: var(--kc-text-3);
    font-size: 12.8px;
}

.kc-detail__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6.4px;
    padding: 11.2px 0;
}

.kc-detail__tags a {
    background: var(--kc-card);
    border: 1px solid var(--kc-border-soft);
    border-radius: 999px;
    padding: 3.2px 9.6px;
    color: var(--kc-text-2);
    font-size: 12.48px;
}

.kc-detail__tags a:hover {
    color: var(--kc-accent);
    border-color: var(--kc-accent);
}

/* 正文 */
.kc-article {
    color: #e6e6e6;
    font-size: 16px;
    line-height: 1.52;
    /* = heiliao（原来我写了 1.8，中文长文看着就"大一号"） */
    padding: 4.8px 0 12.8px;
    word-wrap: break-word;
}

.kc-article img {
    max-width: 100%;
    height: auto;
    margin: 9.6px auto;
    border-radius: var(--kc-radius-sm);
}

.kc-article p {
    margin: 0 0 14.4px;
}

.kc-article blockquote {
    margin: 0 0 16px;
    padding: 9.6px 12.8px;
    background: var(--kc-card);
    border: 1px solid #333;
    border-radius: var(--kc-radius);
    color: var(--kc-text-2);
}

/* 截图区（**播放页的抽帧截图** 和 **详情页的截图集** 共用这个类）
   🔴 **一行一张、竖着排**（用户 2026-10-07：「你把图一张图放一排，不要并排放」）。
   原来是 `flex` + 横向滚动、多张并排 —— 已废弃，别再改回 flex。

   ⚠️⚠️ **两页的子元素结构不一样，改这里必须两套都顾上**：
     · 播放页：`<a><img></a>` —— flex/尺寸要算在 **`<a>`** 上
     · 详情页：**裸 `<img>`**（没有 `<a>` 包）—— 直接就是行
   2026-10-07 踩过：只写了 `.kc-shots img { width: 66% }`，而播放页的 img 百分比
   是**相对它的父元素 `<a>`** 算的、`<a>` 的宽又被 img 撑出来 → **循环依赖**，
   浏览器只能退化成"用图片原始宽度再被挤" → **写 42% 和 66% 几乎没区别**（实测 306px）。
   现在改成"容器 block + 两种子元素都当一行"，就绕开了这个依赖。 */
.kc-shots {
    display: block;
    padding: 6.4px 0 16px;
}

/* 一行 = 一个子元素（播放页是 <a>，详情页是 <img>）。
   🔴 **宽度上限 = 原图宽 480px**（抽帧就是 480 宽，见 kc_shots.php 的 KC_WIDTH）——
   铺满整宽（935px）等于把 480 的原图**放大近 2 倍 → 发虚**。
   用户 2026-10-07：「太大了一张，有点糊」→ 所以按原尺寸显示、居中，最清楚。
   ⚠️ **想又大又清晰，只能重抽成更高分辨率**（把 KC_WIDTH 调大 + 重跑一遍抽帧），
      光改这个 CSS 做不到。 */
.kc-shots>a,
.kc-shots>img {
    display: block;
    width: 100%;
    max-width: 480px;
    margin: 0 auto 8px;
}

.kc-shots>*:last-child {
    margin-bottom: 0;
}

.kc-shots img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--kc-radius-sm);
    border: 1px solid var(--kc-border-soft);
}

/* 线路/选集 */
.kc-plays {
    padding: 6.4px 0 12.8px;
}

.kc-plays__group {
    margin-bottom: 12.8px;
}

.kc-plays__label {
    color: var(--kc-text-3);
    font-size: 12.8px;
    margin-bottom: 7.2px;
}

.kc-plays__list {
    display: flex;
    flex-wrap: wrap;
    gap: 6.4px;
}

.kc-plays__list a {
    background: var(--kc-card);
    border: 1px solid var(--kc-border-soft);
    border-radius: var(--kc-radius-sm);
    padding: 5.6px 11.2px;
    color: var(--kc-text-2);
    font-size: 13.44px;
}

.kc-plays__list a:hover,
.kc-plays__list a.is-active {
    color: #0a001f;
    background: var(--kc-accent);
    border-color: var(--kc-accent);
    font-weight: 700;
}

/* ============ 7.5 文章详情 ============ */
.kc-art-head {
    padding-top: 9.6px;
}

/* 小说/长文正文 */
.kc-article--art {
    font-size: 15px;
    /* 15px。比 heiliao 的 16px 再小一档（用户 2026-10-05 要求） */
    line-height: 1.7;
    /* 行宽铺满后比窄栏长，行高给 1.7，不然密不透风 */
    color: #dcdcdc;
    letter-spacing: .01em;
    padding: 6.4px 0 16px;
}

/* 文章详情页：没有侧栏内容 → 单栏铺满整页
   （原来它跟着 .kc-detail 的「左主栏 + 右 380px」栅格，
     但文章页的同类推荐/评论都没进右栏标记 → 右边留一大块空白） */
.kc-wrap.kc-detail.kc-detail--art {
    display: block;
}

.kc-article--art p {
    margin: 0 0 .85em;
    /* 首行缩进 2 字：中文小说排版惯例（正文里的段落是 kc_art_content 重建出来的） */
    text-indent: 2em;
}

.kc-article--art br {
    line-height: 1.52;
}

/* 图集正文：图居中，限宽 */
.kc-article--art img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 14.4px auto;
    border-radius: var(--kc-radius-sm);
    background: var(--kc-card);
}

/* ============ 8. 榜单 / 更多链接 ============ */
.kc-rank {
    background: var(--kc-card);
    border: 1px solid var(--kc-border-soft);
    border-radius: var(--kc-radius);
    padding: 4.8px 8px;
}

.kc-rank__item + .kc-rank__item {
    border-top: 1px solid var(--kc-border-soft);
}

.kc-rank__item a {
    display: flex;
    align-items: center;
    gap: 9.6px;
    padding: 8.8px 3.2px;
    font-size: 14.08px;
}

.kc-rank__no {
    flex: none;
    width: 21.6px;
    height: 21.6px;
    line-height: 21.6px;
    text-align: center;
    border-radius: 4px;
    background: var(--kc-card-hi);
    color: var(--kc-text-3);
    font-size: 11.84px;
    font-weight: 700;
}

.kc-rank__item:nth-child(-n+3) .kc-rank__no {
    background: var(--kc-accent);
    color: #0a001f;
}

.kc-rank__name {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--kc-text);
}

.kc-rank__item a:hover .kc-rank__name {
    color: var(--kc-accent);
}

.kc-rank__hot {
    flex: none;
    color: var(--kc-text-3);
    font-size: 11.84px;
}

.kc-more-link {
    text-align: center;
    padding: 19.2px 0 6.4px;
}

.kc-more-link a {
    display: inline-block;
    border: 1px solid var(--kc-border);
    border-radius: 999px;
    padding: 8px 19.2px;
    color: var(--kc-text-2);
    font-size: 13.6px;
}

.kc-more-link a:hover {
    color: var(--kc-accent);
    border-color: var(--kc-accent);
}

/* ============ 9. 底栏 ============ */
.kc-footer {
    border-top: 1px solid var(--kc-border-soft);
    margin: 25.6px auto 0;
    max-width: var(--kc-max);
    padding: 19.2px var(--kc-gap) 32px;
    color: var(--kc-text-3);
    font-size: 12.48px;
    line-height: 1.9;
    text-align: center;
}

.kc-footer a {
    color: var(--kc-text-2);
    margin: 0 4.8px;
}

.kc-footer a:hover {
    color: var(--kc-accent);
}

/* 分类内链行 —— 2026-10-07 页脚精简时去掉了，样式先留着（哪天想加回内链直接用） */
.kc-footer__links {
    margin-bottom: 8px;
}

/* 2026-10-08 恢复的「三行精简页脚」：① 免责 ② 版权+联系客服 ③ 联系邮箱 */
.kc-footer__note {
    margin-bottom: 6px;
}

.kc-footer__sep {
    margin: 0 6px;
    color: var(--kc-border);
}

/* ============ 9. 空状态 ============ */
.kc-empty {
    padding: 48px 16px;
    text-align: center;
    color: var(--kc-text-3);
    font-size: 14.4px;
}

/* ============ 9.5 更新归档：纵向时间轴 + 日期选择（map/index）============
   照 heiliao 的「大事记」形态：左边一条竖线串起每一天，右边列当天的内容。
   日历是自己写的暗色弹层（asset/js/kc-calendar.js），不引 jQuery UI。
   ⚠️ 本主题 CSS 一律用 px（默认主题的 jquery-adaptive.js 会改根字号），见文件顶注释。 */
.kc-archive {
    padding: 16px 0 40px;
}

.kc-archive__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 22px;
}

.kc-archive__title {
    margin: 0 0 6px;
    font-size: 22px;
    line-height: 1.3;
    font-weight: 700;
    color: var(--kc-text);
}

.kc-archive__sub {
    margin: 0;
    font-size: 13.6px;
    color: var(--kc-text-3);
}

.kc-archive__sub em {
    color: var(--kc-accent);
    font-style: normal;
    font-weight: 600;
}

.kc-archive__sub a {
    color: var(--kc-text-2);
}

.kc-archive__sub a:hover {
    color: var(--kc-accent);
}

.kc-archive__empty {
    padding: 60px 0;
    text-align: center;
    color: var(--kc-text-3);
    font-size: 15px;
}

/* —— 日期选择 —— */
.kc-cal {
    position: relative;
}

.kc-cal__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 38px;
    padding: 0 14px;
    border: 1px solid var(--kc-border-soft);
    border-radius: var(--kc-radius);
    background: var(--kc-card);
    color: var(--kc-text);
    font-size: 14px;
    cursor: pointer;
}

.kc-cal__btn:hover {
    border-color: var(--kc-accent);
    color: var(--kc-accent);
}

.kc-cal__btn-icon {
    display: inline-flex;
    color: var(--kc-text-3);
}

.kc-cal__pop {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 60;
    width: 268px;
    padding: 12px;
    border: 1px solid var(--kc-border);
    border-radius: 10px;
    background: var(--kc-card);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .55);
}

.kc-cal__pop[hidden] {
    display: none;
}

.kc-cal__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.kc-cal__nav {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--kc-text-2);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}

.kc-cal__nav:hover:not(:disabled) {
    background: var(--kc-bg-soft);
    color: var(--kc-accent);
}

.kc-cal__nav:disabled {
    opacity: .25;
    cursor: default;
}

.kc-cal__month {
    font-size: 14.5px;
    font-weight: 600;
    color: var(--kc-text);
}

.kc-cal__dow {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    margin-bottom: 4px;
}

.kc-cal__dow span {
    text-align: center;
    font-size: 12px;
    line-height: 24px;
    color: var(--kc-text-3);
}

.kc-cal__grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
}

.kc-cal__cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 34px;
    border-radius: 6px;
    font-size: 13px;
    color: var(--kc-text-2);
    text-decoration: none;
}

a.kc-cal__cell:hover {
    background: var(--kc-bg-soft);
    color: var(--kc-accent);
}

.kc-cal__cell--pad {
    visibility: hidden;
}

.kc-cal__cell--off {
    color: var(--kc-text-3);
    opacity: .38;
}

.kc-cal__cell--has .kc-cal__dot {
    width: 4px;
    height: 4px;
    margin-top: 3px;
    border-radius: 50%;
    background: var(--kc-accent);
}

.kc-cal__cell:not(.kc-cal__cell--has) .kc-cal__dot {
    display: none;
}

.kc-cal__cell.is-today {
    box-shadow: inset 0 0 0 1px var(--kc-border);
}

.kc-cal__cell.is-selected {
    background: var(--kc-accent);
    color: #0a001f;
    font-weight: 700;
}

.kc-cal__cell.is-selected .kc-cal__dot {
    background: #0a001f;
}

.kc-cal__foot {
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--kc-border-soft);
}

.kc-cal__foot button {
    padding: 4px 6px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--kc-text-2);
    font-size: 13px;
    cursor: pointer;
}

.kc-cal__foot button:hover {
    background: var(--kc-bg-soft);
    color: var(--kc-accent);
}

/* —— 时间轴 —— */
.kc-tl {
    position: relative;
}

/* 整条竖线 */
.kc-tl::before {
    content: '';
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 66px;
    width: 2px;
    background: var(--kc-border-soft);
}

.kc-tl__day {
    position: relative;
    padding: 0 0 20px 92px;
}

/* 线上的圆点 */
.kc-tl__node {
    position: absolute;
    left: 61px;
    top: 7px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--kc-accent);
    box-shadow: 0 0 0 3px var(--kc-accent-soft);
}

/* 日期那一栏，在竖线左侧 */
.kc-tl__head {
    position: absolute;
    left: 0;
    top: 0;
    width: 52px;
    text-align: right;
}

.kc-tl__date {
    display: block;
    font-size: 15px;
    font-weight: 700;
    color: var(--kc-text);
}

.kc-tl__date:hover {
    color: var(--kc-accent);
}

.kc-tl__count {
    display: block;
    margin-top: 2px;
    font-size: 11.5px;
    color: var(--kc-text-3);
}

.kc-tl__list {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

/* —— 一天之内的分组（视频 / 小说专区 / 漫画专区，组名取自分类表）—— */
.kc-tl__grp {
    margin-bottom: 10px;
}

.kc-tl__grp:last-child {
    margin-bottom: 0;
}

.kc-tl__grphead {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 8px 4px;
    font-size: 12.5px;
    line-height: 1.4;
    color: var(--kc-text-3);
}

/* 组名前的小竖条 */
.kc-tl__grphead::before {
    content: '';
    width: 3px;
    height: 11px;
    border-radius: 2px;
    background: var(--kc-accent);
    opacity: .7;
}

.kc-tl__grpname {
    font-weight: 600;
}

.kc-tl__grpnum {
    opacity: .6;
}

.kc-tl__item {
    display: block;
    padding: 5px 8px;
    border-radius: 6px;
    font-size: 14.5px;
    line-height: 1.5;
    color: #cfcfcf;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kc-tl__item:hover {
    background: var(--kc-card);
    color: var(--kc-accent);
}

.kc-tl__tag {
    display: inline-block;
    margin-right: 6px;
    padding: 0 5px;
    border: 1px solid var(--kc-border-soft);
    border-radius: 4px;
    font-size: 11px;
    line-height: 16px;
    color: var(--kc-text-3);
}

.kc-tl__more {
    display: inline-block;
    margin-top: 6px;
    padding: 0 8px;
    font-size: 13px;
    color: var(--kc-accent);
}

/* 窄屏：竖线整体左移、留白收窄 */
@media (max-width: 559px) {
    .kc-tl::before {
        left: 50px;
    }

    .kc-tl__day {
        padding-left: 72px;
    }

    .kc-tl__node {
        left: 45px;
    }

    .kc-tl__head {
        width: 38px;
    }

    .kc-tl__date {
        font-size: 13.5px;
    }

    .kc-tl__item {
        font-size: 14px;
    }

    .kc-archive__head {
        gap: 12px;
    }

    .kc-archive__title {
        font-size: 19px;
    }
}

/* ============ 9.6 搜索页（照 heiliao 那套）============
   页内搜索框 + 热门搜索标签云 + 横向结果列表（缩略图在左）。
   ⚠️ 缩略图比例用 1300/640（跟采集来的封面一致），别用 16:9 —— 那会裁掉一圈。 */
.kc-sbox {
    display: flex;
    gap: 8px;
    margin: 4px 0 18px;
}

.kc-sbox__input {
    flex: 1;
    min-width: 0;
    height: 44px;
    padding: 0 14px;
    border: 1px solid var(--kc-border);
    border-radius: var(--kc-radius);
    background: var(--kc-card);
    color: var(--kc-text);
    font-size: 15px;
    outline: 0;
}

.kc-sbox__input::placeholder {
    color: var(--kc-text-3);
}

.kc-sbox__input:focus {
    border-color: var(--kc-accent);
}

.kc-sbox__btn {
    flex: none;
    height: 44px;
    padding: 0 22px;
    border: 0;
    border-radius: var(--kc-radius);
    background: var(--kc-accent);
    color: #0a001f;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}

.kc-sbox__btn:hover {
    filter: brightness(1.08);
}

/* —— 热门搜索标签云 —— */
.kc-hotsearch {
    margin-top: 6px;
}

.kc-hotsearch__t {
    margin: 0 0 12px;
    font-size: 15px;
    color: var(--kc-text-2);
}

.kc-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.kc-tag {
    display: inline-flex;
    align-items: center;
    height: 32px;
    padding: 0 14px;
    border: 1px solid var(--kc-border);
    border-radius: 16px;
    background: var(--kc-card);
    color: var(--kc-text-2);
    font-size: 13.5px;
}

.kc-tag:hover {
    border-color: var(--kc-accent);
    color: var(--kc-accent);
}

/* —— 搜索结果：横向列表 —— */
.kc-slist {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.kc-sitem__link {
    display: flex;
    gap: 12px;
    padding: 8px;
    border: 1px solid var(--kc-border-soft);
    border-radius: var(--kc-radius);
    background: var(--kc-card);
}

.kc-sitem__link:hover {
    border-color: var(--kc-accent);
}

.kc-sitem__thumb {
    flex: none;
    width: 168px;
    aspect-ratio: 1300 / 640;
    border-radius: var(--kc-radius-sm);
    overflow: hidden;
    background: var(--kc-bg-soft);
}

.kc-sitem__thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.kc-sitem__body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
}

.kc-sitem__title {
    margin: 0;
    font-size: 15.5px;
    line-height: 1.45;
    font-weight: 600;
    color: #dcdcdc;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.kc-sitem__link:hover .kc-sitem__title {
    color: var(--kc-accent);
}

.kc-sitem__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 12.5px;
    color: var(--kc-text-3);
}

.kc-sitem__cat {
    color: var(--kc-text-2);
}

/* 窄屏：缩略图收窄一档 */
@media (max-width: 559px) {
    .kc-sitem__thumb {
        width: 116px;
    }

    .kc-sitem__title {
        font-size: 14.5px;
    }

    .kc-sbox__input,
    .kc-sbox__btn {
        height: 40px;
        font-size: 14px;
    }
}

/* ============ 10. 响应式 ============ */
/* 断点策略：
   手机  <768px  → 单列窄栏（660px 视觉，铺满宽度）
   平板  768+    → 稍宽
   桌面  1024+   → 宽栏 1180px、信息流双列、字号收紧、详情页左右分栏
   大屏  1440+   → 1320px                                            */

/* —— 平板 —— */
@media (min-width: 768px) {
    :root {
        --kc-max: 720px;
    }

    /* 竖线画在内容栏两侧（不是视口边缘） */
    .kc-header__bar,
    .kc-nav,
    .kc-wrap {
        border-left: 1px solid var(--kc-border-soft);
        border-right: 1px solid var(--kc-border-soft);
    }
}

/* —— 桌面 —— */
@media (min-width: 1024px) {
    :root {
        --kc-max: 960px;
        --kc-gap: 12px;
        /* ⚠️ 不要在这里改 --kc-base-font：heiliao 全断点都是 16px，
           桌面缩字号会让"字大不大"变成两套标准、越调越乱 */
    }

    /* 信息流改双列 */
    .kc-feed {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14.4px;
        align-items: start;
    }

    .kc-item {
        margin-top: 0;
    }

    /* 漫画专区分类页：一行 3 个，卡片随之放大。
       ⚠️ --poster-lg 是**分类页专用**的修饰类；文章详情页的「同类推荐」也用
       .kc-feed--poster 但没这个类，仍是下面基线那条 6 列小图（两处观感故意不同）。
       三段 class 的选择器 (0,3,0) 压得过基线里的 .kc-feed.kc-feed--poster (0,2,0)；
       基线那条 auto-fill/minmax(140px) 继续管手机和平板。 */
    .kc-feed.kc-feed--poster.kc-feed--poster-lg {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14.4px;
    }

    /* 卡片放大到约 335px 宽后，14.4px 的标题就显得小了 */
    .kc-feed--poster-lg .kc-art-card__title {
        font-size: 16px;
    }

    /* 字号不放大（保持 heiliao 的 18px），只调内边距
       —— ⚠️ padding 要加在 wrapper 上（居中那层），不是标题本身 */
    .kc-item__title-wrap {
        padding: 0 22.4px;
    }

    /* 顶部：分类胶囊铺开，不用横滑 */
    .kc-header__bar {
        height: 54.4px;
    }

    .kc-logo {
        font-size: 20px;
    }

    .kc-nav {
        flex-wrap: wrap;
        overflow-x: visible;
    }

    /* ⚠️ 下面这些原来在桌面把标题放大（1.5rem / 1.15rem），
       比 heiliao 的 1.3rem 还大 —— 已去掉，全断点统一 */

    /* 详情/播放页：左右分栏（左侧主体，右侧选集+相关） */
    .kc-detail {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 380px;
        column-gap: 32px;
        align-items: start;
    }

    .kc-detail>.kc-play-entry,
    .kc-detail>.kc-detail__title,
    .kc-detail>.kc-detail__date,
    .kc-detail>.kc-detail__crew,
    .kc-detail>.kc-shots,
    .kc-detail>.kc-article,
    .kc-detail>.kc-detail__tags,
    .kc-detail>.kc-player,
    .kc-detail>.kc-playnav,
    .kc-detail>.kc-section:not(.kc-section--side) {
        grid-column: 1;
    }

    .kc-detail>.kc-section--side {
        grid-column: 2;
        margin-top: 22.4px;
    }

    /* 右栏第一块与左栏顶部对齐 */
    .kc-detail>.kc-section--side:first-of-type {
        margin-top: 0;
    }

    /* 右栏里的相关信息流收成单列 */
    .kc-section--side .kc-feed {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
    }

    .kc-section--side .kc-item {
        margin-top: 10.4px;
    }

    .kc-section--side .kc-item__title {
        font-size: 14.4px;
        /* = heiliao .relation .rel-article .article-title */
        padding: 0 16px;
        -webkit-line-clamp: 2;
    }

    /* 分页与页脚跟主栏对齐 */
    .kc-paging,
    .kc-more-link {
        grid-column: 1 / -1;
    }
}

/* —— 大屏 —— */
@media (min-width: 1440px) {
    :root {
        --kc-max: 1060px;
    }

    .kc-detail {
        grid-template-columns: minmax(0, 1fr) 420px;
    }
}

/* ============ 11. 阅读模式（小说正文字号 + 背景切换）============
   排版参数参考起点 m.qidian.com 的正文容器实测值：
     行高 1.8（leading-[1.8]）、段间距 1.5em（mt-1.5em）、
     深色底 #191919（--Surface）、护眼绿 #ebfaeb、
     字体 PingFang SC（--Font_Family）。字号起点是 JS 设的、CSS 里取不到，
     这里默认 18px（常见阅读器默认），用户可自行调节。
   ⚠️ 切背景不是只改正文块 —— 整套设计变量一起覆盖，
      header/底栏/相关推荐/分页 全都跟着走，才是真正的"阅读模式"。 */

html[data-kc-read="dark"] {
    --kc-read-bg: #191919;
    --kc-read-fg: #c9c9c9;
}

html[data-kc-read="white"] {
    --kc-read-bg: #ffffff;
    --kc-read-fg: #191919;
    --kc-bg: #ffffff;
    --kc-bg-soft: #f5f5f5;
    --kc-card: #f5f5f5;
    --kc-card-hi: #ebebeb;
    --kc-border: #dcdcdc;
    --kc-border-soft: #e8e8e8;
    --kc-text: #191919;
    --kc-text-2: #4a4a4a;
    --kc-text-3: #808080;
}

html[data-kc-read="green"] {
    --kc-read-bg: #ebfaeb;
    --kc-read-fg: #24391f;
    --kc-bg: #ebfaeb;
    --kc-bg-soft: #e2f5e2;
    --kc-card: rgba(0, 0, 0, .05);
    --kc-card-hi: rgba(0, 0, 0, .08);
    --kc-border: rgba(0, 0, 0, .16);
    --kc-border-soft: rgba(0, 0, 0, .10);
    --kc-text: #24391f;
    --kc-text-2: #4a6b46;
    --kc-text-3: #6f8f6b;
}

/* 正文按阅读设置走：字号用变量（JS 调），颜色用主题色 */
html[data-kc-read] .kc-article--art {
    font-size: var(--kc-read-fs, 18px);
    line-height: 1.8;
    color: var(--kc-read-fg);
}

html[data-kc-read] .kc-article--art p {
    margin: 0 0 1.5em;
}

/* 浅色主题下，压在深色底上的东西要换个样子（标题压图的阴影、细节调） */
html[data-kc-read="white"] body.kc-body,
html[data-kc-read="green"] body.kc-body {
    background: var(--kc-read-bg);
}

/* ——— 阅读工具条（右侧竖排，靠垂直居中）———
   ⚠️ 容器是 --kc-max 居中的，宽屏时工具条落在容器外的空白里、不压正文；
      但屏宽不够（容器外余量 < 66px）时会压到字上 → 见下面那条媒体查询，
      那时给 .kc-wrap 补 padding-right 把位置让出来。 */
.kc-reader-bar {
    position: fixed;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 500;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7.2px;
    padding: 8.8px 6.08px;
    border-radius: 999px;
    background: rgba(20, 20, 20, .9);
    border: 1px solid rgba(255, 255, 255, .14);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 6px 24px rgba(0, 0, 0, .45);
}

/* 容器外余量不足时，把正文往左让 66px，保证工具条不压字 */
@media (max-width: 1311px) {
    html[data-kc-read] .kc-wrap {
        padding-right: 66px;
    }
}

html[data-kc-read="white"] .kc-reader-bar,
html[data-kc-read="green"] .kc-reader-bar {
    background: rgba(255, 255, 255, .94);
    border-color: rgba(0, 0, 0, .12);
    box-shadow: 0 6px 24px rgba(0, 0, 0, .18);
}

.kc-reader-bar__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30.4px;
    height: 30.4px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #e8e8e8;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

html[data-kc-read="white"] .kc-reader-bar__btn,
html[data-kc-read="green"] .kc-reader-bar__btn {
    color: #333;
}

.kc-reader-bar__btn:hover {
    background: rgba(255, 255, 255, .12);
}

html[data-kc-read="white"] .kc-reader-bar__btn:hover,
html[data-kc-read="green"] .kc-reader-bar__btn:hover {
    background: rgba(0, 0, 0, .07);
}

.kc-reader-bar__fs {
    width: 30.4px;
    text-align: center;
    color: var(--kc-accent);
    font-size: 11px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}

.kc-reader-bar__sep {
    width: 19.2px;
    height: 1px;
    background: currentColor;
    opacity: .18;
}

.kc-reader-bar__dot {
    width: 21.6px;
    height: 21.6px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, .3);
    cursor: pointer;
    padding: 0;
    flex: none;
}

html[data-kc-read="white"] .kc-reader-bar__dot,
html[data-kc-read="green"] .kc-reader-bar__dot {
    border-color: rgba(0, 0, 0, .18);
}

.kc-reader-bar__dot[data-kc-read-set="white"] {
    background: #fff;
}

.kc-reader-bar__dot[data-kc-read-set="green"] {
    background: #ebfaeb;
}

.kc-reader-bar__dot[data-kc-read-set="dark"] {
    background: #191919;
}

.kc-reader-bar__dot.is-active {
    border-color: var(--kc-accent);
    box-shadow: 0 0 0 2px rgba(243, 149, 27, .35);
}

/* 窄屏：工具条再紧凑一点，让出的位置也小一点 */
@media (max-width: 560px) {
    .kc-reader-bar {
        right: 8px;
        gap: 4.8px;
        padding: 7.2px 4.8px;
    }

    .kc-reader-bar__btn,
    .kc-reader-bar__fs {
        width: 26.4px;
    }

    .kc-reader-bar__btn {
        height: 26.4px;
        font-size: 13px;
    }

    .kc-reader-bar__dot {
        width: 18.4px;
        height: 18.4px;
    }

    html[data-kc-read] .kc-wrap {
        padding-right: 54px;
    }
}
@media (max-width: 480px) {
    /* ⚠️ 不再缩根字号：heiliao 全尺寸都是 16px */
    .kc-item__title-wrap {
        padding: 0 12.8px;
    }
}

/* ============ 补丁：链接颜色提权（2026-10-07）============
   为什么需要这块：
     · kaiche.css 上方的 body.kc-body a { color: inherit } 强度是 (0,1,2)，
       会压掉下面这些**单类 / 类+元素**的 <a> 颜色规则（(0,1,0)/(0,1,1)）；
     · 而且默认主题 public-head-main.css 的 a:link, a:visited 是 (0,1,1)，
       就算删掉那条 reset，单类规则照样赢不过它（试过，全站变 #666）。
   所以这些规则必须提到 (0,2,1) 以上 —— 统一加 body.kc-body 前缀。
   ⚠️ 顺序必须跟原文一致，且 :hover / .is-active 变体也要一起提，
      否则提权后的基础规则会反过来压掉悬停色和选中色。
   ⚠️ 改这些颜色请改上面原来的规则，并同步改这里（或者改完重跑生成器）。 */

body.kc-body .kc-iconbtn {
    color: var(--kc-text);
}
body.kc-body .kc-iconbtn:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-logo {
    color: var(--kc-logo);
}
body.kc-body .kc-nav__item {
    color: var(--kc-text-2);
}
body.kc-body .kc-nav__item:hover {
    color: var(--kc-text);
}
body.kc-body .kc-nav__item.is-active {
    color: var(--kc-accent);
}
body.kc-body .kc-tnode__link {
    color: var(--kc-text-2);
}
body.kc-body .kc-tnode__link.is-active {
    color: var(--kc-accent);
}
body.kc-body .kc-tnode__link:hover {
    color: var(--kc-text);
}
body.kc-body .kc-tchild__link {
    color: var(--kc-text-3);
}
body.kc-body .kc-tchild__link:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-tchild__link.is-active {
    color: var(--kc-accent);
}
body.kc-body .kc-sheet__item {
    color: var(--kc-text-2);
}
body.kc-body .kc-sheet__item--out {
    color: var(--kc-text-3);
}
body.kc-body .kc-sheet__item--out:hover {
    color: var(--kc-hot);
}
body.kc-body .kc-sheet__item:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-thread__item a:hover .kc-thread__title {
    color: var(--kc-accent);
}
body.kc-body .kc-art-card a:hover .kc-art-card__title {
    color: var(--kc-accent);
}
body.kc-body .kc-subnav__item {
    color: var(--kc-text-2);
}
body.kc-body .kc-subnav__item:hover {
    color: var(--kc-text);
}
body.kc-body .kc-subnav__item.is-active {
    color: var(--kc-accent);
}
body.kc-body .kc-section__more {
    color: var(--kc-text-3);
}
body.kc-body .kc-section__more:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-fav {
    color: var(--kc-text-2);
}
body.kc-body .kc-fav:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-fav.disabled {
    color: var(--kc-accent);
}
body.kc-body .kc-paging a {
    color: var(--kc-text-2);
}
body.kc-body .kc-paging a:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-paging .is-active a {
    color: #0a001f;
}
body.kc-body #pinglun .cmt-actions a {
    color: var(--kc-text-3) !important;
}
body.kc-body #pinglun .gw_action a {
    color: var(--kc-text-3) !important;
}
body.kc-body #pinglun .comm_cont a {
    color: var(--kc-text-3) !important;
}
body.kc-body #pinglun .cmt-actions a:hover {
    color: var(--kc-accent) !important;
}
body.kc-body #pinglun .gw_action a:hover {
    color: var(--kc-accent) !important;
}
body.kc-body #pinglun .comm_cont a:hover {
    color: var(--kc-accent) !important;
}
body.kc-body .mac_comment .page a {
    color: var(--kc-text-2) !important;
}
body.kc-body .mac_comment .page span.num {
    color: var(--kc-text-2) !important;
}
body.kc-body .mac_comment .page a:hover {
    color: var(--kc-accent) !important;
}
body.kc-body .mac_comment .page a.page_current {
    color: #0a001f !important;
}
body.kc-body .mac_comment .page a.page_current:hover {
    color: #0a001f !important;
}
body.kc-body .mac_comment .page .btns_disad {
    color: var(--kc-text-3) !important;
}
body.kc-body .kc-gate__btn {
    color: #0a001f;
}
body.kc-body .kc-gate__btn--ghost {
    color: var(--kc-text-2);
}
body.kc-body .kc-gate__btn--ghost:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-playnav a {
    color: var(--kc-text-2);
}
body.kc-body .kc-playnav a:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-sort__item {
    color: var(--kc-text-2);
}
body.kc-body .kc-sort__item:hover {
    color: var(--kc-text);
}
body.kc-body .kc-sort__item.is-active {
    color: var(--kc-accent);
}
body.kc-body .kc-detail__tags a {
    color: var(--kc-text-2);
}
body.kc-body .kc-detail__tags a:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-plays__list a {
    color: var(--kc-text-2);
}
body.kc-body .kc-plays__list a:hover {
    color: #0a001f;
}
body.kc-body .kc-plays__list a.is-active {
    color: #0a001f;
}
body.kc-body .kc-rank__item a:hover .kc-rank__name {
    color: var(--kc-accent);
}
body.kc-body .kc-more-link a {
    color: var(--kc-text-2);
}
body.kc-body .kc-more-link a:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-footer a {
    color: var(--kc-text-2);
}
body.kc-body .kc-footer a:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-archive__sub a {
    color: var(--kc-text-2);
}
body.kc-body .kc-archive__sub a:hover {
    color: var(--kc-accent);
}
body.kc-body a.kc-cal__cell:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-tl__date {
    color: var(--kc-text);
}
body.kc-body .kc-tl__date:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-tl__item {
    color: #cfcfcf;
}
body.kc-body .kc-tl__item:hover {
    color: var(--kc-accent);
}
body.kc-body .kc-tl__more {
    color: var(--kc-accent);
}
body.kc-body .kc-tag {
    color: var(--kc-text-2);
}
body.kc-body .kc-tag:hover {
    color: var(--kc-accent);
}

/* ============ 9.6 广告位容器（2026-10-07） ============
   由后台「主题设置 → 广告位」控制，留空则模板**整个不输出**（连容器都没有）。
   容器只管居中 + 限宽，具体放什么（图片 / iframe / 联盟代码）由后台填的 HTML 决定。
   ⚠️ 本主题 CSS 一律写 px、别用 rem —— 默认主题的 jquery-adaptive.js 会改根字号
      （实测 1rem = 40px），用 rem 会被放大 2.5 倍。 */
.kc-ad {
    text-align: center;
}

.kc-ad img {
    max-width: 100%;
    height: auto;
    display: inline-block;
    vertical-align: middle;
}

/* 顶部横幅：跟顶栏同宽，落在 sticky 顶栏下面（顶栏是 sticky 不是 fixed，不用补偏移） */
.kc-ad--top {
    max-width: var(--kc-max);
    margin: 10px auto 0;
    padding: 0 var(--kc-gap);
}

/* 信息流插播：在网格里要横跨所有列；父元素不是网格时 grid-column 被忽略，无害 */
.kc-ad--infeed {
    grid-column: 1 / -1;
    padding: 4px 0;
}

/* 播放页：播放器上方 / 下方 */
.kc-ad--play {
    margin: 14px 0;
}

/* ============ 9.7 卡片广告 + 横幅广告（2026-10-07 接前台） ============
   后台「广告设置」4 组里的前两组，另外两组（图标 / 文字链接）还没接。
   卡片广告：壳直接复用 .kc-item（见 widget/kc_ad_card.html），
             所以这里**只需要加一个「广告」角标**，尺寸对齐全靠 .kc-item 自己。
   横幅广告：整组横排，放在视频信息流下面。 */

/* 「广告」角标：放右上角（日期角标在左上，别撞） */
.kc-badge--ad {
    right: 4.8px;
    top: 4.8px;
    background: rgba(0, 0, 0, .68);
    color: #ffd76a;
    border: 1px solid rgba(255, 215, 106, .55);
}

/* 横幅广告：放在信息流下面。
   🔴 **照之前站（yuwangck/mitaoyy 的小主题）那套来** ——
      整页宽、**上下并列**（一条一行）、图 `width:100%` 自适应。
   🔴 **尺寸参照 heiliao**：它的横幅创意图就是 **710×80**（8.875:1），
      所以容器锁 `aspect-ratio: 710/80`，正常横幅铺进去**一像素不裁不变形**。
   🔴 **`object-fit: fill`** —— 这是用户 2026-09-07 定的约定（记忆 xiaozhuti-appads-topbanner）：
      广告图一律「拉伸填满容器、不裁切、完整显示，比例不符宁可轻微变形」。
      **别改成 cover**（cover 会裁掉边上的字）。
   🔴 **限高 120px**：内容区宽 1060px 时 710:80 算出来正好 119px，所以 120 是「不触发」的上限；
      屏幕再宽才会生效，防止横幅长成一大条。 */
.kc-adban {
    display: block;
    padding: 2px 0 12px;
}

.kc-adban__item {
    display: block;
    width: 100%;
    aspect-ratio: 710 / 80;
    max-height: 120px;
    overflow: hidden;
    border-radius: var(--kc-radius, 6px);
    border: 1px solid var(--kc-border-soft);
    line-height: 0;
}

.kc-adban__item + .kc-adban__item {
    margin-top: 8px;
}

.kc-adban__item img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: fill;
}

/* ============ 9.8 图标广告 + 文字链接广告（2026-10-07 接前台） ============
   图标广告（对应 heiliao 的 pop_grid：van-grid / van-grid-item__icon）：宫格小图标、不显示名字。
     插在：最近更新页标题上方 / 小说·漫画专区标题上方 / 搜索页热门搜索下方 / 播放页留言板上方。
   文字链接广告（对应 heiliao 的 c1：text_span）：一排文字链，插在播放页「简介」上方。

   🔴 排版：**靠左**（用户 2026-10-07 定的 —— 先说「参照 heiliao」让我改成居中宫格，
      看到效果后又改回来：「不要居中了，文字和图标还是靠左吧，和之前你做的靠左一样」）。
      **别再改成 `justify-content: center`。**
   🔴 列数：**图标 PC 一排 10 个 / 手机 6 个；文字链 PC 一排 5 个**（手机不锁列数，见下）。
   🔴 尺寸**不写死 px**：`flex-basis` 用百分比（算上 gap）+ `max-width` 上限 ——
      这是记忆 [[ad-sizing-rule]] 里用户踩过一轮之后定的：先固定过 80/50，看完效果又改回
      「电脑端随栏宽自适应、只在手机端留上限」。**照参考站抄之前先问，别自作主张写死。**
   🔴 图标 `object-fit: contain`（等比缩放，不裁不拉）—— 图标上常有品牌字，拉伸会很难看。 */
.kc-adicon {
    /* 🔴 用 **grid** 而不是 flex（2026-10-07 定的最终版）：
       · 轨道 `repeat(10, 1fr)` **铺满整行** → 满行时左右都到边，**右边不会留一截** ✓
       · 图标在自己那一列里 `justify-self: center` 居中 → **列永远对齐**，
         所以最后一行不满时（25 个 → 最后一排 5 个）也是**跟上面的列对齐**的 ✓
       ⚠️ 走过的弯路：先用过 `flex` + `space-between` —— 满行确实铺满了，
          但**不满的最后一行会被撑开、跟上面的列错位**（用户截图指出「第三排明显没和上面对齐」）✗；
          更早还试过「按条数挑能整除的列数」，那会让图标尺寸跟着变（用户说不是之前的大小）✗。
          所以要改这里，先想清楚**这两个约束都要满足**：尺寸固定 + 列对齐。 */
    display: grid;
    grid-template-columns: repeat(10, minmax(0, 1fr));
    align-items: start;
    gap: 10px;
    padding: 2px 0 14px;
}

.kc-adicon__item {
    /* 🔴 尺寸 64px（用户 2026-10-07：「PC端和手机端的图标都调小一点，现在太大了」，
       原来 88px）。网格轨道比 64 宽，靠 `justify-self: center` 在列内居中，
       多出来的空间左右各分一半 —— 所以**调这个数只改图标大小，列数和对齐不受影响**。 */
    width: 100%;
    max-width: 64px;
    justify-self: center;
    align-self: start;
    aspect-ratio: 1 / 1;
    display: block;
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid var(--kc-border-soft);
    line-height: 0;
}

.kc-adicon__item img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

/* 搜索页：图标广告紧跟在「热门搜索」下面，而 .kc-hotsearch 只有 6px 上边距、没有下边距，
   加上 .kc-adicon 自己上边才 2px → 两者贴着，太挤（用户 2026-10-07 截图指出）。
   用**相邻兄弟选择器**限定，只影响搜索页这一处 —— 其它 4 个插入点（页标题上方那些）不变。 */
.kc-hotsearch + .kc-adicon {
    margin-top: 18px;
}

/* 文字链接广告：**靠左**排（跟图标广告一致，用户 2026-10-07 定的）。
   🔴 列数：**PC 一排 5 个 / 手机一排 4 个**，**条数不限** —— 有多少显示多少，满了自动换行。
      （原来 public/include.html 里有 `array_slice($kc_texts, 0, 20)` 截到 20 条，
        用户 2026-10-07 改口「文字广告也不要限定20个了，和图标一样自动换行吧」→ **已删**。）
      每个格子等宽、文字居中在格子里（格子靠左排）。
   ⚠️ 后台有些标题很长（heiliao 扒来的那条「澳门威尼斯，首充就送豪礼…」有 20 多字），
      所以必须 `overflow:hidden` + `text-overflow:ellipsis`，不然会把格子撑破。 */
.kc-adtext {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 2px 0 14px;
}

.kc-adtext__item {
    /* 一行 5 个：扣掉 4 个 8px 的 gap */
    flex: 0 0 calc((100% - 32px) / 5);
    max-width: 200px;
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid var(--kc-border-soft);
    background: var(--kc-card);
    color: var(--kc-text-2);
    font-size: 14px;
    line-height: 1.4;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color .15s, border-color .15s;
}

.kc-adtext__item:hover {
    color: var(--kc-accent);
    border-color: var(--kc-accent);
}

@media (max-width: 640px) {
    /* 手机一行 5 个（用户 2026-10-07 定） */
    .kc-adicon {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    /* 文字链：手机一排 4 个（扣掉 3 个 8px 的 gap） */
    .kc-adtext__item {
        flex: 0 0 calc((100% - 24px) / 4);
        max-width: 100%;
    }
}

/* ============ 9.9 邮箱小弹窗（2026-10-07） ============
   点右侧个人中心面板里的「永不失联邮箱」弹出来的小窗，**结构在 widget/kc_mail_modal.html**
   （那个组件在 public/foot.html 里 include，自己带 JS 开关）。
   原来那一项是 `mailto:` —— 会拉起系统/浏览器自己那一层界面，用户说没必要，
   改成站内小窗：显示邮箱（带一键复制）+ 一行说明。
   写法跟 .kc-sheet 那套一致：遮罩 + 面板 + `is-open` 开关。
   ⚠️ `visibility` 是离散属性、**不能给时长** —— 关的时候延后切 hidden（这个坑在 .kc-sheet 上踩过）。
   ⚠️ 类名按组件里的来（`kc-mailm`，不是 `kc-mailbox`）—— 别改名字，改了样式就对不上了。 */
.kc-mailm {
    position: fixed;
    inset: 0;
    z-index: 950;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .25s, visibility 0s .25s;
}

.kc-mailm.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity .25s, visibility 0s 0s;
}

.kc-mailm__mask {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .62);
    cursor: pointer;
}

.kc-mailm__box {
    position: relative;
    z-index: 1;
    width: min(92vw, 360px);
    padding: 22px 20px 18px;
    background: var(--kc-card);
    border: 1px solid var(--kc-border-soft);
    border-radius: var(--kc-radius, 6px);
    text-align: center;
    transform: translateY(10px);
    transition: transform .25s cubic-bezier(.4, 0, .2, 1);
}

.kc-mailm.is-open .kc-mailm__box {
    transform: translateY(0);
}

.kc-mailm__close {
    position: absolute;
    right: 6px;
    top: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--kc-text-2);
    cursor: pointer;
    transition: background .15s, color .15s;
}

.kc-mailm__close:hover {
    background: var(--kc-card-hi);
    color: var(--kc-accent);
}

.kc-mailm__title {
    margin: 0 0 14px;
    font-size: 16px;
    font-weight: 700;
    color: var(--kc-text);
}

/* 邮箱 + 复制按钮一行。邮箱用 `user-select: all`：点一下整串被选中，方便长按复制 */
.kc-mailm__addr {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.kc-mailm__mail {
    font-size: 17px;
    font-weight: 700;
    color: var(--kc-accent);
    word-break: break-all;
    user-select: all;
    -webkit-user-select: all;
}

.kc-mailm__copy {
    flex: none;
    padding: 3px 10px;
    border: 1px solid var(--kc-border-soft);
    border-radius: 999px;
    background: transparent;
    color: var(--kc-text-2);
    font-size: 13px;
    cursor: pointer;
    transition: color .15s, border-color .15s;
}

.kc-mailm__copy:hover {
    color: var(--kc-accent);
    border-color: var(--kc-accent);
}

.kc-mailm__tip {
    margin: 0;
    font-size: 14px;
    line-height: 1.7;
    color: var(--kc-text-2);
}