html, body {
    background-color: #2B2D31 !important;
}

.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}
.glass-card {
    background: #2B2D31;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}
.bouncy-btn {
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), background-color 0.3s ease, box-shadow 0.3s ease;
}
.bouncy-btn:hover {
    transform: scale(1.03);
}
.bouncy-btn:active {
    transform: scale(0.95);
}

:root {
    --primary: #007FFF; /* Electric Blue */
    --background: #2B2D31;
    --surface: #2B2D31;
    --surface-container: #2B2D31;
    --on-surface: #FFFFFF;
    --text-black: #FFFFFF; 
    --neon-blue: #007FFF;
    --neon-glow: rgba(0, 127, 255, 0.4);
}

.primary-button {
    background-color: #007FFF;
    color: #ffffff;
    box-shadow: 0 0 10px rgba(0, 127, 255, 0.4), 0 0 25px rgba(0, 127, 255, 0.2);
    text-align: center;
    justify-content: center;
}

.primary-button:hover {
    background-color: #0066CC;
    box-shadow: 0 0 12px rgba(0, 127, 255, 0.6), 0 0 35px rgba(0, 127, 255, 0.4);
}
.neon-hue {
    color: #007FFF !important; /* Electric Blue Neon */
    text-shadow: 0 0 12px rgba(0, 127, 255, 0.6), 0 0 25px rgba(0, 127, 255, 0.3);
    transition: all 0.3s ease-in-out;
}
.neon-hue:hover {
    text-shadow: 0 0 15px rgba(0, 127, 255, 0.8), 0 0 35px rgba(0, 127, 255, 0.5);
}
.group:hover .neon-hue-image {
    filter: drop-shadow(0 0 12px rgba(0, 127, 255, 0.5));
}

.neon-hue-image {
    transition: filter 0.3s ease-in-out;
}
.logo-container {
    filter: drop-shadow(0 0 10px rgba(0, 127, 255, 0.4)) drop-shadow(0 0 25px rgba(0, 127, 255, 0.2));
    transition: all 0.3s ease-in-out;
}
.logo-container img {
    /* High-precision filter to convert dark blue logo to #007FFF (Electric Blue) */
    filter: brightness(0) saturate(100%) invert(35%) sepia(91%) saturate(3015%) hue-rotate(196deg) brightness(101%) contrast(106%);
    width: 100%;
    height: auto;
    display: block;
}
.logo-container:hover {
    filter: drop-shadow(0 0 15px rgba(0, 127, 255, 0.6)) drop-shadow(0 0 35px rgba(0, 127, 255, 0.4));
}
.primary-button.active {
    background-color: #007FFF;
    box-shadow: 0 0 12px rgba(0, 127, 255, 0.7), 0 0 35px rgba(0, 127, 255, 0.6), inset 0 2px 4px rgba(0,0,0,0.3);
}

/* Mobile Navigation Overlay */