/**
 * ========================================
 * 自定义光标样式表 (Custom Cursor Styles)
 * ========================================
 * 
 * 功能说明：
 * 1. 隐藏系统光标，显示自定义酒瓶光标
 * 2. 弹窗区域强制显示普通光标
 * 3. 酒瓶倒酒动画
 * 4. 粒子特效样式
 * 5. 统一返回按钮样式
 * 
 * 注意事项：
 * - 光标 z-index 设为最大值，确保始终可见
 * - 弹窗区域使用 !important 强制显示系统光标
 */

/* ================= 自定义光标样式表 (层级修复版) ================= */

/* ============ 1. 全局隐藏系统默认光标 ============ */
*, *::before, *::after {
    cursor: none !important;
}

body, html, a, button, input, textarea, select, label, div, span {
    cursor: none !important;
}

/* 2. 酒瓶光标容器 - 真实威士忌瓶造型 */
#custom-cursor {
    position: fixed;
    top: 0;
    left: 0;
    
    /* === 经典威士忌瓶身设计（宽肩方瓶）=== */
    width: 22px; 
    height: 40px;
    
    /* 瓶身：琥珀色液体在透明玻璃中 */
    background: 
        /* 左侧高光 - 玻璃反光 */
        linear-gradient(90deg, 
            rgba(255,255,255,0.6) 0%,
            rgba(255,255,255,0.15) 3px,
            transparent 4px
        ),
        /* 右侧暗部 - 玻璃厚度 */
        linear-gradient(90deg,
            transparent calc(100% - 3px),
            rgba(0,0,0,0.25) calc(100% - 2px),
            rgba(0,0,0,0.4) 100%
        ),
        /* 威士忌液体颜色 */
        linear-gradient(180deg, 
            #D4A574 0%,      /* 上部浅琥珀 */
            #C69C6D 25%,
            #B8860B 50%,     /* 中部深金色 */
            #9B7410 80%,
            #7A5C0F 100%     /* 底部深棕 */
        );
    
    /* 玻璃瓶边框 */
    border: 1px solid rgba(200,200,200,0.3);
    border-left-color: rgba(255,255,255,0.5);
    border-right-color: rgba(0,0,0,0.3);
    border-radius: 1px 1px 4px 4px; 
    
    /* 玻璃质感 + 阴影 */
    box-shadow: 
        -1px 0 4px rgba(255,255,255,0.4),         /* 左侧玻璃高光 */
        1px 0 3px rgba(0,0,0,0.3),                 /* 右侧玻璃阴影 */
        0 0 15px rgba(212,165,116,0.5),            /* 琥珀色发光 */
        inset -2px 0 6px rgba(255,255,255,0.3),    /* 内部左侧高光 */
        inset 2px 0 4px rgba(0,0,0,0.2),           /* 内部右侧阴影 */
        0 8px 12px rgba(0,0,0,0.35);               /* 底部投影 */
    
    /* 层级设置 */
    z-index: 2147483647;
    pointer-events: none;

    /* 初始姿态 */
    transform-origin: center -10px; 
    transform: translate(-50%, 0%) rotate(6deg);
    transition: transform 0.12s ease-out;
    
    /* 玻璃透明质感 */
    opacity: 0.95;
}

/* 瓶肩：威士忌瓶的标志性宽肩设计 */
#custom-cursor::before {
    content: ''; 
    position: absolute;
    top: -6px; 
    left: -1px;
    right: -1px;
    height: 6px;
    
    /* 肩部液体 */
    background: 
        linear-gradient(90deg, 
            rgba(255,255,255,0.5) 0%,
            transparent 3px,
            transparent calc(100% - 3px),
            rgba(0,0,0,0.3) 100%
        ),
        linear-gradient(180deg,
            #E8C794 0%,
            #D4A574 100%
        );
    
    border: 1px solid rgba(200,200,200,0.3);
    border-left-color: rgba(255,255,255,0.5);
    border-right-color: rgba(0,0,0,0.3);
    border-bottom: none;
    border-radius: 2px 2px 0 0;
    
    box-shadow: 
        inset -2px 0 4px rgba(255,255,255,0.3),
        inset 2px 0 3px rgba(0,0,0,0.2);
}

/* 瓶颈 + 螺旋盖 */
#custom-cursor::after {
    content: '';
    position: absolute;
    top: -16px;
    left: 50%;
    transform: translateX(-50%);
    width: 8px;
    height: 16px;
    
    /* 瓶颈（下）+ 金色螺旋盖（上）*/
    background: 
        /* 瓶颈玻璃 */
        linear-gradient(180deg,
            #2a2318 0%,      /* 黑色螺旋盖 */
            #2a2318 5px,
            transparent 5px,
            rgba(255,255,255,0.2) 6px,
            rgba(212,165,116,0.4) 8px,   /* 瓶颈内液体 */
            rgba(212,165,116,0.5) 100%
        );
    
    border-radius: 2px 2px 0 0;
    border: 1px solid rgba(180,180,180,0.3);
    border-top-color: rgba(40,35,25,0.9);
    
    box-shadow: 
        0 -1px 3px rgba(0,0,0,0.5),               /* 瓶盖阴影 */
        inset 0 1px 1px rgba(200,180,150,0.3),    /* 瓶盖高光 */
        inset -1px 0 2px rgba(255,255,255,0.2);   /* 瓶颈高光 */
}

/* 3. 倒酒动画 - 威士忌倾倒动作 */
.pouring { 
    animation: pour-anim 1.1s cubic-bezier(0.4, 0.0, 0.2, 1) forwards; 
}

@keyframes pour-anim {
    0% { 
        transform: translate(-50%, 0%) rotate(6deg); 
        opacity: 0.95;
    }
    20% { 
        transform: translate(-50%, 0%) rotate(85deg); 
        opacity: 1;
    }
    75% { 
        transform: translate(-50%, 0%) rotate(85deg); 
        opacity: 1;
    }
    100% { 
        transform: translate(-50%, 0%) rotate(6deg); 
        opacity: 0.95;
    }
}

/* 4. 粒子样式 - 增强拖尾效果 */
.cursor-particle {
    position: fixed; 
    pointer-events: none;
    /* 金色发光粒子，带多层光晕 */
    background: radial-gradient(circle, 
        #FFD700 0%, 
        rgba(255, 215, 0, 0.8) 30%,
        rgba(255, 215, 0, 0.3) 60%,
        transparent 100%);
    width: 6px; 
    height: 6px; 
    border-radius: 50%; 
    
    /* 粒子层级也要很高，但要在酒瓶下面一点点 */
    z-index: 2147483646; 
    
    /* 增强发光效果 */
    box-shadow: 
        0 0 8px rgba(255, 215, 0, 0.8),
        0 0 15px rgba(255, 215, 0, 0.4),
        0 0 20px rgba(255, 215, 0, 0.2);
    mix-blend-mode: screen;
    
    /* 初始透明度 */
    opacity: 0.9;
}

/* 5. 统一返回按钮样式（跨页面复用） */

.back-btn, .unified-back-btn {
    /* 主题化返回键：玻璃质感 + 金色高光，统一所有页面 */
    font-family: 'Rajdhani', sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #F5E6C7 !important;
    background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(0,0,0,0.08)) !important;
    border: 1px solid rgba(229,197,120,0.25) !important;
    box-shadow: 0 6px 20px rgba(198,166,100,0.06), inset 0 1px 0 rgba(255,255,255,0.03) !important;
    padding: 8px 18px !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    cursor: pointer !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease !important;
    border-radius: 28px !important;
    z-index: 2147483646 !important;
    pointer-events: auto !important;
}
.back-btn::before, .unified-back-btn::before {
    content: '←' !important;
    display: inline-block !important;
    margin-right: 8px !important;
    font-size: 16px !important;
    color: #E5C578 !important;
    line-height: 1 !important;
}
.unified-back-btn[data-action="restart"]::before {
    content: '↻' !important;
    font-size: 18px !important;
}
.back-btn:hover, .unified-back-btn:hover {
    transform: translateY(-3px) scale(1.02) !important;
    box-shadow: 0 12px 30px rgba(229,197,120,0.12) !important;
    background: linear-gradient(180deg, rgba(229,197,120,0.06), rgba(0,0,0,0.12)) !important;
    color: #fff !important;
    border-color: rgba(229,197,120,0.85) !important;
}
.back-btn:active, .unified-back-btn:active {
    transform: translateY(-1px) scale(0.995) !important;
}

/* 兼容：若页面里仍存在旧的 .back-btn 或 .top-nav，将它们和统一样式一起显示 */
.back-btn.unified-back-btn, .top-nav.unified-back-btn {
    display: inline-flex; justify-content: center; align-items: center;
}