@layer utilities {
    .glass {
        background: linear-gradient(135deg, rgba(255,255,255,0.1), rgba(255,255,255,0.03));
        backdrop-filter: blur(20px) saturate(180%);
        -webkit-backdrop-filter: blur(20px) saturate(180%);
        border: 1px solid rgba(255,255,255,0.15);
        box-shadow: 
            0 8px 32px rgba(0,0,0,0.3),
            inset 0 1px 0 rgba(255,255,255,0.1);
        position: relative;
        overflow: hidden;
    }
    .glass::before {
        content: '';
        position: absolute;
        inset: -2px;
        background: conic-gradient(
            from 0deg,
            transparent 0deg,
            rgba(59, 130, 246, 0.3) 90deg,
            transparent 180deg,
            transparent 360deg
        );
        z-index: -1;
        animation: borderShine 6s linear infinite;
        opacity: 0.7;
    }
    .stat-card {
        background: rgba(30, 41, 59, 0.4);
        backdrop-filter: blur(12px);
        border: 1px solid rgba(255,255,255,0.08);
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .stat-card:hover {
        transform: translateY(-2px);
        border-color: rgba(59, 130, 246, 0.5);
        box-shadow: 0 8px 24px rgba(0,0,0,0.3);
        background: rgba(30, 41, 59, 0.6);
    }
    .text-gradient {
        background: linear-gradient(135deg, #60a5fa, #22d3ee, #a78bfa);
        background-size: 200% 200%;
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        animation: gradientShift 5s ease infinite;
    }
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background: 
        radial-gradient(circle at top, #1e293b 0%, #020617 70%),
        #020617;
    min-height: 100vh;
    overflow-x: hidden;
    position: relative;
}

/* 鼠标跟随光斑，移动端自动隐藏 */
#cursorGlow {
    position: fixed;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
    transform: translate(-50%, -50%);
    transition: transform 0.15s ease-out;
    filter: blur(40px);
}
@media (max-width:768px){
    #cursorGlow { display: none; }
}

.bg-orb {
    position: fixed;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.4;
    z-index: 0;
    animation: float 8s ease-in-out infinite;
}

.loader-ring {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #3b82f6;
    border-right-color: #22d3ee;
    animation: spin 1.2s linear infinite;
    position: relative;
}
.loader-ring::after {
    content: '';
    position: absolute;
    inset: 6px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-bottom-color: rgba(59, 130, 246, 0.5);
    border-left-color: rgba(34, 211, 238, 0.5);
    animation: spin 2s linear infinite reverse;
}

/* 动画定义 */
@keyframes borderShine {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
@keyframes float {
    0%, 100% { transform: translateY(0) scale(1); }
    50% { transform: translateY(-30px) scale(1.05); }
}
@keyframes gradientShift {
    0%,100% { background-position:0% 50%; }
    50% { background-position:100% 50%; }
}
@keyframes spin {
    to { transform: rotate(360deg); }
}
@keyframes breathSafe {
    0%, 100% { box-shadow: 0 0 20px rgba(34, 197, 94, 0.2); }
    50% { box-shadow: 0 0 40px rgba(34, 197, 94, 0.4); }
}
@keyframes breathDanger {
    0%, 100% { box-shadow: 0 0 20px rgba(239, 68, 68, 0.2); }
    50% { box-shadow: 0 0 40px rgba(239, 68, 68, 0.4); }
}
@keyframes floatUp {
    0% { opacity:0; transform: translateY(20px); }
    100% { opacity:1; transform: translateY(0); }
}

.animate-float-up {
    animation: floatUp 0.6s ease-out forwards;
}
.animate-breath-safe {
    animation: breathSafe 3s ease-in-out infinite;
}
.animate-breath-danger {
    animation: breathDanger 3s ease-in-out infinite;
}
.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }
.delay-400 { animation-delay: 0.4s; }
.delay-500 { animation-delay: 0.5s; }