:root {
    color-scheme: dark;
}

body {
    background-color: #0b0f14;
    color: white;
    margin: 0;
    padding: 0;
    font-family: 'Inter', system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6, .display-font {
    font-family: 'Space Grotesk', sans-serif;
}

@keyframes drift {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    100% {
        transform: translate3d(-2%, 2%, 0) scale(1.08);
    }
}

.aurora {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

    .aurora::before {
        content: '';
        position: absolute;
        inset: -20%;
        /*background-image: radial-gradient(circle at 16% 20%, rgba(45,212,191,0.55) 0%, transparent 40%), radial-gradient(circle at 86% 26%, rgba(232,121,249,0.50) 0%, transparent 40%), radial-gradient(circle at 64% 90%, rgba(45,212,191,0.30) 0%, transparent 50%), radial-gradient(circle at 30% 82%, rgba(232,121,249,0.26) 0%, transparent 45%), radial-gradient(circle at 78% 70%, rgba(94,234,212,0.22) 0%, transparent 35%);*/
        background-image: radial-gradient(circle at 16% 20%, rgba(79,70,229,0.55) 0%, transparent 40%), radial-gradient(circle at 86% 26%, rgba(99,102,241,0.50) 0%, transparent 40%), radial-gradient(circle at 64% 90%, rgba(67,56,202,0.30) 0%, transparent 50%), radial-gradient(circle at 30% 82%, rgba(49,46,129,0.26) 0%, transparent 45%), radial-gradient(circle at 78% 70%, rgba(129,140,248,0.22) 0%, transparent 35%);
        filter: blur(42px) saturate(155%);
        animation: drift 22s ease-in-out infinite alternate;
    }

.grain {
    position: fixed;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        radial-gradient(circle at 16% 20%, rgba(79,70,229,0.55) 0%, transparent 40%),
        radial-gradient(circle at 86% 26%, rgba(99,102,241,0.50) 0%, transparent 40%),
        radial-gradient(circle at 64% 90%, rgba(67,56,202,0.30) 0%, transparent 50%),
        radial-gradient(circle at 30% 82%, rgba(49,46,129,0.26) 0%, transparent 45%),
        radial-gradient(circle at 78% 70%, rgba(129,140,248,0.22) 0%, transparent 35%),
        radial-gradient(circle at center, transparent 0%, rgba(5,7,10,0.55) 100%),
        url('data:image/svg+xml,%3Csvg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noiseFilter"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.65" numOctaves="3" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noiseFilter)"/%3E%3C/svg%3E');
    opacity: 0.8;
    mix-blend-mode: overlay;
}

.glass {
    background: linear-gradient(155deg, rgba(255,255,255,0.11) 0%, rgba(255,255,255,0.025) 100%);
    backdrop-filter: blur(26px) saturate(130%);
    -webkit-backdrop-filter: blur(26px) saturate(130%);
    border: 1px solid rgba(255,255,255,0.12);
}

.glass-sheen::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(180deg, rgba(255,255,255,0.1) 0%, transparent 10%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.18);
    pointer-events: none;
}

.glass-nav {
    background-color: rgba(11,15,20,0.55);
    backdrop-filter: blur(16px) saturate(140%);
    -webkit-backdrop-filter: blur(16px) saturate(140%);
}

.card-glow::before {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(135deg, rgba(45,212,191,0.55) 0%, rgba(232,121,249,0.45) 50%, transparent 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0.7;
    pointer-events: none;
}

/*.btn-grad {
    background: linear-gradient(105deg, #2dd4bf 0%, #5eead4 35%, #e879f9 100%);
    box-shadow: 0 4px 14px -2px rgba(45,212,191,0.4), 0 2px 8px -2px rgba(232,121,249,0.3);
    transition: all 0.2s ease;
}

.btn-grad:hover {
    transform: translateY(-1px);
    filter: brightness(1.05);
    box-shadow: 0 6px 20px -2px rgba(45,212,191,0.5), 0 4px 12px -2px rgba(232,121,249,0.4);
}

.grad-text {
    background: linear-gradient(100deg, #5eead4 0%, #2dd4bf 30%, #e879f9 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}*/
.btn-grad {
    background: linear-gradient(105deg, #4338ca 0%, #4338ca 25%, #6366f1 100%);
    box-shadow: 0 4px 14px -2px rgba(49,46,129,0.4), 0 2px 8px -2px rgba(99,102,241,0.3);
    transition: all 0.2s ease;
}

    .btn-grad:hover {
        transform: translateY(-1px);
        filter: brightness(1.06);
        box-shadow: 0 6px 20px -2px rgba(49,46,129,0.5), 0 4px 12px -2px rgba(99,102,241,0.4);
    }

.grad-text {
    background: linear-gradient(100deg, #818cf8 0%, #6366f1 30%, #a5b4fc 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}
.field {
    background-color: rgba(255,255,255,0.045);
    border: 1px solid rgba(255,255,255,0.10);
    transition: all 0.2s ease;
}

    .field::placeholder {
        color: rgba(226,232,240,0.42);
    }

    .field:focus {
        outline: none;
        background-color: rgba(45,212,191,0.06);
        border-color: rgba(45,212,191,0.65);
        box-shadow: 0 0 0 3px rgba(45,212,191,0.14), 0 0 28px rgba(45,212,191,0.22);
    }

.field-wrap:focus-within .field-icon {
    color: #2dd4bf;
}

.chip {
    background-color: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.12);
    transition: background-color 0.2s ease;
}

    .chip:hover {
        background-color: rgba(255,255,255,0.15);
    }

.social-btn {
    transition: all 0.2s ease;
}

    .social-btn:hover {
        border-color: rgba(255,255,255,0.28);
        background-color: rgba(255,255,255,0.06);
        transform: translateY(-1px);
    }

/* Tailwind theme customization */
.text-ink {
    color: white;
}

.bg-ink {
    background-color: #0b0f14;
}

.ring-ink {
    --tw-ring-color: #0b0f14;
}

.text-aqua {
    color: #2dd4bf;
}

.bg-aqua {
    background-color: #2dd4bf;
}

.text-magenta {
    color: #e879f9;
}

.tlog {
    opacity: 0.4;
    filter: grayscale(1);
    font-size: 0.80rem;
    font-weight: 700;
    color: var(--tx2);
    transition: 0.3s;
}

.tlog:hover {
    opacity: 0.85;
    filter: none;
}

.btn-grad2 {
    background: linear-gradient(105deg, #0284c7 0%, #2563eb 35%, #6366f1 100%);
    box-shadow: 0 4px 14px -2px rgba(2,132,199,0.4), 0 2px 8px -2px rgba(99,102,241,0.3);
    transition: all 0.2s ease;
}

    .btn-grad2:hover {
        transform: translateY(-1px);
        filter: brightness(1.05);
        box-shadow: 0 6px 20px -2px rgba(2,132,199,0.5), 0 4px 12px -2px rgba(99,102,241,0.4);
    }

.validation-summary-errors, .alert alert-warning {
    font-size: 12px;
    color: #ff0d48;
}