@charset "UTF-8";
/**
 * AIOCyber 赛博皮肤层 v4.0.0
 * ----------------------------------------------------------
 * 设计原则：只覆盖【颜色 / 光影 / 圆角 / 动效】，零布局改动。
 * 原理：aio.global.css 全站使用 --xzm-* 变量取色，
 *       本文件仅覆写变量值 + 叠加霓虹特效，删除本文件即回到原样。
 */

/* ============ 01 主题令牌覆盖（换变量即换肤） ============ */
:root {
    /* 霓虹点缀：极客蓝 → 赛博青 */
    --xzm-accent: #00f0ff;
    --xzm-accent-hover: #00c2d4;
    /* 底色体系：深空蓝黑 */
    --xzm-bg-deep: #050608;
    --xzm-bg-card: #0b0e14;
    --xzm-bg-hover: #141926;
    /* 边框：青色调极细描边 */
    --xzm-border: rgba(0, 240, 255, 0.10);
    /* 文字 */
    --xzm-text-main: #e8ecf1;
    --xzm-text-muted: #8b93a1;
    /* 皮肤专属令牌 */
    --ck-purple: #a855f7;
    --ck-gradient: linear-gradient(135deg, #00f0ff, #7c3aed);
    --ck-glow: 0 0 18px rgba(0, 240, 255, .16);
    --ck-glow-strong: 0 0 26px rgba(0, 240, 255, .30), 0 0 52px rgba(168, 85, 247, .14);
}

/* ============ 02 全局氛围 ============ */
::selection { background: rgba(0, 240, 255, .28); color: #fff; }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: var(--xzm-bg-deep); }
::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(0,240,255,.35), rgba(124,58,237,.35));
    border-radius: 8px;
    border: 2px solid var(--xzm-bg-deep);
}
::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, rgba(0,240,255,.6), rgba(124,58,237,.6));
}

/* 赛博网格底纹 + 顶部辉光（新增伪元素，不影响现有布局） */
body::before {
    content: "";
    position: fixed; inset: 0; z-index: -1; pointer-events: none;
    background:
        radial-gradient(ellipse 90% 42% at 50% -8%, rgba(0, 240, 255, .07), transparent 62%),
        radial-gradient(ellipse 70% 36% at 88% 4%, rgba(124, 58, 237, .06), transparent 60%),
        linear-gradient(rgba(148,163,184,.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(148,163,184,.03) 1px, transparent 1px);
    background-size: auto, auto, 34px 34px, 34px 34px;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.9) 0%, rgba(0,0,0,.35) 46%, rgba(0,0,0,1) 100%);
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.9) 0%, rgba(0,0,0,.35) 46%, rgba(0,0,0,1) 100%);
}
@media (max-width: 768px) {
    body::before { background-size: auto, auto, 26px 26px, 26px 26px; }
}

/* ============ 03 头部与导航 ============ */
.aio-header { position: relative; }
.aio-header::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
    background: linear-gradient(90deg, transparent 6%, rgba(0,240,255,.5) 30%, rgba(168,85,247,.45) 70%, transparent 94%);
    opacity: .55; pointer-events: none;
}
.aio-header .logo-text {
    background: linear-gradient(90deg, #fff 20%, #00f0ff 60%, #a855f7);
    background-size: 200% auto;
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: background-position .5s ease;
}
.aio-header .logo-text:hover { background-position: 98% center; filter: drop-shadow(0 0 10px rgba(0,240,255,.35)); }
.aio-header .logo-image img { transition: filter .4s ease; }
.aio-header .logo-image:hover img { filter: drop-shadow(0 0 12px rgba(0,240,255,.45)); }

.nav-list > li > a { transition: color .22s ease; }
.nav-list > li > a > span { position: relative; }
.nav-list > li > a > span::after {
    content: ""; position: absolute; left: 0; right: 100%; bottom: -3px; height: 2px;
    background: linear-gradient(90deg, #00f0ff, #a855f7);
    border-radius: 2px;
    transition: right .28s cubic-bezier(.2, .8, .2, 1);
    box-shadow: 0 0 8px rgba(0, 240, 255, .55);
}
.nav-list > li:hover > a { color: var(--xzm-accent) !important; text-shadow: 0 0 12px rgba(0,240,255,.4); }
.nav-list > li:hover > a > span::after { right: 0; }
.nav-list > li.active > a { color: var(--xzm-accent) !important; }

/* ============ 04 按钮 ============ */
.btn-primary,
.comment-submit {
    background-image: var(--ck-gradient) !important;
    background-color: transparent !important;
    border: 0 !important;
    color: #04121a !important;
    font-weight: 700;
    transition: filter .2s ease, box-shadow .2s ease;
}
.btn-primary:hover,
.comment-submit:hover { filter: brightness(1.12) !important; box-shadow: var(--ck-glow-strong) !important; color: #04121a !important; }
.btn-outline-primary:not(.my-tag-filter-button),
.btn-outline-secondary {
    transition: color .22s ease, border-color .22s ease, box-shadow .22s ease, background-color .22s ease;
}
.btn-outline-primary:not(.my-tag-filter-button):hover,
.btn-outline-secondary:hover {
    color: var(--xzm-accent) !important;
    border-color: rgba(0, 240, 255, .35) !important;
    box-shadow: var(--ck-glow) !important;
}

/* ============ 05 列表与卡片 ============ */
.aio-list > li.item,
.aio-list-box li.item {
    transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease !important;
}
.aio-list > li.item:hover,
.aio-list-box li.item:hover {
    border-color: rgba(0, 240, 255, .30) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .45), 0 0 22px rgba(0, 240, 255, .10) !important;
}
.aio-list .thumbnail img { transition: transform .45s cubic-bezier(.2, .8, .2, 1) !important; }
.aio-list li.item:hover .thumbnail img { transform: scale(1.06) !important; }
.aio-list .box-title a:hover .title,
.aio-curated .title-hover:hover .title { color: var(--xzm-accent) !important; text-shadow: 0 0 14px rgba(0, 240, 255, .4); }
.field-date i, .field-sort i { color: var(--xzm-accent); opacity: .85; }

/* 首页分类卡片：顶部霓虹线 + 悬停辉光 */
.category-section { position: relative; overflow: hidden; transition: box-shadow .3s ease, border-color .3s ease; }
.category-section::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; z-index: 2;
    background: linear-gradient(90deg, rgba(0,240,255,.5), rgba(168,85,247,.35), transparent 70%);
    opacity: .7; pointer-events: none;
}
.category-section .card { transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease, border-color .3s ease !important; }
.category-section .card:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(0, 240, 255, .30) !important;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .5), 0 0 20px rgba(0, 240, 255, .12) !important;
}
.category-section .card .cover-aspect { overflow: hidden; }
.category-section .card .cover-aspect img { transition: transform .45s cubic-bezier(.2, .8, .2, 1) !important; }
.category-section .card:hover .cover-aspect img { transform: scale(1.06) !important; }

/* 票签/徽章 */
.ticket { box-shadow: 0 0 10px rgba(0, 240, 255, .18); }
.ticket-rainbow { background: linear-gradient(90deg, rgba(0,240,255,.18), rgba(168,85,247,.18)) !important; border-color: rgba(168,85,247,.4) !important; }

/* 相邻文章按钮 */
.article-neighbor .btn { transition: all .25s ease; }
.article-neighbor .btn:hover:not(.disabled) {
    color: var(--xzm-accent) !important;
    border-color: rgba(0, 240, 255, .35) !important;
    box-shadow: var(--ck-glow) !important;
}

/* ============ 06 文章页 ============ */
.article-title { text-shadow: 0 0 30px rgba(0, 240, 255, .12); }
.article-content a { color: var(--xzm-accent) !important; border-bottom: 1px dashed rgba(0, 240, 255, .4); }
.article-content a:hover { border-bottom-style: solid; text-shadow: 0 0 10px rgba(0, 240, 255, .45); }
.article-content .nc-text a { border-bottom: 0; }
.article-content .nc-text a:hover { text-shadow: 0 0 12px rgba(255, 215, 0, .6); }
.article-content code {
    background: rgba(0, 240, 255, .08) !important;
    color: var(--xzm-accent) !important;
    border: 1px solid rgba(0, 240, 255, .14);
}
.article-content pre { border: 1px solid var(--xzm-border) !important; box-shadow: inset 0 0 30px rgba(0, 240, 255, .03); }
.article-content blockquote { border-left: 3px solid var(--ck-purple) !important; }
.article-content h2 { border-left-color: var(--xzm-accent) !important; }
.article-content h3 { border-left-color: rgba(168, 85, 247, .75) !important; }
.article-tags li a {
    transition: all .22s ease;
}
.article-tags li a:hover {
    color: var(--xzm-accent) !important;
    border-color: rgba(0, 240, 255, .35) !important;
    box-shadow: var(--ck-glow);
}
.excerpt-box {
    background: linear-gradient(120deg, rgba(0, 240, 255, .05), rgba(124, 58, 237, .05)) !important;
    border: 1px dashed rgba(0, 240, 255, .22) !important;
}

/* ============ 07 侧栏 ============ */
.aside-box { transition: border-color .3s ease, box-shadow .3s ease; }
.aside-box:hover { border-color: rgba(0, 240, 255, .22) !important; box-shadow: 0 0 24px rgba(0, 240, 255, .06) !important; }
.aside-head-title i { color: var(--xzm-accent) !important; text-shadow: 0 0 10px rgba(0, 240, 255, .5); }
.aside-head-dots { background: linear-gradient(90deg, transparent, rgba(168, 85, 247, .7), rgba(0, 240, 255, .7)) !important; }
.aside-list-dot li::before,
.aio-list-dot li::before { background: var(--ck-gradient) !important; }
.aside-list-tag li a { transition: all .22s ease; }
.aside-list-tag li a:hover {
    color: var(--xzm-accent) !important;
    border-color: rgba(0, 240, 255, .35) !important;
    box-shadow: var(--ck-glow);
}
.aside-list-hot .figcaption .number {
    background-image: var(--ck-gradient) !important;
    background-color: transparent !important;
    box-shadow: 0 0 14px rgba(0, 240, 255, .5) !important;
}
.aside-list-comment .avatar img, .aside-list-comment .avatar { border: 1px solid rgba(0, 240, 255, .25); }
.aside-box-blogger .avatar img { box-shadow: 0 0 22px rgba(0, 240, 255, .25) !important; }
.aside-list-timeline .time, .aside-list-comment .time { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

/* ============ 08 分页 / 筛选条 / 评论区 ============ */
.pagination a, .pagination span:not(.page-link) { transition: all .22s ease; }
.pagination a:hover { color: var(--xzm-accent) !important; border-color: rgba(0, 240, 255, .35) !important; box-shadow: var(--ck-glow) !important; }
.pagination span:not(.page-link) {
    background-image: var(--ck-gradient) !important;
    background-color: transparent !important;
    color: #04121a !important;
    box-shadow: 0 0 14px rgba(0, 240, 255, .35) !important;
}

/* 筛选条：仅加霓虹顶线与悬停辉光（不碰任何布局属性） */
.my-tag-filter-bar { position: relative; }
.my-tag-filter-bar::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; z-index: 2;
    background: linear-gradient(90deg, rgba(168,85,247,.55), rgba(0,240,255,.5), transparent 75%);
    opacity: .75; pointer-events: none;
}
.my-tag-filter-label { color: var(--xzm-accent) !important; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.my-tag-filter-button { transition: all .22s ease !important; }
.my-tag-filter-button:hover {
    color: var(--xzm-accent) !important;
    border-color: rgba(0, 240, 255, .35) !important;
    box-shadow: 0 0 12px rgba(0, 240, 255, .22) !important;
}

/* 评论区：懒加载按钮霓虹胶囊（仅视觉） */
#load-comments-button {
    color: var(--xzm-accent) !important;
    background-color: rgba(0, 240, 255, .06) !important;
    border: 1px solid rgba(0, 240, 255, .35) !important;
    letter-spacing: .1em;
    transition: all .28s ease !important;
}
#load-comments-button:hover {
    color: #04121a !important;
    background-image: var(--ck-gradient) !important;
    background-color: transparent !important;
    box-shadow: var(--ck-glow-strong) !important;
}
.comment-item-content { background: var(--xzm-bg-card) !important; border: 1px solid var(--xzm-border) !important; }
.comment-reply { color: var(--xzm-accent) !important; }
.comment-item .avatar { border: 1px solid rgba(0, 240, 255, .25) !important; }

/* 搜索框聚焦辉光 */
.aio-search-group { transition: border-color .25s ease, box-shadow .25s ease !important; }
.aio-search-group:focus-within { border-color: rgba(0, 240, 255, .35) !important; box-shadow: var(--ck-glow) !important; }
.aio-search-icon { color: var(--xzm-accent) !important; opacity: .75; }
.aio-search-submit {
    background-image: var(--ck-gradient) !important;
    background-color: transparent !important;
    color: #04121a !important;
    font-weight: 700;
}

/* ============ 09 插件组件适配 ============ */
/* 网盘按钮 */
.pan-hider-button {
    background-image: linear-gradient(135deg, #00f0ff, #38bdf8) !important;
    background-color: transparent !important;
    color: #04121a !important;
    box-shadow: 0 4px 18px rgba(0, 240, 255, .28) !important;
}
.pan-hider-button:hover { box-shadow: var(--ck-glow-strong) !important; }
/* 收藏按钮暗色适配 */
.em-fav-btn { background: var(--xzm-bg-card) !important; border-color: var(--xzm-border) !important; }
.em-fav-text { color: var(--xzm-text-muted) !important; }
.em-fav-count { background: var(--xzm-bg-hover) !important; color: var(--xzm-text-muted) !important; }
/* 二维码卡片悬停改青色 */
.xzm-qr-card {
    display: flex !important;
    align-items: center;
    text-decoration: none;
    margin-top: .9rem;
    padding: 13px;
    background: linear-gradient(145deg, rgba(16, 20, 29, .9), rgba(8, 10, 15, .6));
    border: 1px solid var(--xzm-border);
    border-radius: 14px;
    transition: all .3s cubic-bezier(.16, 1, .3, 1);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.xzm-qr-img-box {
    background: #fff;
    padding: 4px;
    border-radius: 10px;
    width: 64px;
    height: 64px;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .4);
}
.xzm-qr-img-box img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 6px; }
.xzm-qr-title { color: var(--xzm-text-main); font-size: .95rem; margin-bottom: 4px; }
.xzm-qr-desc {
    font-size: .76rem; line-height: 1.45; color: var(--xzm-text-muted);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.xzm-qr-arrow { color: var(--xzm-text-muted); font-size: 1.2rem; transition: all .3s ease; }
.xzm-qr-card:hover { border-color: rgba(0, 240, 255, .35) !important; box-shadow: 0 8px 20px rgba(0, 0, 0, .4), 0 0 15px rgba(0, 240, 255, .15) !important; }
.xzm-qr-card:hover .xzm-qr-title,
.xzm-qr-card:hover .xzm-qr-arrow { color: var(--xzm-accent) !important; }
.xzm-qr-card:hover .xzm-qr-arrow { transform: translateX(4px); }
/* 影视徽章辉光 */
.badge-ended .badge-dot { box-shadow: 0 0 6px #ffd54a; }
.badge-today .badge-arrow { filter: drop-shadow(0 0 4px #ff5470); }
.badge-future .badge-square { box-shadow: 0 0 6px #53b9ff; }
/* 弹窗暗色统一 */
.modal-content { background: var(--xzm-bg-card) !important; border: 1px solid rgba(0, 240, 255, .22) !important; }
button.btn-close { filter: invert(1) grayscale(1) brightness(1.6); }

/* ============ 10 滚动流畅度优化 ============ */
/* 修复“展开评论后回滚跳位”：
   正文折叠（content-visibility:auto）在回滚经过正文底边时，
   会从估算高度瞬间恢复真实高度，导致下方内容整体下移、视口跳到文章中上位置。
   正文位于文章页首屏，折叠收益趋近于零，直接关闭，滚动绝对稳定。 */
.article-content { content-visibility: visible !important; contain-intrinsic-size: auto 3000px; }
.xzm-neighbor-group { contain-intrinsic-size: auto 300px; }
#comments-section, .comments-area { contain-intrinsic-size: auto 1200px; }

/* 手机端：简化背景层（去掉 mask 遮罩与网格线，只留顶部辉光），大幅降低合成开销 */
@media (max-width: 768px) {
    body::before {
        background: radial-gradient(ellipse 90% 40% at 50% -8%, rgba(0, 240, 255, .07), transparent 62%);
        background-size: auto;
        -webkit-mask-image: none;
        mask-image: none;
    }
}

/* ============ 11 降级与无障碍 ============ */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}