:root{
    --ui-glow-a: rgba(56,189,248,0.28);
    --ui-glow-b: rgba(123,47,247,0.24);
    --ui-border-strong: rgba(148,163,184,0.48);
}

body{
    position: relative;
}

body::before{
    content:"";
    position: fixed;
    inset: -20%;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 20% 15%, var(--ui-glow-a) 0%, rgba(56,189,248,0) 35%),
        radial-gradient(circle at 85% 78%, var(--ui-glow-b) 0%, rgba(123,47,247,0) 35%);
    filter: blur(28px);
    animation: ui-aurora 18s ease-in-out infinite alternate;
}

@keyframes ui-aurora{
    0%{transform: translate3d(-1.5%, -1.5%, 0) scale(1);}
    100%{transform: translate3d(1.5%, 1.5%, 0) scale(1.08);}
}

.card,
.panel{
    transform: translateZ(0);
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.card:hover,
.panel:hover{
    transform: translateY(-3px);
    border-color: var(--ui-border-strong);
}

.btn-primary,
.btn,
button{
    transition: transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease;
}

[data-animate-item]{
    opacity: 0;
    transform: translate3d(0, 16px, 0) scale(0.99);
    transition: opacity 0.55s ease, transform 0.55s ease;
    will-change: opacity, transform;
}

[data-animate-item].is-in{
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
}

.ui-tilt{
    transform-style: preserve-3d;
}

.ui-float{
    animation: ui-float 5.5s ease-in-out infinite;
}

@keyframes ui-float{
    0%,100%{transform: translate3d(0, 0, 0);}
    50%{transform: translate3d(0, -4px, 0);}
}

.ui-shine{
    position: relative;
    overflow: hidden;
}

.ui-shine::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background: linear-gradient(115deg, transparent 0%, rgba(255,255,255,0.28) 45%, transparent 75%);
    transform: translateX(-130%);
    transition: transform 0.65s ease;
}

.ui-shine:hover::after{
    transform: translateX(130%);
}

@media (prefers-reduced-motion: reduce){
    *,
    *::before,
    *::after{
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }

    body::before{
        display:none;
    }
}