/* ===== 三套主题 - 精品视觉 ===== */

/* --- 暗色(默认) - 深邃夜空 + 紫蓝氛围 --- */
[data-theme="dark"] {
    --bg: #0c0c18;
    --bg-gradient: linear-gradient(160deg, #0c0c18 0%, #15102a 40%, #0c1824 100%);
    --nav-bg: rgba(12,12,24,0.82);
    --card-bg: rgba(26,26,48,0.75);
    --text: #f2f2f7;
    --text-muted: #8e8ea8;
    --text-primary: #f2f2f7;
    --text-secondary: #b0b0c8;
    --border: rgba(100,100,160,0.18);
    
    --accent-blue: #6c5ce7;
    --accent-purple: #a855f7;
    --accent-pink: #ec4899;
    --accent-orange: #f97316;
    --accent-yellow: #eab308;
    --accent-green: #22c55e;
    --accent-teal: #14b8a6;
    --accent-red: #ef4444;
    --accent-gold: #ffd700;
    
    body { background: var(--bg-gradient); }
    /* PK 暖色系 */
    --pk-warm: #f97316;
    --pk-fire: #ef4444;
    --pk-gold: #fbbf24;
    --pk-score-opp: #f97316;
    --pk-score-me: #6c5ce7;
    --glass-bg: rgba(26,26,48,0.6);
    --glass-border: rgba(100,100,160,0.2);
}

/* --- 亮色 - 清新活力 --- */
[data-theme="light"] {
    --bg: #f5f5ff;
    --bg-gradient: linear-gradient(160deg, #f5f5ff 0%, #eeeeff 40%, #f0f0ff 100%);
    --nav-bg: rgba(245,245,255,0.88);
    --card-bg: rgba(255,255,255,0.85);
    --text: #1a1a2e;
    --text-muted: #6b7280;
    --text-primary: #1a1a2e;
    --text-secondary: #6b7280;
    --border: rgba(180,180,220,0.35);
    
    --accent-blue: #5b4fcf;
    --accent-purple: #9333ea;
    --accent-pink: #db2777;
    --accent-orange: #ea580c;
    --accent-yellow: #ca8a04;
    --accent-green: #16a34a;
    --accent-teal: #0d9488;
    --accent-red: #dc2626;
    --accent-gold: #d4a017;
    
    body { background: var(--bg-gradient); }
    /* PK 暖色系 */
    --pk-warm: #ea580c;
    --pk-fire: #dc2626;
    --pk-gold: #d97706;
    --pk-score-opp: #ea580c;
    --pk-score-me: #5b4fcf;
    --glass-bg: rgba(255,255,255,0.7);
    --glass-border: rgba(180,180,220,0.25);
}

/* --- 护眼 - 暖黄低对比 + 柔和 --- */
[data-theme="eye"] {
    --bg: #f8f3e6;
    --bg-gradient: linear-gradient(160deg, #f8f3e6 0%, #f2ecda 40%, #f5f0e0 100%);
    --nav-bg: rgba(248,243,230,0.9);
    --card-bg: rgba(238,230,208,0.65);
    --text: #5b4636;
    --text-muted: #8b7355;
    --text-primary: #5b4636;
    --text-secondary: #8b7355;
    --border: rgba(180,165,130,0.3);
    
    --accent-blue: #7b7bc5;
    --accent-purple: #9b7fbe;
    --accent-pink: #c4717a;
    --accent-orange: #c4883a;
    --accent-yellow: #b8953a;
    --accent-green: #5a8e5a;
    --accent-teal: #5a8e8e;
    --accent-red: #c4715e;
    --accent-gold: #b8953a;
    
    body { background: var(--bg-gradient); }
    /* PK 暖色系 */
    --pk-warm: #c4883a;
    --pk-fire: #c4715e;
    --pk-gold: #b8953a;
    --pk-score-opp: #c4883a;
    --pk-score-me: #7b7bc5;
    --glass-bg: rgba(238,230,208,0.5);
    --glass-border: rgba(180,165,130,0.25);
}

/* ===== 微光氛围层 ===== */
.dp-ambient-glow {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    pointer-events: none;
    z-index: 2;
    will-change: opacity, transform;
}
[data-theme=dark] .dp-ambient-glow {
    background: radial-gradient(circle at 50% 30%, rgba(139,122,255,0.55) 0%, rgba(168,85,247,0.20) 30%, rgba(99,70,220,0.08) 55%, transparent 78%);
}
[data-theme=light] .dp-ambient-glow {
    background: radial-gradient(circle at 50% 30%, rgba(91,79,207,0.32) 0%, rgba(147,51,234,0.14) 30%, rgba(99,70,220,0.06) 55%, transparent 78%);
}
[data-theme=eye] .dp-ambient-glow {
    background: radial-gradient(circle at 50% 30%, rgba(200,170,110,0.40) 0%, rgba(230,200,140,0.18) 30%, rgba(180,150,90,0.07) 55%, transparent 78%);
}


/* ===== 光晕呼吸动画（CSS fallback，GSAP 不可用时自动启用） ===== */
@keyframes dp-ambient-breathe {
    0%, 100% { opacity: 0.35; transform: scale(0.95); }
    50% { opacity: 1.0; transform: scale(1.06); }
}
.dp-ambient-glow.css-breath {
    animation: dp-ambient-breathe 7s ease-in-out infinite;
}

/* ===== 毛玻璃底板 ===== */
.dp-glass-backdrop {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    pointer-events: none;
    z-index: 1;
    backdrop-filter: blur(60px);
    -webkit-backdrop-filter: blur(60px);
    mask: linear-gradient(to bottom, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0) 40%);
    -webkit-mask: linear-gradient(to bottom, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0) 40%);
}
