/* ============================================================
   NV-FX 全局动态背景层（solov 风格）
   流光光斑 + 漂移网格 + 呼吸辉光；纯 CSS，仅 transform/opacity
   用法：页面引入本文件，并在 <body> 起始处放置 .nv-bg-fx 标记
   ============================================================ */
.nv-bg-fx {
    position: fixed;
    inset: 0;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;
}
/* 流动光斑 */
.nv-bg-fx .nv-fx-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(64px);
    opacity: .5;
    animation: nvOrbFloat 18s ease-in-out infinite;
    will-change: transform;
}
.nv-bg-fx .nv-fx-orb-a {
    width: 480px; height: 480px; top: -160px; left: -120px;
    background: radial-gradient(circle at 32% 32%, rgba(20,184,166,.5), rgba(20,184,166,0) 70%);
}
.nv-bg-fx .nv-fx-orb-b {
    width: 430px; height: 430px; top: 26%; right: -150px;
    background: radial-gradient(circle at 60% 40%, rgba(14,165,233,.42), rgba(14,165,233,0) 70%);
    animation-duration: 23s;
    animation-delay: -7s;
}
.nv-bg-fx .nv-fx-orb-c {
    width: 380px; height: 380px; bottom: -150px; left: 28%;
    background: radial-gradient(circle at 50% 50%, rgba(139,92,246,.32), rgba(139,92,246,0) 70%);
    animation-duration: 27s;
    animation-delay: -13s;
}
@keyframes nvOrbFloat {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33%      { transform: translate(64px, -42px) scale(1.09); }
    66%      { transform: translate(-52px, 34px) scale(.93); }
}
/* 网格纹理（单格无缝平移漂移） */
.nv-bg-fx .nv-fx-grid {
    position: absolute;
    inset: -60px;
    background-image:
        linear-gradient(rgba(100, 116, 139, .08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(100, 116, 139, .08) 1px, transparent 1px);
    background-size: 46px 46px;
    -webkit-mask-image: radial-gradient(80% 62% at 50% 10%, #000 30%, transparent 100%);
    mask-image: radial-gradient(80% 62% at 50% 10%, #000 30%, transparent 100%);
    animation: nvGridPan 26s linear infinite;
    will-change: transform;
}
@keyframes nvGridPan {
    to { transform: translate(46px, 46px); }
}
/* 顶部呼吸辉光 */
.nv-bg-fx .nv-fx-glow {
    position: absolute;
    top: -180px; left: 50%;
    width: 640px; height: 340px;
    transform: translateX(-50%);
    background: radial-gradient(ellipse at center, rgba(99, 102, 241, .16), rgba(99, 102, 241, 0) 68%);
    animation: nvGlowBreathe 7s ease-in-out infinite;
    will-change: opacity, transform;
}
@keyframes nvGlowBreathe {
    0%, 100% { opacity: .55; transform: translateX(-50%) scale(1); }
    50%      { opacity: 1;   transform: translateX(-50%) scale(1.12); }
}
/* 暗色页面修饰符：光斑更亮、网格更淡 */
.nv-bg-fx.nv-fx-dark .nv-fx-orb { opacity: .62; }
.nv-bg-fx.nv-fx-dark .nv-fx-grid {
    background-image:
        linear-gradient(rgba(148, 163, 184, .06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(148, 163, 184, .06) 1px, transparent 1px);
}
/* 小屏降载 */
@media (max-width: 640px) {
    .nv-bg-fx .nv-fx-orb, .nv-bg-fx .nv-fx-glow { display: none; }
    .nv-bg-fx .nv-fx-grid { animation: none; }
}
/* 动效偏好 */
@media (prefers-reduced-motion: reduce) {
    .nv-bg-fx .nv-fx-orb, .nv-bg-fx .nv-fx-glow, .nv-bg-fx .nv-fx-grid { animation: none !important; }
}
