/* ============================================
   战斗界面视差滚动效果
   灵黎朽歌 - 𝕿𝖍𝖊 𝕴𝖒𝖒𝖔𝖗𝖙𝖆𝖑 𝕾𝖔𝖓𝖌 𝖔𝖋 𝕾𝖔𝖚𝖑’𝖘 𝕯𝖆𝖜𝖓
   ============================================ */

/* 游戏界面保持默认光标 */

/* 视差背景容器 */
.parallax-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;
}

/* 视差层 - 背景层（最慢） - 唯一使用真实图片的层 */
.parallax-layer-bg {
    position: absolute;
    top: -5%;
    left: -5%;
    width: 110%;
    height: 110%;
    background-image: url('/images/zhando.jpg');
    background-size: cover;
    background-position: center;
    filter: brightness(0.7) contrast(1.1);
    transition: transform 0.3s ease-out;
    will-change: transform;
}

/* 视差层 - 中景层（中速） - 暗色渐变叠加，模拟雾气和深度 */
.parallax-layer-mid {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: 
        radial-gradient(ellipse at 30% 40%, rgba(0, 0, 0, 0.2) 0%, transparent 50%),
        radial-gradient(ellipse at 70% 60%, rgba(0, 0, 0, 0.3) 0%, transparent 50%),
        linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.4) 100%);
    transition: transform 0.2s ease-out;
    will-change: transform;
}

/* 视差层 - 前景装饰（最快） - 金色粒子和光效 */
.parallax-layer-fg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: 
        radial-gradient(circle at 20% 30%, rgba(212, 175, 55, 0.15) 0%, transparent 3%),
        radial-gradient(circle at 80% 70%, rgba(212, 175, 55, 0.1) 0%, transparent 2%),
        radial-gradient(circle at 50% 50%, rgba(212, 175, 55, 0.12) 0%, transparent 2.5%),
        radial-gradient(circle at 90% 20%, rgba(212, 175, 55, 0.08) 0%, transparent 2%);
    background-size: 100% 100%;
    transition: transform 0.15s ease-out;
    will-change: transform;
    opacity: 0.6;
    animation: shimmer 8s ease-in-out infinite;
}

@keyframes shimmer {
    0%, 100% {
        opacity: 0.6;
    }
    50% {
        opacity: 0.8;
    }
}

/* 哥特装饰元素 */
.gothic-decoration {
    position: absolute;
    color: var(--accent-gold);
    font-size: 48px;
    opacity: 0.15;
    pointer-events: none;
    text-shadow: 0 0 20px var(--accent-gold);
    animation: float 6s ease-in-out infinite;
}

.gothic-decoration:nth-child(1) {
    top: 10%;
    left: 5%;
    animation-delay: 0s;
}

.gothic-decoration:nth-child(2) {
    top: 20%;
    right: 8%;
    animation-delay: 2s;
}

.gothic-decoration:nth-child(3) {
    bottom: 15%;
    left: 10%;
    animation-delay: 4s;
}

.gothic-decoration:nth-child(4) {
    bottom: 25%;
    right: 5%;
    animation-delay: 1s;
}

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

/* 移除所有不必要的鼠标跟随和光标效果 */

/* 性能优化 - 低性能模式 */
@media (prefers-reduced-motion: reduce) {
    .parallax-layer-bg,
    .parallax-layer-mid,
    .parallax-layer-fg,
    .parallax-content {
        transition: none !important;
        transform: none !important;
    }
    
    .gothic-decoration {
        animation: none !important;
    }
    
    .cursor-follower,
    .particles-container {
        display: none !important;
    }
}

/* 移动设备优化 */
@media (max-width: 768px) {
    .parallax-layer-bg {
        transform: none !important;
    }
    
    .cursor-follower,
    .particles-container {
        display: none;
    }
    
    .gothic-decoration {
        font-size: 32px;
    }
}