/* ============================================================
   Linear / Modern 设计令牌
   ============================================================ */

:root {
    /* ---- 颜色系统：深空背景 + 环境光 ---- */
    --bg-deep: #020203;
    --bg-base: #050506;
    --bg-elevated: #0a0a0c;
    --surface: rgba(255, 255, 255, 0.05);
    --surface-hover: rgba(255, 255, 255, 0.08);
    --foreground: #EDEDEF;
    --foreground-muted: #8A8F98;
    --foreground-subtle: rgba(255, 255, 255, 0.60);
    --accent: #5E6AD2;
    --accent-bright: #6872D9;
    --accent-glow: rgba(94, 106, 210, 0.3);
    --border-default: rgba(255, 255, 255, 0.06);
    --border-hover: rgba(255, 255, 255, 0.10);
    --border-accent: rgba(94, 106, 210, 0.30);

    /* ---- 字体 ---- */
    --font-sans: "Inter", "Geist Sans", system-ui, -apple-system, sans-serif;
    --font-mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;

    /* ---- 鼠标追踪坐标（由 JS 动态更新） ---- */
    --mouse-x: 50%;
    --mouse-y: 50%;

    /* ---- 缓动函数 ---- */
    --ease-expo-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-out: cubic-bezier(0, 0, 0.2, 1);


}

/* ---- 减少动画偏好 ---- */
@media (prefers-reduced-motion: reduce) {
    :root {
        --anim-duration-fast: 0ms;
        --anim-duration-normal: 0ms;
        --anim-duration-slow: 0ms;
    }
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    /* 保留首页标题 shimmer 光影流动效果 */
    .text-gradient-accent {
        animation: shimmer 4s linear infinite !important;
    }
}

/* ============================================================
   关键帧动画
   ============================================================ */

/* Blob 缓慢浮动 */
@keyframes float {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-20px) rotate(1deg); }
}

@keyframes float-reverse {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(20px) rotate(-1deg); }
}

@keyframes float-slow {
    0%, 100% { transform: translateY(0) translateX(0); }
    33% { transform: translateY(-15px) translateX(10px); }
    66% { transform: translateY(10px) translateX(-5px); }
}

/* 渐变文字 shimmer */
@keyframes shimmer {
    0% { background-position: 200% center; }
    100% { background-position: -200% center; }
}

/* 入场动画 */
@keyframes fade-up {
    from {
        opacity: 0;
        transform: translateY(24px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes scale-in {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* 脉冲呼吸 */
@keyframes pulse-glow {
    0%, 100% { opacity: 0.08; }
    50% { opacity: 0.15; }
}

/* 加载骨架屏 shimmer */
@keyframes skeleton {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* 故障文字动画 */
@keyframes glitch-anim-1 {
    0% { clip-path: inset(20% 0 80% 0); transform: translate(-2px, 0); }
    20% { clip-path: inset(60% 0 10% 0); transform: translate(2px, 0); }
    40% { clip-path: inset(40% 0 50% 0); transform: translate(-2px, 0); }
    60% { clip-path: inset(80% 0 5% 0); transform: translate(1px, 0); }
    80% { clip-path: inset(10% 0 70% 0); transform: translate(-1px, 0); }
    100% { clip-path: inset(30% 0 40% 0); transform: translate(0, 0); }
}

@keyframes glitch-anim-2 {
    0% { clip-path: inset(10% 0 60% 0); transform: translate(2px, 0); }
    20% { clip-path: inset(80% 0 5% 0); transform: translate(-1px, 0); }
    40% { clip-path: inset(30% 0 20% 0); transform: translate(1px, 0); }
    60% { clip-path: inset(15% 0 80% 0); transform: translate(-2px, 0); }
    80% { clip-path: inset(55% 0 10% 0); transform: translate(2px, 0); }
    100% { clip-path: inset(40% 0 30% 0); transform: translate(0, 0); }
}

/* 光标闪烁 */
@keyframes cursor-blink {
    0%, 100% { opacity: 0; }
    50% { opacity: 1; }
}

/* 极光色相漂移 */
@keyframes aurora-shift {
    0% { filter: hue-rotate(0deg) brightness(1); }
    50% { filter: hue-rotate(15deg) brightness(1.1); }
    100% { filter: hue-rotate(-10deg) brightness(0.95); }
}

/* 霓虹脉冲 */
@keyframes neon-pulse {
    0%, 100% { text-shadow: 0 0 5px var(--accent-glow), 0 0 10px var(--accent-glow); }
    50% { text-shadow: 0 0 15px var(--accent-glow), 0 0 30px var(--accent-glow), 0 0 45px rgba(94,106,210,0.3); }
}

/* 悬浮上升 */
@keyframes float-up {
    0% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
    100% { transform: translateY(0); }
}

/* 通用动画工具类 */
.anim-float {
    animation: float 10s ease-in-out infinite;
}
.anim-float-reverse {
    animation: float-reverse 12s ease-in-out infinite;
}
.anim-float-slow {
    animation: float-slow 15s ease-in-out infinite;
}
.anim-shimmer {
    background-size: 200% auto;
    animation: shimmer 4s linear infinite;
}
.anim-fade-up {
    animation: fade-up 0.6s var(--ease-expo-out) forwards;
    opacity: 0;
}
.anim-scale-in {
    animation: scale-in 0.5s var(--ease-expo-out) forwards;
    opacity: 0;
}
.anim-pulse-glow {
    animation: pulse-glow 4s ease-in-out infinite;
}

/* 滚动触发显现类（由 JS 添加） */
.reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.6s var(--ease-expo-out), transform 0.6s var(--ease-expo-out);
}
.reveal.revealed {
    opacity: 1;
    transform: translateY(0);
}
.reveal-delay-1 { transition-delay: 0.08s; }
.reveal-delay-2 { transition-delay: 0.16s; }
.reveal-delay-3 { transition-delay: 0.24s; }
.reveal-delay-4 { transition-delay: 0.32s; }
.reveal-delay-5 { transition-delay: 0.40s; }