body {
    font-family: 'Inter', sans-serif;
    background-color: #0c0c0e; /* Darker background */
    overflow-y: auto; /* Enable vertical scrolling */
    /* Anti-aliasing for text */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Custom glass effect with a more noticeable blur and shadow, and reduced opacity */
.glass-effect {
    background-color: rgba(255, 255, 255, 0.03); /* Lower opacity for better blur visibility */
    backdrop-filter: blur(150px) saturate(2); /* Increased blur and saturation for a true glass effect */
    -webkit-backdrop-filter: blur(150px) saturate(2);
    border: 1px solid rgba(255, 255, 255, 0.1); /* More subtle border */
    border-radius: 28px;
    box-shadow: 0 0 100px rgba(78, 142, 237, 0.3); /* Adjusted to a cooler blue glow */
    transition: box-shadow 0.3s ease-in-out;
}

.glass-effect:hover {
    box-shadow: 0 0 120px rgba(78, 142, 237, 0.5); /* Increased hover glow */
}

/* Custom gradient for the primary heading with animation and glow */
.gradient-text {
    background-image: linear-gradient(to right, #4a90e2, #6a85b6, #8b96c0); /* More professional blue/gray palette */
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    position: relative;
    /* Text glow effect */
    filter: drop-shadow(0 0 5px rgba(78, 142, 237, 0.5)) drop-shadow(0 0 15px rgba(78, 142, 237, 0.2));
    animation: gradient-shift 10s ease-in-out infinite alternate;
    font-family: 'Montserrat', sans-serif; /* Bolder font */
}

/* Class for buttons to have a gradient text effect on their label */
.button-gradient-text {
    background-image: linear-gradient(to right, #ffffff, #e0e0e0); /* A subtle white/gray gradient for the button text */
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: bold;
}

/* Gradient animation keyframes */
@keyframes gradient-shift {
    0% { background-position: 0% 50%; }
    100% { background-position: 100% 50%; }
}

/* VS Code and Discord icon colors adjusted to match the new palette */
.vscode-icon {
    color: #007ACC;
}
.discord-icon {
    color: #7289da;
}

/* Anti-cheat tag animations */
.anti-cheat-tag {
    transition: transform 0.2s ease-in-out;
}
.anti-cheat-tag:hover {
    transform: translateY(-4px) scale(1.05);
}

/* Canvas background styling */
#bg-canvas {
    width: 100vw;
    height: 100vh;
    background: #0c0c0e; /* Match body background */
}

/* Added new styling to make the floating particles more visible */
.particle-color {
    fill: #4a90e2; /* New particle color to match palette */
    filter: drop-shadow(0 0 5px #4a90e2);
}