body {
    background-color: #0B0F19;
    color: #f3f4f6;
    overflow-x: hidden;
}
.glass-nav {
    background: rgba(11, 15, 25, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.glass-card {
    background: linear-gradient(180deg, rgba(31, 41, 55, 0.4) 0%, rgba(17, 24, 39, 0.4) 100%);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
}
.glow-button {
    position: relative;
}
.glow-button::before {
    content: '';
    position: absolute;
    top: -2px; left: -2px; right: -2px; bottom: -2px;
    background: linear-gradient(45deg, #14b8a6, #3b82f6, #8b5cf6, #14b8a6);
    z-index: -1;
    border-radius: 9999px;
    background-size: 400%;
    animation: glowing 20s linear infinite;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}
.glow-button:hover::before {
    opacity: 1;
}
@keyframes glowing {
    0% { background-position: 0 0; }
    50% { background-position: 400% 0; }
    100% { background-position: 0 0; }
}
.text-gradient {
    background: linear-gradient(135deg, #2dd4bf 0%, #3b82f6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.bg-grid {
    background-size: 40px 40px;
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
                      linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
    mask-image: linear-gradient(to bottom, transparent, black, transparent);
    -webkit-mask-image: linear-gradient(to bottom, transparent, black, transparent);
}
.input-modern {
    background: rgba(17, 24, 39, 0.8) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: white !important;
    transition: all 0.2s;
}
.input-modern:focus {
    border-color: #2dd4bf !important;
    box-shadow: 0 0 0 2px rgba(45, 212, 191, 0.2) !important;
    outline: none;
}
