/**
 * 首页皮肤：极光 Aurora（外观差异层，加载于 home-base.css 之后）
 *
 * 视觉：hero 全屏渐变光斑 + 玻璃拟态卡片；卡片圆角/阴影发光跟随主题色
 * 颜色策略：全部由父主题变量派生（--theme-color / --main-bg-color），color-mix 前
 *           均给纯变量回退行；.dark-theme 重定义同名变量即整体自动翻转，无需单独深色适配
 */

/*==== hero 区：单一居中排版（动画在上、文字在下）。
   底部距离=margin-bottom:var(--zsh-gap)，与下方区块统一由「区块纵向间距」驱动 ====*/
.zibll-home-aurora .zibll-home-hero {
    position: relative;
    display: flex;
    align-items: center;
    min-height: var(--zsh-hero-h, 480px); /*hero 高度设置经内联变量注入，0=默认*/
    padding: var(--zsh-pt, 30px) 0 var(--zsh-pb, 0);
    overflow: hidden;
    margin-top: -20px; /*抵消页眉下常见间距，让光斑贴到顶*/
    margin-bottom: var(--zsh-mb, var(--zsh-gap)); /*区块级下边距设置经 --zsh-mb 覆写*/
}

/*光斑层：三个巨型径向渐变 + 缓慢漂浮动画*/
.zibll-home-aurora .aurora-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
}
.zibll-home-aurora .aurora-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(64px);
    opacity: .55;
    background: var(--muted-bg-color); /*回退：不支持 color-mix 时为素色光斑*/
    animation: zb-aurora-float 18s ease-in-out infinite alternate;
}
.zibll-home-aurora .blob-1 {
    width: 560px;
    height: 560px;
    left: -120px;
    top: -160px;
    background: var(--theme-color);
    background: radial-gradient(circle at 50% 50%,
        color-mix(in srgb, var(--theme-color) 92%, transparent),
        color-mix(in srgb, var(--theme-color) 42%, transparent) 60%,
        transparent 78%);
    opacity: .5;
}
.zibll-home-aurora .blob-2 {
    width: 480px;
    height: 480px;
    right: -100px;
    top: 20%;
    background: #7c5cff;
    background: radial-gradient(circle at 50% 50%,
        color-mix(in srgb, var(--theme-color) 48%, #7c5cff),
        color-mix(in srgb, #7c5cff 26%, transparent) 62%,
        transparent 78%);
    opacity: .45;
    animation-delay: -6s;
}
.zibll-home-aurora .blob-3 {
    width: 420px;
    height: 420px;
    left: 34%;
    bottom: -220px;
    background: #20c8d8;
    background: radial-gradient(circle at 50% 50%,
        color-mix(in srgb, var(--theme-color) 38%, #20c8d8),
        color-mix(in srgb, #20c8d8 30%, transparent) 58%,
        transparent 74%);
    opacity: .42;
    animation-delay: -12s;
}
.zibll-home-aurora .blob-4 {
    width: 380px;
    height: 380px;
    right: 16%;
    bottom: -160px;
    background: #ffb05c;
    background: radial-gradient(circle at 50% 50%,
        color-mix(in srgb, var(--theme-color) 26%, #ffb05c),
        color-mix(in srgb, #ffb05c 26%, transparent) 58%,
        transparent 74%);
    opacity: .38;
    animation-duration: 22s;
    animation-delay: -9s;
}
@keyframes zb-aurora-float {
    from { transform: translate3d(0, 0, 0) scale(1); }
    to   { transform: translate3d(60px, 40px, 0) scale(1.15); }
}

/*细网格遮罩：光斑上叠科技感纹理*/
.zibll-home-aurora .aurora-grid-mask {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(color-mix(in srgb, var(--main-color) 5%, transparent) 1px, transparent 1px),
        linear-gradient(90deg, color-mix(in srgb, var(--main-color) 5%, transparent) 1px, transparent 1px);
    background-size: 44px 44px;
    mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, #000 30%, transparent 100%);
    -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, #000 30%, transparent 100%);
}

/*hero 容器：单列水平垂直居中（动画在上、文字在下）*/
.zibll-home-aurora .aurora-hero-in {
    display: flex;
    justify-content: center;
}
.zibll-home-aurora .aurora-hero-content {
    position: relative;
    max-width: 820px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}
/*眉标：主题色微染胶囊（主题色圆点 + 小字）*/
.zibll-home-aurora .aurora-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 16px;
    margin-bottom: 20px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: .05em;
    color: var(--theme-color);
    background: var(--muted-bg-color);
    background: color-mix(in srgb, var(--theme-color) 10%, transparent);
    border: 1px solid var(--main-border-color);
    border-color: color-mix(in srgb, var(--theme-color) 25%, transparent);
}
.zibll-home-aurora .aurora-eyebrow .dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--theme-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--theme-color) 20%, transparent);
}
.zibll-home-aurora .aurora-hero-title {
    margin: 0 0 14px;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: .5px;
    color: var(--main-color); /*回退：不支持 clip 时纯色*/
}
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
    /*渐变文字：主题色扫过主文本色；transparent 兜底防旧浏览器文字消失*/
    .zibll-home-aurora .aurora-hero-title {
        background: linear-gradient(120deg, var(--main-color) 30%, var(--theme-color));
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
    }
}
.zibll-home-aurora .aurora-hero-desc {
    margin: 0 0 32px;
    font-size: 16px;
    line-height: 1.9;
    color: var(--muted-2-color);
}
.zibll-home-aurora .aurora-hero-btns {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px;
}
.zibll-home-aurora .aurora-btn {
    display: inline-flex;
    align-items: center;
    padding: 12px 30px;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 600;
    transition: transform .2s, box-shadow .2s;
}
.zibll-home-aurora .aurora-btn:hover {
    transform: translateY(-2px);
}
.zibll-home-aurora .aurora-btn-main {
    color: #fff;
    background: var(--theme-color); /*回退行*/
    background: linear-gradient(120deg, var(--theme-color), color-mix(in srgb, var(--theme-color) 55%, #7c5cff));
    box-shadow: 0 10px 30px color-mix(in srgb, var(--theme-color) 40%, transparent);
}
.zibll-home-aurora .aurora-btn-ghost {
    color: var(--main-color);
    border: 1px solid var(--main-border-color);
    background: var(--main-bg-color);
    background: color-mix(in srgb, var(--main-bg-color) 60%, transparent);
}
.zibll-home-aurora .aurora-btn-ghost:hover {
    border-color: var(--theme-color);
    color: var(--theme-color);
}

/*==== hero 矢量动画（纯 SVG + CSS/SMIL，颜色随主题变量；容器统一宽度，居中）====*/
.zibll-home-aurora .aurora-orbit {
    width: min(100%, 380px);
    margin-bottom: 10px;
}
.zibll-home-aurora .aurora-orbit svg {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
}
/*--- 轨道环（vt-orbit）：三环交错倾斜，虚线流动，SMIL 流光点 ---*/
.zibll-home-aurora .vt-orbit .orb-ring {
    fill: none;
    stroke: var(--theme-color);
    stroke-width: 1.5;
    opacity: .38;
}
.zibll-home-aurora .vt-orbit .orb-ring.r2 { opacity: .28; }
.zibll-home-aurora .vt-orbit .orb-ring.r3 { opacity: .2; }
.zibll-home-aurora .vt-orbit .orb-ring.dotted {
    stroke-dasharray: 3 10;
    animation: zb-orb-dash 26s linear infinite;
}
@keyframes zb-orb-dash {
    to { stroke-dashoffset: -780; }
}
.zibll-home-aurora .vt-orbit .orb-glow {
    filter: blur(2px);
}
.zibll-home-aurora .vt-orbit .orb-dot {
    fill: var(--theme-color);
    filter: drop-shadow(0 0 7px var(--theme-color));
}
/*--- 流动波线（vt-wave）：光段沿波形流动（pathLength=100 归一）+ 5 颗粒子用
     SMIL animateMotion 沿三条波线巡游（三轨不同速度/方向错相）＝波光与粒子双流 ---*/
.zibll-home-aurora .vt-wave .wave {
    fill: none;
    stroke: var(--theme-color);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-dasharray: 42 58; /*亮段42 + 空段58，offset 循环=光段沿波滑动*/
    opacity: .55;
}
.zibll-home-aurora .vt-wave .wave.w2 {
    stroke-width: 1.5;
    opacity: .35;
    animation-duration: 7.5s; /*错峰*/
    animation-delay: -2.5s;
}
.zibll-home-aurora .vt-wave .wave.w3 {
    stroke-width: 1;
    opacity: .22;
    animation-duration: 9.5s;
    animation-delay: -5s;
}
.zibll-home-aurora .vt-wave .wave {
    animation: zb-wave-flow 6s linear infinite;
}
@keyframes zb-wave-flow {
    to { stroke-dashoffset: -100; }
}
/*波线粒子：沿波巡游的小光点（SMIL 定位，CSS 只管样式；主粒度=大中小三档）*/
.zibll-home-aurora .vt-wave .wv-dot {
    fill: var(--theme-color);
    filter: drop-shadow(0 0 6px var(--theme-color));
}
.zibll-home-aurora .vt-wave .wv-dot.d2,
.zibll-home-aurora .vt-wave .wv-dot.d4 { opacity: .7; }
.zibll-home-aurora .vt-wave .wv-dot.d5 { opacity: .55; }
/*（脉冲雷达动画已删；zb-pulse keyframes 保留——祥云圆日光晕复用）*/
@keyframes zb-pulse {
    from { transform: scale(.45); opacity: .85; }
    to   { transform: scale(4.6); opacity: 0; }
}
/*--- 莲花绽放（vt-lotus，2026-09-19 重做）：**取消一切缩放**，改「逐瓣绕花心旋开」——
     含苞态每瓣在自身定位角上再多转 40°（朝相邻瓣收拢＝紧卷花苞），绽放时逐片转回 0°，
     于是 8 瓣依次旋开、层层叠叠；层间再错峰（外→中→内），整朵花由 .lt-bloom 缓慢自转
     配合。花瓣填充白色半透明渐变（蒂部主题色晕染→瓣身白晶→瓣尖淡出）＝晶莹层次分明。
     ⚠️ 定位旋转在 <g> 的 transform 属性上、动画旋转在 <path> 的 CSS transform 上——
     CSS transform 会覆盖属性变换，两者必须分元素（§11 教训）。
     外层虚线双圈已删，改为花心向外飘散的花粉粒子（.lt-pollen）。 ---*/
.zibll-home-aurora .vt-lotus .lt-bloom {
    transform-box: view-box;
    transform-origin: 260px 150px;
    animation: zb-lotus-turn 48s linear infinite;
}
@keyframes zb-lotus-turn {
    to { transform: rotate(360deg); }
}
/*逐瓣绽放：fill-box 的 50% 100% ＝ 花瓣根部（=花心 260,150），绕根旋转最稳*/
.zibll-home-aurora .vt-lotus .lt-petal {
    transform-box: fill-box;
    transform-origin: 50% 100%;
    animation-name: zb-lotus-bloom;
    animation-duration: 14s;
    animation-iteration-count: infinite;
}
@keyframes zb-lotus-bloom {
    0%, 10% {
        /*含苞＝每瓣转回自身定位角的反向（--lt-fold，逐瓣不同），8 瓣叠成一束*/
        transform: rotate(var(--lt-fold, 40deg));
        opacity: .5;
        animation-timing-function: cubic-bezier(.25, 1.32, .5, 1); /*带一点过冲的旋开*/
    }
    46% {
        transform: rotate(0deg);
        opacity: 1;
        animation-timing-function: ease-in-out;
    }
    72% {
        transform: rotate(0deg);
        opacity: 1;
        animation-timing-function: cubic-bezier(.5, 0, .75, .4);
    }
    96%, 100% {
        transform: rotate(var(--lt-fold, 40deg));
        opacity: .5;
    }
}
/*白晶花瓣：半透明白渐变填充（渐变随花瓣 rotate 同转，蒂→尖方向固定）+ 主题色细描边
  保轮廓清晰；三层填充浓度递进（defs 里 id 区分）=层次分明、层层透光*/
.zibll-home-aurora .vt-lotus .lt-petal {
    stroke: var(--theme-color);
    stroke-width: 1.1;
    stroke-linecap: round;
}
.zibll-home-aurora .vt-lotus .lt-outer .lt-petal { fill: url(#zb-lp-outer); opacity: .92; }
.zibll-home-aurora .vt-lotus .lt-mid   .lt-petal { fill: url(#zb-lp-mid); stroke-width: 1; }
.zibll-home-aurora .vt-lotus .lt-inner .lt-petal { fill: url(#zb-lp-inner); stroke-width: .9; }
/*光晕与花同呼吸（只走透明度，不缩放）*/
.zibll-home-aurora .vt-lotus .lt-glow {
    animation: zb-lotus-glow 14s ease-in-out infinite;
}
@keyframes zb-lotus-glow {
    0%, 8%    { opacity: .3; }
    45%       { opacity: 1; }
    72%       { opacity: .9; }
    92%, 100% { opacity: .3; }
}
/*蕊点：花冠展开后逐颗浮现，旋合前隐去*/
.zibll-home-aurora .vt-lotus .lt-stamen {
    fill: var(--theme-color);
    opacity: 0;
    animation: zb-lotus-stamen 14s ease-in-out infinite;
}
.zibll-home-aurora .vt-lotus .lt-stamen:nth-of-type(2n) { animation-delay: -13.5s; }
@keyframes zb-lotus-stamen {
    0%, 38% { opacity: 0; }
    50%     { opacity: .9; }
    62%     { opacity: .9; }
    78%, 100% { opacity: 0; }
}
.zibll-home-aurora .vt-lotus .lt-core {
    fill: var(--theme-color);
    filter: drop-shadow(0 0 8px var(--theme-color));
    animation: zb-lotus-core 14s ease-in-out infinite;
}
@keyframes zb-lotus-core {
    0%, 8%    { opacity: .55; }
    50%       { opacity: 1; }
    62%       { opacity: .95; }
    92%, 100% { opacity: .55; }
}
/*花粉粒子：12 颗沿各自方向自花心飘出渐隐（旋转组给方向，粒子只做位移+缩放+透明度）*/
.zibll-home-aurora .vt-lotus .lt-pollen {
    fill: #fff;
    opacity: 0;
    filter: drop-shadow(0 0 4px var(--theme-color));
    transform-box: fill-box;
    transform-origin: center;
    animation-name: zb-lotus-pollen;
    animation-timing-function: ease-out;
    animation-iteration-count: infinite;
}
@keyframes zb-lotus-pollen {
    0%   { transform: translate(0, 0) scale(.5); opacity: 0; }
    12%  { opacity: .95; }
    60%  { opacity: .55; }
    100% { transform: translate(0, -98px) scale(1); opacity: 0; }
}
/*--- 黑客帝国数字雨（vt-cyber，2026-09-19 二版）：竖排字符列以各自速度下落，
     每列两帧字符（f1/f2 字符集错开）半周期错相交叉淡入淡出＝文字不断「随机变」且柔和；
     每列 objectBoundingBox 纵向渐变＝亮头在下方拖出暗尾。已删人影与扫描线。
     ⚠️ 配色：雨身走 --main-color（浅色模式=深色、深色模式=亮色，天然适配深浅），
     亮头走 --theme-color；整组再压一档透明度——hero 里主体是标题，雨只当氛围 ---*/
.zibll-home-aurora .vt-cyber {
    opacity: .52; /*浅色模式：深灰雨身 + 主题色亮头，压到不抢标题*/
}
/*⚠️ 雨列要下落 560px（远超 280 的 viewBox），而父主题给 hero SVG 统一设了
   overflow:visible —— 不裁的话字符会画到框外、压住下方标题与按钮。
   但**不能只裁**：硬裁会把还亮着的字头齐边切断（用户实测反馈「文字雨硬消失」）。
   正解＝渐变 alpha 遮罩（透明遮罩、不铺任何颜色，只削透明度）：上下各留一段
   渐隐带，字进出都是自然淡出；overflow:hidden 退居兜底，收边全交给遮罩，
   所以看不到那条硬边。⚠️ 遮罩默认 mask-repeat:repeat，留着 overflow:hidden
   才能防止框外内容被重复的遮罩重新显形*/
.zibll-home-aurora .vt-cyber svg {
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to bottom,
        transparent 0%, #000 10%, #000 70%, transparent 99%);
    mask-image: linear-gradient(to bottom,
        transparent 0%, #000 10%, #000 70%, transparent 99%);
}
.dark-theme .zibll-home-aurora .vt-cyber {
    opacity: .74; /*深色模式底更暗，稍抬一档才看得清*/
}
.zibll-home-aurora .vt-cyber .mx-colg {
    animation-name: zb-mx-fall;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
.zibll-home-aurora .vt-cyber .mx-col {
    fill: url(#zb-mx-trail);
    /*中文文字源（心经/三字经/易经）：用中文优先的字族；列内靠 tspan 的 x/dy 定位，
       与字体等宽与否无关，不必强求等宽字体*/
    font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
    font-size: 14px;
    font-weight: 500;
    animation-name: zb-mx-blink;
    animation-duration: 3.4s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}
.zibll-home-aurora .vt-cyber .mx-col.f2 { animation-delay: -1.7s; } /*半周期错相＝两帧互补*/
.zibll-home-aurora .vt-cyber .mx-stop-t,
.zibll-home-aurora .vt-cyber .mx-stop-m { stop-color: var(--main-color); }
.zibll-home-aurora .vt-cyber .mx-stop-b { stop-color: var(--theme-color); }
@keyframes zb-mx-fall {
    from { transform: translateY(0); }
    to   { transform: translateY(560px); }
}
@keyframes zb-mx-blink {
    0%, 40%   { opacity: 1; }
    50%, 90%  { opacity: 0; }
    100%      { opacity: 1; }
}
.zibll-home-aurora .vt-cyber .mx-spark {
    fill: var(--theme-color);
    filter: drop-shadow(0 0 5px var(--theme-color));
    opacity: 0;
    animation-name: zb-mx-spark;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
@keyframes zb-mx-spark {
    0%   { transform: translateY(0); opacity: 0; }
    8%   { opacity: .8; }
    80%  { opacity: .45; }
    100% { transform: translateY(300px); opacity: 0; }
}

/*--- 水墨圆相（vt-ink，2026-09-19 重做）：按「宣纸上的墨」分五层——①淡墨铺底
     ②墨韵洇染（高斯模糊的浓墨背影）③主笔圆相（浓墨一笔、缺口沿环缓行=运笔不歇）
     ④飞白（两圈错位的干笔碎线反向缓行=笔锋摩擦）⑤墨点飞溅（浓淡虚实不一、各自呼吸）
     ＋墨韵扩散（三团淡墨自环内缓缓化开消隐）＋底部淡墨横笔。浓淡干湿齐备 ---*/
.zibll-home-aurora .vt-ink .ik-bleed {
    fill: none;
    stroke: currentColor;
    stroke-width: 14;
    stroke-linecap: round;
    opacity: .14;
}
/*墨body：纸面粗糙度（feTurbulence 位移）＝笔锋毛边，静态层只渲染一次，不吃帧*/
.zibll-home-aurora .vt-ink .ik-rough {
    fill: none;
    stroke: currentColor;
    stroke-width: 9;
    stroke-linecap: round;
    stroke-dasharray: 93 7;
    opacity: .3;
}
.zibll-home-aurora .vt-ink .ik-enso {
    fill: none;
    stroke: currentColor; /*回退行（缺少渐变定义时仍是墨色）*/
    stroke: url(#zb-ik-grade); /*浓淡不一＝墨量不均*/
    stroke-width: 7.5;
    stroke-linecap: round;
    stroke-dasharray: 84 16;
    opacity: .5;
    animation: zb-ink-flow 11s linear infinite;
}
@keyframes zb-ink-flow {
    to { stroke-dashoffset: -100; }
}
/*飞白：极细碎的短划（干笔擦过纸面的断续感），两圈半径错位、反向缓行*/
.zibll-home-aurora .vt-ink .ik-dry {
    fill: none;
    stroke: currentColor;
    stroke-linecap: butt;
    opacity: .3;
}
.zibll-home-aurora .vt-ink .ik-dry.d1 {
    stroke-width: 1.4;
    stroke-dasharray: 2 13;
    animation: zb-ink-dry 17s linear infinite;
}
.zibll-home-aurora .vt-ink .ik-dry.d2 {
    stroke-width: 1;
    stroke-dasharray: 1 19;
    opacity: .22;
    animation: zb-ink-dry 23s linear infinite reverse;
}
@keyframes zb-ink-dry {
    to { stroke-dashoffset: -100; }
}
/*墨点飞溅：浓淡（--ik-o）与虚实（.soft 走高斯）不一，各自呼吸*/
/*太极（阴阳鱼）：整体缓慢自转＝阴阳流转；一鱼填墨、一鱼只勾线留白（水墨靠留白立骨）*/
.zibll-home-aurora .vt-ink .tj-spin {
    transform-box: view-box;
    transform-origin: 260px 140px;
    animation: zb-tj-turn 64s linear infinite;
}
@keyframes zb-tj-turn {
    to { transform: rotate(360deg); }
}
.zibll-home-aurora .vt-ink .tj-fish {
    fill: currentColor;
    opacity: .42; /*淡墨，不压过外圈主笔*/
}
.zibll-home-aurora .vt-ink .tj-fish-line {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.4;
    opacity: .38;
}
.zibll-home-aurora .vt-ink .tj-eye {
    fill: none; /*墨鱼里的一眼挖空*/
    stroke: currentColor;
    stroke-width: 1.6;
    opacity: .55;
}
.zibll-home-aurora .vt-ink .tj-eye.alt {
    fill: currentColor; /*留白鱼里的一眼点墨*/
    stroke: none;
    opacity: .42;
}
/*随机泼墨：八组溅墨各自「落下→溅开→淡去」，错相循环（组内缩放，位置不动）*/
.zibll-home-aurora .vt-ink .ik-splash {
    transform-box: fill-box;
    transform-origin: center;
    opacity: 0;
    animation-name: zb-ink-splash;
    animation-timing-function: ease-out;
    animation-iteration-count: infinite;
}
.zibll-home-aurora .vt-ink .ik-splash-main {
    fill: currentColor;
    opacity: .42;
}
.zibll-home-aurora .vt-ink .ik-splash-drop {
    fill: currentColor;
    opacity: .3;
}
@keyframes zb-ink-splash {
    0%, 6%    { opacity: 0; transform: scale(.35); }
    16%       { opacity: .95; transform: scale(1.08); }
    26%       { opacity: .6; transform: scale(1); }
    64%       { opacity: .5; transform: scale(1); }
    90%, 100% { opacity: 0; transform: scale(.94); }
}
/*墨韵扩散：淡墨自环内向外化开（scale+透明度）*/
.zibll-home-aurora .vt-ink .ik-diffuse {
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    opacity: 0;
    transform-box: fill-box;
    transform-origin: center;
    animation: zb-ink-diffuse 18s ease-out infinite;
}
@keyframes zb-ink-diffuse {
    0%   { transform: scale(.55); opacity: 0; }
    18%  { opacity: .22; }
    100% { transform: scale(1.5); opacity: 0; }
}
/*reduced-motion：SMIL 无法经 CSS 暂停→隐藏流光点/波光/波纹，留静态骨架*/
@media (prefers-reduced-motion: reduce) {
    .zibll-home-aurora .vt-orbit .orb-dot,
    .zibll-home-aurora .vt-orbit .orb-glow,
    .zibll-home-aurora .vt-wave .wv-dot {
        display: none;
    }
    .zibll-home-aurora .vt-orbit .orb-ring.dotted,
    .zibll-home-aurora .vt-wave .wave {
        animation: none;
    }
    .zibll-home-aurora .vt-wave .wave {
        stroke-dasharray: none;
        opacity: .4;
    }
    /*莲花：停在绽放态（花瓣无动画即 rotate(0)＝全开），粒子/光晕/蕊点停静态 */
    .zibll-home-aurora .vt-lotus .lt-bloom,
    .zibll-home-aurora .vt-lotus .lt-petal,
    .zibll-home-aurora .vt-lotus .lt-glow,
    .zibll-home-aurora .vt-lotus .lt-stamen,
    .zibll-home-aurora .vt-lotus .lt-core {
        animation: none;
    }
    .zibll-home-aurora .vt-lotus .lt-stamen { opacity: .7; }
    .zibll-home-aurora .vt-lotus .lt-pollen { display: none; }
    /*黑客帝国：字符列停帧（两帧字符取第一帧、停在起始位＝错落的静态雨幕），亮点隐去 */
    .zibll-home-aurora .vt-cyber .mx-colg,
    .zibll-home-aurora .vt-cyber .mx-col,
    .zibll-home-aurora .vt-cyber .mx-spark {
        animation: none;
    }
    .zibll-home-aurora .vt-cyber .mx-col.f2,
    .zibll-home-aurora .vt-cyber .mx-spark {
        display: none;
    }
    /*水墨：停笔留形（太极/圆相/飞白都在，只是不再流转；泼墨停成静态溅点）*/
    .zibll-home-aurora .vt-ink .tj-spin,
    .zibll-home-aurora .vt-ink .ik-enso,
    .zibll-home-aurora .vt-ink .ik-dry {
        animation: none;
    }
    .zibll-home-aurora .vt-ink .ik-splash {
        animation: none;
        opacity: .5;
    }
    .zibll-home-aurora .vt-ink .ik-diffuse {
        display: none;
    }
}

/*==== hero 背景样式（blob 彩色光斑 / aurora 极光带 / plain 纯净）====
   两模式区分：极光带=单色顶部大渐变光带+细网格纹理（保持原样）；彩色光斑=无网格、
   四色高饱和巨型光斑漂浮（2026-09-13 改：曾与极光带同样叠网格纹理，视觉无差别）*/
.zibll-home-aurora .bg-plain .aurora-bg {
    display: none;
}
.zibll-home-aurora .bg-aurora .aurora-blob {
    display: none;
}
.zibll-home-aurora .bg-blob .aurora-band,
.zibll-home-aurora .bg-blob .aurora-grid-mask {
    display: none;
}
/*星野微光：中心主题色柔光晕 + 两层错相呼吸的星点。⚠️浅色模式曾「看不到效果」——
  纯 1~2px 小点在浅底上对比不足、且呼吸下限 .35 一度淡到不可见；现大点带光晕头
  （14px 外圈+2.6px 实心核）、小点加量加大、呼吸下限提到 .6、光晕提到 22%。
  配色策略=主文本色（浅深两模式都是「深色/亮色」对比主力）+ 主题色/固定点缀色
  混排；纯 radial-gradient 星点零位图，opacity 呼吸走合成层，性能极轻*/
.zibll-home-aurora .aurora-stars {
    position: absolute;
    inset: 0;
    display: none;
}
.zibll-home-aurora .aurora-stars i {
    position: absolute;
    inset: 0;
}
.zibll-home-aurora .bg-stars .aurora-blob,
.zibll-home-aurora .bg-stars .aurora-band,
.zibll-home-aurora .bg-stars .aurora-grid-mask {
    display: none;
}
.zibll-home-aurora .bg-stars .aurora-stars {
    display: block;
}
/*头星：大点带光晕头，主题色/点缀色混排*/
.zibll-home-aurora .aurora-stars .st-head {
    background-image:
        radial-gradient(52% 46% at 50% 38%,
            color-mix(in srgb, var(--theme-color) 22%, transparent),
            transparent 72%),
        radial-gradient(16px 16px at 18% 30%, color-mix(in srgb, var(--theme-color) 16%, transparent), transparent 70%),
        radial-gradient(2.8px 2.8px at 18% 30%, var(--theme-color), transparent 99%),
        radial-gradient(15px 15px at 76% 20%, color-mix(in srgb, #7c5cff 16%, transparent), transparent 70%),
        radial-gradient(2.6px 2.6px at 76% 20%, #7c5cff, transparent 99%),
        radial-gradient(16px 16px at 88% 58%, color-mix(in srgb, var(--theme-color) 14%, transparent), transparent 70%),
        radial-gradient(3px 3px at 88% 58%, var(--theme-color), transparent 99%),
        radial-gradient(14px 14px at 34% 70%, color-mix(in srgb, #20c8d8 14%, transparent), transparent 70%),
        radial-gradient(2.6px 2.6px at 34% 70%, #20c8d8, transparent 99%),
        radial-gradient(15px 15px at 60% 14%, color-mix(in srgb, var(--theme-color) 14%, transparent), transparent 70%),
        radial-gradient(2.8px 2.8px at 60% 14%, var(--theme-color), transparent 99%);
    animation: zb-stars-breathe 5.2s ease-in-out infinite alternate;
}
/*细星：主文本色小点（浅底=深点、深底=亮点，对比永远在线），数量加密*/
.zibll-home-aurora .aurora-stars .st-dust {
    background-image:
        radial-gradient(1.8px 1.8px at 12% 14%, var(--main-color), transparent 99%),
        radial-gradient(1.6px 1.6px at 27% 47%, var(--main-color), transparent 99%),
        radial-gradient(1.9px 1.9px at 41% 22%, var(--main-color), transparent 99%),
        radial-gradient(1.6px 1.6px at 52% 62%, var(--main-color), transparent 99%),
        radial-gradient(1.8px 1.8px at 66% 38%, var(--main-color), transparent 99%),
        radial-gradient(1.6px 1.6px at 71% 74%, var(--main-color), transparent 99%),
        radial-gradient(1.9px 1.9px at 84% 30%, var(--main-color), transparent 99%),
        radial-gradient(1.6px 1.6px at 93% 76%, var(--main-color), transparent 99%),
        radial-gradient(1.7px 1.7px at 16% 84%, var(--main-color), transparent 99%),
        radial-gradient(1.6px 1.6px at 46% 88%, var(--main-color), transparent 99%),
        radial-gradient(1.7px 1.7px at 6% 52%, var(--main-color), transparent 99%),
        radial-gradient(1.6px 1.6px at 33% 8%, var(--main-color), transparent 99%),
        radial-gradient(1.7px 1.7px at 57% 45%, var(--main-color), transparent 99%),
        radial-gradient(1.6px 1.6px at 79% 8%, var(--main-color), transparent 99%),
        radial-gradient(1.7px 1.7px at 95% 24%, var(--main-color), transparent 99%);
    animation: zb-stars-breathe 6.8s ease-in-out -3.4s infinite alternate;
}
@keyframes zb-stars-breathe {
    from { opacity: .6; }
    to   { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
    .zibll-home-aurora .aurora-stars .st-head,
    .zibll-home-aurora .aurora-stars .st-dust {
        animation: none;
        opacity: .9;
    }
}
/*==== AI 科幻 / 水墨国风：两款意向化背景（2026-09-15 多轮定稿；草地轻风已删——
   大色块被斥不高级、逐根草未达印象派预期）。共同纪律：不用大面积色块铺底、
   不加水平线/水平光带（干扰内容）；一切颜色走主题色/主文本色/页面底色的
   color-mix（前给回退行）→ 深浅色自动翻转；动画只用 transform/opacity/背景位移。====*/
.zibll-home-aurora .aurora-cyber,
.zibll-home-aurora .aurora-ink {
    position: absolute;
    inset: 0;
    display: none;
}
/*新模式互斥隐藏：其余装饰层全部让位*/
.zibll-home-aurora .bg-cyber .aurora-blob,
.zibll-home-aurora .bg-cyber .aurora-band,
.zibll-home-aurora .bg-cyber .aurora-grid-mask,
.zibll-home-aurora .bg-cyber .aurora-stars,
.zibll-home-aurora .bg-cyber .aurora-ink,
.zibll-home-aurora .bg-ink .aurora-blob,
.zibll-home-aurora .bg-ink .aurora-band,
.zibll-home-aurora .bg-ink .aurora-grid-mask,
.zibll-home-aurora .bg-ink .aurora-stars,
.zibll-home-aurora .bg-ink .aurora-cyber {
    display: none;
}
.zibll-home-aurora .bg-cyber .aurora-cyber { display: block; }
.zibll-home-aurora .bg-ink .aurora-ink { display: block; }

/*--- AI 科幻：弱透视地面网格 + 0/1 数据矩阵雨 + 漂浮公式 =「智能在运算」。
   ⚠️无水平线元素（用户两轮否决：扫描带大面积扫光、地平线横线均干扰内容阅读）---*/
.zibll-home-aurora .aurora-cyber > i { position: absolute; }
/*地面透视网格（弱存在感，只作地平线舞台）*/
.zibll-home-aurora .cyber-grid {
    left: -70%;
    right: -70%;
    bottom: -2%;
    height: 46%;
    background-image:
        linear-gradient(90deg, var(--theme-color) 1px, transparent 1px),
        linear-gradient(0deg, var(--theme-color) 1px, transparent 1px);
    background-size: 46px 46px;
    transform: perspective(340px) rotateX(63deg);
    transform-origin: bottom center;
    opacity: .1;
    -webkit-mask-image: linear-gradient(to top, #000 6%, transparent 82%);
    mask-image: linear-gradient(to top, #000 6%, transparent 82%);
    animation: zb-cyber-flow 6s linear infinite;
}
@keyframes zb-cyber-flow {
    from { background-position: 0 0, 0 0; }
    to   { background-position: 0 0, 0 46px; }
}
/*数据矩阵雨：竖排 0/1 字符列自上方坠落（白噪声式确定性布列），上下缘渐隐*/
.zibll-home-aurora .cyber-matrix {
    position: absolute;
    inset: 0;
    font-family: ui-monospace, 'Courier New', Consolas, monospace;
    -webkit-mask-image: linear-gradient(to bottom, transparent, #000 16%, #000 74%, transparent);
    mask-image: linear-gradient(to bottom, transparent, #000 16%, #000 74%, transparent);
}
.zibll-home-aurora .cm {
    position: absolute;
    top: 0;
    white-space: pre;
    font-size: 13px;
    line-height: 1.5;
    letter-spacing: .1em;
    color: var(--theme-color);
    opacity: .16;
    will-change: transform;
    animation: zb-matrix-fall var(--s) linear var(--dl) infinite;
}
.zibll-home-aurora .cm:nth-child(2n) { opacity: .1; font-size: 11px; }
@keyframes zb-matrix-fall {
    from { transform: translateY(-72%); }
    to   { transform: translateY(120%); }
}
/*公式浮字：散落的经典方程缓慢漂移，像演算悬在思维空气里*/
.zibll-home-aurora .cyber-eq { position: absolute; inset: 0; }
.zibll-home-aurora .ce {
    position: absolute;
    font-family: 'Times New Roman', Georgia, serif;
    font-style: italic;
    font-size: 14px;
    letter-spacing: .04em;
    color: var(--main-color);
    opacity: .1;
    white-space: nowrap;
    animation: zb-eq-float var(--s) ease-in-out var(--dl) infinite alternate;
}
@keyframes zb-eq-float {
    from { transform: translate3d(0, 0, 0); opacity: .06; }
    to   { transform: translate3d(14px, -18px, 0); opacity: .14; }
}
/*--- 水墨国风（2026-09-19 重做）：与「水墨太极」矢量同源的一套笔墨语言。
   ① 宣纸颗粒（data-URI 噪声平铺，一次栅格化后平铺，不是每帧滤镜）
   ② 四重远山：山体不是平涂，而是「岭线浓 → 向下渐隐」的墨韵渐变＝留白；
      四层浓度递进＝空气透视（远山淡、近山浓）
   ③ 每层山脊另铺一道极淡的笔锋线（blur 1.1px 化开，不是矢量硬边）
   ④ 近山掺主题色成黛青，呼应太极的主题色墨
   ⑤ 山间流雾用「页面底色渐变」把山擦掉一截＝云带（深浅色自动翻转）
   ⑥ 三团泼墨自纸面洇开淡去
   ⚠️ 墨色统一走 var(--main-color)：浅底=淡墨黛山、深底=映白远峰，自动适配；
      山脊一律平滑贝塞尔（禁尖折 polygon＝粗糙元凶）；无月无鸟无印章（克制） ---*/
.zibll-home-aurora .ink-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}
/*宣纸颗粒：feTurbulence 噪声转灰度后平铺；stitchTiles=无缝接边。
  强度靠外层 opacity 压到「似有似无」，绝不与正文抢对比*/
.zibll-home-aurora .ink-paper {
    position: absolute;
    inset: 0;
    opacity: .12;
    background-repeat: repeat;
    background-size: 180px 180px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
    pointer-events: none;
}
/*泼墨（静态溅墨，随山体一起过毛边滤镜＝甩在纸上的墨渍）：主墨块淡、卫星点浓
 （真实的甩墨正是「大块淡、小点浓」）*/
.zibll-home-aurora .ink-sp-main { fill: var(--main-color); opacity: .13; }
.zibll-home-aurora .ink-sp-sat  { fill: var(--main-color); opacity: .26; }
.zibll-home-aurora .ink-dp-a { stop-color: var(--main-color); stop-opacity: .5; }
.zibll-home-aurora .ink-dp-b { stop-color: var(--main-color); stop-opacity: 0; }
.zibll-home-aurora .ink-drop {
    transform-box: fill-box;
    transform-origin: center;
    opacity: 0;
    animation: zb-ink-bloom 31s ease-out infinite;
}
.zibll-home-aurora .ink-drop.d2 { animation-duration: 37s; animation-delay: -13s; }
.zibll-home-aurora .ink-drop.d3 { animation-duration: 43s; animation-delay: -26s; }
/*深色模式**单独设计**（不是把变量翻过来就算适配）：
  ① 深底上的「宣纸颗粒」会发灰发脏 → 压到近无
  ② 墨若直接用 --main-color（近白）**明度太高**，在深底上又跳又飘、显得突兀
     → 掺页面底色压成冷灰蓝（月色下的墨），再靠透明度找回存在感
  ③ 泼墨与洇开同步压低：深色模式下高亮元素一多就乱，统一压低才安静*/
.dark-theme .zibll-home-aurora .ink-paper { opacity: .03; }
.dark-theme .zibll-home-aurora .ink-sp-main,
.dark-theme .zibll-home-aurora .ink-sp-sat {
    fill: var(--main-color);
    fill: color-mix(in srgb, var(--main-color) 34%, var(--main-bg-color));
}
.dark-theme .zibll-home-aurora .ink-sp-main { opacity: .3; }
.dark-theme .zibll-home-aurora .ink-sp-sat  { opacity: .42; }
.dark-theme .zibll-home-aurora .ink-dp-a {
    stop-color: var(--main-color);
    stop-color: color-mix(in srgb, var(--main-color) 34%, var(--main-bg-color));
    stop-opacity: .5;
}
@keyframes zb-ink-bloom {
    0%, 4%    { transform: scale(.35); opacity: 0; }
    16%       { transform: scale(.85); opacity: .5; }
    42%       { transform: scale(1.15); opacity: .26; }
    68%, 100% { transform: scale(1.5); opacity: 0; }
}
/*reduced-motion：两款背景动效全停（静态构图保留）*/
@media (prefers-reduced-motion: reduce) {
    .zibll-home-aurora .cyber-grid,
    .zibll-home-aurora .cm,
    .zibll-home-aurora .ce,
    .zibll-home-aurora .ink-drop {
        animation: none;
    }
    .zibll-home-aurora .ink-drop { opacity: .32; }
}
/*极光带：顶部大面积主题色渐变光带，缓慢摆动呼吸。
  ⚠️渐变焦点必须落在 hero 可视区内（曾放 50% 0% 且条带 top 为负——焦点被
  overflow:hidden 裁掉，只剩淡尾，表现为「切换背景无效」）*/
.zibll-home-aurora .aurora-band {
    position: absolute;
    left: -10%;
    right: -10%;
    top: -6%;
    height: 74%;
    transform-origin: top center;
    background: var(--theme-color);
    background: radial-gradient(62% 88% at 50% 22%,
        color-mix(in srgb, var(--theme-color) 52%, transparent),
        color-mix(in srgb, var(--theme-color) 18%, transparent) 58%,
        transparent 82%);
    filter: blur(34px);
    animation: zb-band-sway 11s ease-in-out infinite alternate;
}
@keyframes zb-band-sway {
    from { transform: translateX(-2.5%) scaleY(1); }
    to   { transform: translateX(2.5%) scaleY(1.12); }
}

/*==== 异形底部（自然渐隐过渡带）：⚠️教训——绝不能用色块「盖」hero 背景做过渡
   （实色=硬裁、渐变=异色带，光斑背景下一律露馅生硬）。正确做法=背景层 .aurora-bg
   挂「遮罩渐隐」：内联 SVG data-URI（--zsh-shape-mask，白=保留黑=擦除的亮度遮罩，
   SVG 内部用 <mask> 转成真 alpha 以便 CSS 多层掩码兼容）把 hero 背景沿波浪曲线
   擦到透明——曲线以下不再是「换了一层颜色」而是背景自身淡出，直边底缘一并吞掉，
   无论光斑/极光带/星野/纯净什么背景都不可能有生硬换色，与下方区块自然衔接。
   遮罩两图层叠加：实色层盖住 hero 主体 + 曲线羽化层挂底部 --zsh-shape-h 高
   （viewBox 100 单位，y75≈hero 底缘：峰在缘上、谷垂入下探舌形区，羽化坡约 40% 带宽
   =柔和边界）。背景层同步下探 25% 带高供舌形淡出。
   动效（shape-anim）：data-URI 遮罩无法逐帧换形，波动观感由描边/扫描线 d 形变承担
   （柔化坡远大于摆幅，边界不动而光带游动，读起来正是「水面呼吸」）。
   微光（shape-glow）：极淡轨道线 + 两端渐隐的彩色光斑沿曲线扫描（SMIL 平移渐变窗）。
   深浅色全走变量自动翻转 ====*/
.zibll-home-aurora .zibll-home-hero {
    --zsh-shape-h: var(--zsh-shape-h-set, 120px); /*过渡带高度（设置内联覆写 --zsh-shape-h-set）*/
    --zsh-shape-bleed: calc(var(--zsh-shape-h) * 0.25); /*背景层下探深度（遮罩 y75 与 hero 底缘对齐的关键比例）*/
}
.zibll-home-aurora .zibll-home-hero.shape-on {
    overflow: visible; /*让背景层下探与带体越过 hero 直边*/
}
.zibll-home-aurora .shape-on .aurora-bg {
    bottom: calc(-1 * var(--zsh-shape-bleed)); /*背景层下探（光斑舌形区）*/
    overflow: hidden; /*光斑裁切下沉到本层（原靠 hero overflow:hidden）*/
}
.zibll-home-aurora .shape-on .aurora-bg {
    -webkit-mask-image: linear-gradient(#000 0 0), var(--zsh-shape-mask);
    mask-image: linear-gradient(#000 0 0), var(--zsh-shape-mask);
    -webkit-mask-size: 100% calc(100% - var(--zsh-shape-h) + 2px), 100% var(--zsh-shape-h);
    mask-size: 100% calc(100% - var(--zsh-shape-h) + 2px), 100% var(--zsh-shape-h);
    -webkit-mask-position: 0 0, 0 100%;
    mask-position: 0 0, 0 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}
.zibll-home-aurora .aurora-shape {
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(-1 * var(--zsh-shape-bleed) - 1px); /*与背景层下探区同幅，描边/扫描线正骑在渐隐边界上*/
    height: var(--zsh-shape-h);
    pointer-events: none;
    z-index: 3;
}
.zibll-home-aurora .aurora-shape svg {
    position: absolute;
    inset: 0; /*双 svg 重叠摆放（正常流会上下堆叠）*/
    width: 100%;
    height: 100%;
}
/*微光描边（默认关）：常显极淡主题色轨道线，作扫描亮线的底衬*/
.zibll-home-aurora .shape-main .shape-edge {
    display: none;
}
.zibll-home-aurora .shape-glow .shape-main .shape-edge {
    display: block;
    fill: none;
    stroke: var(--theme-color);
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
    opacity: .01;
}
/*扫描亮线=沿曲线移动、两端渐隐的彩色光斑（渐变窗由 defs 的 animateTransform 平移，
  两端 stop-opacity=0 天然淡入淡出）。stop 色走 CSS 变量随深浅色翻转*/
.zibll-home-aurora .zb-sc-a { stop-color: var(--theme-color); stop-opacity: 0; }
.zibll-home-aurora .zb-sc-b { stop-color: #50a5ea; stop-opacity: 0.85; }
.zibll-home-aurora .zb-sc-c { stop-color: var(--theme-color); stop-opacity: 0; }
.zibll-home-aurora .shape-main .shape-scan {
    display: none;
}
.zibll-home-aurora .shape-glow .shape-main .shape-scan {
    display: block;
    fill: none;
    stroke: url(#zb-scan-grad);
    stroke-width: 1.6;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
}
/*动效：描边/扫描线沿曲线 d 形变（背景渐隐边界由 data-URI 遮罩固定，摆幅在柔化坡内不可见）
  ⚠️.shape-wave 等用 :where() 归零权重，使 reduced-motion 的 .shape-anim(0,2,0) 能压过本组并靠后者胜出*/
.zibll-home-aurora .shape-anim:where(.shape-wave)   .shape-edge,
.zibll-home-aurora .shape-anim:where(.shape-wave)   .shape-scan { animation: zb-shape-edge-wave 16s ease-in-out infinite alternate; }
.zibll-home-aurora .shape-anim:where(.shape-curve)  .shape-edge,
.zibll-home-aurora .shape-anim:where(.shape-curve)  .shape-scan { animation: zb-shape-edge-curve 14s ease-in-out infinite alternate; }
.zibll-home-aurora .shape-anim:where(.shape-angle)  .shape-edge,
.zibll-home-aurora .shape-anim:where(.shape-angle)  .shape-scan { animation: zb-shape-edge-angle 12s ease-in-out infinite alternate; }
@keyframes zb-shape-edge-wave {
    from { d: path("M0,70 C 120,42 260,96 420,64 C 580,38 700,98 880,70 C 1060,44 1180,94 1440,60"); }
    to   { d: path("M0,58 C 120,94 260,40 420,74 C 580,98 700,36 880,62 C 1060,96 1180,32 1440,78"); }
}
@keyframes zb-shape-edge-curve {
    from { d: path("M0,95 Q 720,40 1440,95"); }
    to   { d: path("M0,86 Q 720,62 1440,86"); }
}
@keyframes zb-shape-edge-angle {
    from { d: path("M0,92 L 1440,48"); }
    to   { d: path("M0,66 L 1440,86"); }
}
/*reduced-motion：描边/扫描线动效全停（data-URI 遮罩本就静态）；扫描光斑隐藏*/
@media (prefers-reduced-motion: reduce) {
    .zibll-home-aurora .shape-anim .shape-edge,
    .zibll-home-aurora .shape-anim .shape-scan,
    .zibll-home-aurora .shape-glow .shape-main .shape-scan {
        animation: none;
    }
    .zibll-home-aurora .shape-glow .shape-main .shape-scan {
        display: none;
    }
}
/*内容避让：渐隐带峰部高出底缘约 .3 带高（柔化坡再往上一点）——内容区留出底边距，
  按钮与下滑箭头均入流排布，不压进渐隐区*/
.zibll-home-aurora .aurora-hero-in {
    position: relative;
    z-index: 2;
}
.zibll-home-aurora .zibll-home-hero.shape-on .aurora-hero-in {
    padding-bottom: calc(var(--zsh-shape-h) * .42);
}

/*下滑指示：按钮下方入流（间距 ≥20px），呼吸动画箭头*/
.zibll-home-aurora .aurora-scroll {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin: 24px auto 0;
    border-radius: 50%;
    font-size: 16px;
    color: var(--muted-2-color);
    border: 1px solid var(--main-border-color);
    animation: zb-aurora-scroll 2.2s ease-in-out infinite;
}
@keyframes zb-aurora-scroll {
    0%, 100% { transform: translateY(0); opacity: .6; }
    50%      { transform: translateY(7px); opacity: 1; }
}

/*==== 文章卡：主题色发光悬浮（覆写 base 默认外观）====*/
.zibll-home-aurora .zibll-home-post-card {
    border: 1px solid var(--main-border-color);
    border-color: color-mix(in srgb, var(--main-border-color) 60%, transparent);
}
.zibll-home-aurora .zibll-home-post-card:hover {
    box-shadow: 0 14px 40px color-mix(in srgb, var(--theme-color) 18%, transparent);
    border-color: color-mix(in srgb, var(--theme-color) 45%, transparent);
}
.zibll-home-aurora .zibll-home-post-card .card-title {
    transition: color .2s;
}
.zibll-home-aurora .zibll-home-post-card:hover .card-title {
    color: var(--theme-color);
}
.zibll-home-aurora .zibll-home-post-card .card-more {
    color: var(--theme-color);
}

/*==== 分类导航卡：封面图卡（无图=图标占位）+ 名称 + 描述 + 计数徽标 ====*/
.zibll-home-aurora .aurora-cats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.zibll-home-aurora .aurora-cat-card {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 12px 12px 14px;
    border-radius: var(--zsh-radius, var(--main-radius));
    overflow: hidden;
    background: var(--muted-bg-color);
    border: 1px solid var(--main-border-color);
    border-color: color-mix(in srgb, var(--main-border-color) 55%, transparent);
    transition: transform .25s, border-color .25s, box-shadow .25s;
}
.zibll-home-aurora .aurora-cat-card:hover {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--theme-color) 45%, transparent);
    box-shadow: 0 12px 32px color-mix(in srgb, var(--theme-color) 15%, transparent);
}
/*封面：约 21:9 横幅；无图=主题色微染图标位；hover 图片微放大*/
.zibll-home-aurora .aurora-cat-card .cat-cover {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 21 / 9;
    border-radius: calc(var(--zsh-radius, var(--main-radius)) - 4px);
    overflow: hidden;
    background: var(--theme-color);
    background: linear-gradient(135deg, color-mix(in srgb, var(--theme-color) 20%, var(--muted-bg-color)), color-mix(in srgb, var(--theme-color) 8%, var(--muted-bg-color)));
}
.zibll-home-aurora .aurora-cat-card .cat-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .45s;
}
.zibll-home-aurora .aurora-cat-card:hover .cat-cover img {
    transform: scale(1.06);
}
.zibll-home-aurora .aurora-cat-card .cat-cover .fa {
    font-size: 30px;
    color: var(--theme-color);
    background: var(--theme-color);
    background: color-mix(in srgb, var(--theme-color) 14%, transparent);
    padding: 20px;
    border-radius: 50%;
}
/*计数徽标：右上角深色半透明胶囊（有图/无图均可读）*/
.zibll-home-aurora .aurora-cat-card .cat-count {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 1;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    color: #fff;
    background: rgba(0, 0, 0, .45);
    text-shadow: 0 1px 2px rgba(0, 0, 0, .3);
}
/*文字区：名称 + 描述两行截断*/
.zibll-home-aurora .aurora-cat-card .cat-txt {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 12px 4px 0;
    min-width: 0;
}
.zibll-home-aurora .aurora-cat-card .cat-name {
    font-size: 16px;
    font-weight: 600;
    color: var(--main-color);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: color .2s;
}
.zibll-home-aurora .aurora-cat-card:hover .cat-name {
    color: var(--theme-color);
}
.zibll-home-aurora .aurora-cat-card .cat-desc {
    font-size: 12px;
    line-height: 1.6;
    color: var(--muted-2-color);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/*==== 响应式 ====*/
@media (max-width: 992px) {
    .zibll-home-aurora .aurora-cats {
        grid-template-columns: repeat(2, 1fr);
    }
    .zibll-home-aurora .aurora-orbit {
        width: min(100%, 320px);
    }
}
@media (max-width: 768px) {
    .zibll-home-aurora .zibll-home-hero {
        min-height: 0;
        padding: var(--zsh-pt, 52px) 0 var(--zsh-pb, 0);
    }
    /*异形底部收窄：窄屏曲线过高压不住（用户设置值仍为上限）*/
    .zibll-home-aurora .zibll-home-hero {
        --zsh-shape-h: min(22px, var(--zsh-shape-h-set, 22px));
    }
    .zibll-home-aurora .aurora-orbit {
        width: min(100%, 240px);
        margin-bottom: -6px;
    }
    .zibll-home-aurora .aurora-hero-title {
        font-size: 30px;
    }
    .zibll-home-aurora .aurora-hero-desc {
        font-size: 14px;
    }
    .zibll-home-aurora .aurora-blob {
        filter: blur(48px);
        opacity: .35;
    }
    .zibll-home-aurora .aurora-band {
        filter: blur(26px);
    }
}
@media (max-width: 560px) {
    .zibll-home-aurora .aurora-cats {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .zibll-home-aurora .aurora-scroll {
        display: none;
    }
}

/*尊重系统减弱动效设置*/
@media (prefers-reduced-motion: reduce) {
    .zibll-home-aurora .aurora-blob {
        animation: none;
    }
}