/* =====================================================
   CRYONIX TEAM IDENTITY ENVIRONMENTS — V2
   Zenith = cold / crystalline / navigation
   Nova   = purple nebula / constellation field
===================================================== */


/* =====================================================
   SHARED TEAM ENVIRONMENT
===================================================== */

body.team-page {
    position: relative;
    isolation: isolate;
    overflow-x: hidden;
    background: #02070b;
}

body.team-page > header,
body.team-page > main,
body.team-page > footer {
    position: relative;
    z-index: 2;
}

.team-identity-bg,
#team-identity-fx,
.team-identity-vignette {
    position: fixed;
    inset: 0;
    pointer-events: none;
}

.team-identity-bg {
    z-index: 0;
}

#team-identity-fx {
    z-index: 1;
    width: 100%;
    height: 100%;
}

.team-identity-vignette {
    z-index: 1;

    background:
        linear-gradient(
            180deg,
            rgba(1, 6, 10, 0.015) 0%,
            transparent 18%,
            transparent 80%,
            rgba(1, 5, 9, 0.16) 100%
        ),
        radial-gradient(
            ellipse at center,
            transparent 64%,
            rgba(0, 4, 8, 0.09) 100%
        );
}

.team-page main {
    background: transparent !important;
}


/* =====================================================
   ZENITH
   ICY AURORA / CRYSTALLINE NAVIGATION FIELD
===================================================== */

.zenith-page {
    background:
        linear-gradient(
            180deg,
            #020b12 0%,
            #041722 28%,
            #06202d 58%,
            #020a10 100%
        );
}

.zenith-page #team-identity-fx {
    opacity: 1;
}

.zenith-page .team-identity-bg {
    background:

        radial-gradient(
            ellipse at 78% 12%,
            rgba(91, 222, 255, 0.24),
            transparent 27%
        ),

        radial-gradient(
            ellipse at 22% 34%,
            rgba(42, 154, 205, 0.15),
            transparent 31%
        ),

        radial-gradient(
            ellipse at 72% 67%,
            rgba(53, 182, 228, 0.16),
            transparent 30%
        ),

        radial-gradient(
            ellipse at 24% 84%,
            rgba(37, 121, 170, 0.11),
            transparent 28%
        ),

        linear-gradient(
            118deg,
            rgba(31, 134, 180, 0.075),
            transparent 30%,
            rgba(103, 224, 255, 0.060) 56%,
            transparent 80%
        );
}

/* navigation grid + cold aurora sweep */
.zenith-page .team-identity-bg::before {
    content: "";
    position: absolute;
    inset: -6%;

    background:

        linear-gradient(
            108deg,
            transparent 16%,
            rgba(113, 230, 255, 0.035) 30%,
            rgba(70, 185, 226, 0.075) 40%,
            rgba(148, 240, 255, 0.040) 48%,
            transparent 61%
        ),

        repeating-linear-gradient(
            112deg,
            transparent 0,
            transparent 96px,
            rgba(114, 229, 255, 0.035) 97px,
            transparent 98px
        ),

        repeating-linear-gradient(
            0deg,
            transparent 0,
            transparent 118px,
            rgba(86, 199, 235, 0.025) 119px,
            transparent 120px
        );

    opacity: 0.82;

    -webkit-mask-image:
        linear-gradient(
            90deg,
            transparent,
            black 16%,
            black 96%,
            transparent
        );

    mask-image:
        linear-gradient(
            90deg,
            transparent,
            black 16%,
            black 96%,
            transparent
        );

    animation:
        zenith-aurora-drift
        20s
        ease-in-out
        infinite alternate;
}

/* fine ice dust / cold stars */
.zenith-page .team-identity-bg::after {
    content: "";
    position: absolute;
    inset: 0;

    background-image:

        radial-gradient(
            circle,
            rgba(213, 247, 255, 0.28) 0 1px,
            transparent 1.35px
        ),

        radial-gradient(
            circle,
            rgba(116, 218, 255, 0.17) 0 0.8px,
            transparent 1.15px
        );

    background-size:
        88px 88px,
        149px 149px;

    background-position:
        14px 22px,
        56px 71px;

    opacity: 0.52;
}

.zenith-page .team-page-hero {
    background:

        radial-gradient(
            circle at 80% 39%,
            rgba(73, 205, 247, 0.18),
            transparent 37%
        ),

        radial-gradient(
            circle at 18% 24%,
            rgba(37, 132, 181, 0.10),
            transparent 34%
        ),

        linear-gradient(
            90deg,
            rgba(2, 9, 14, 0.64) 0%,
            rgba(4, 18, 25, 0.54) 58%,
            rgba(4, 26, 36, 0.46) 100%
        ) !important;
}

.zenith-page .team-roster-section {
    background:

        radial-gradient(
            circle at 88% 22%,
            rgba(91, 220, 255, 0.12),
            transparent 31%
        ),

        radial-gradient(
            circle at 17% 77%,
            rgba(38, 129, 177, 0.07),
            transparent 29%
        ),

        linear-gradient(
            180deg,
            rgba(3, 12, 17, 0.65),
            rgba(3, 11, 16, 0.70)
        ) !important;
}

.zenith-page .team-results-section {
    background:

        radial-gradient(
            circle at 16% 42%,
            rgba(50, 174, 219, 0.11),
            transparent 33%
        ),

        radial-gradient(
            circle at 82% 76%,
            rgba(80, 211, 248, 0.07),
            transparent 29%
        ),

        linear-gradient(
            180deg,
            rgba(3, 11, 16, 0.67),
            rgba(2, 9, 14, 0.72)
        ) !important;
}

.zenith-page .team-page-background-logo {
    opacity: 0.12 !important;

    filter:
        brightness(1.12)
        saturate(1.20)
        drop-shadow(
            0 0 26px
            rgba(103, 222, 255, 0.13)
        );

    animation:
        zenith-emblem-breathe
        8s
        ease-in-out
        infinite;
}

.zenith-page .team-page-main-logo {
    filter:
        drop-shadow(
            0 0 18px
            rgba(99, 220, 255, 0.20)
        )
        drop-shadow(
            0 0 40px
            rgba(49, 152, 201, 0.10)
        );
}

/* cyan section separators */
.zenith-page .team-roster-section::before,
.zenith-page .team-results-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 8%;
    right: 8%;
    height: 1px;
    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(140, 239, 255, 0.30) 24%,
            rgba(75, 204, 242, 0.14) 72%,
            transparent
        );

    box-shadow:
        0 0 22px
        rgba(84, 213, 250, 0.13);
}

/* =====================================================
   NOVA
   PURPLE CONSTELLATION / NEBULA FIELD
===================================================== */

.nova-page {
    background:
        linear-gradient(
            180deg,
            #070713 0%,
            #0b0820 30%,
            #100a2a 62%,
            #070712 100%
        );
}

.nova-page #team-identity-fx {
    opacity: 1;
}

.nova-page .team-identity-bg {
    background:

        radial-gradient(
            ellipse at 76% 12%,
            rgba(153, 89, 255, 0.27),
            transparent 30%
        ),

        radial-gradient(
            ellipse at 18% 35%,
            rgba(121, 72, 220, 0.19),
            transparent 32%
        ),

        radial-gradient(
            ellipse at 78% 67%,
            rgba(98, 54, 190, 0.20),
            transparent 33%
        ),

        radial-gradient(
            ellipse at 33% 82%,
            rgba(148, 83, 255, 0.13),
            transparent 30%
        ),

        linear-gradient(
            132deg,
            rgba(95, 48, 175, 0.085),
            transparent 30%,
            rgba(134, 73, 235, 0.070) 56%,
            transparent 78%
        );
}

/* additional purple clouding so the page is not flat/dark */
.nova-page .team-identity-bg::before,
    .zenith-page .team-identity-bg::before {
    content: "";
    position: absolute;
    inset: -8%;

    background:
        radial-gradient(
            ellipse at 20% 20%,
            rgba(176, 105, 255, 0.11),
            transparent 21%
        ),
        radial-gradient(
            ellipse at 72% 38%,
            rgba(130, 72, 226, 0.14),
            transparent 24%
        ),
        radial-gradient(
            ellipse at 42% 72%,
            rgba(98, 54, 190, 0.12),
            transparent 26%
        ),
        radial-gradient(
            ellipse at 90% 86%,
            rgba(164, 91, 255, 0.085),
            transparent 22%
        );

    filter: blur(18px);
    opacity: 0.95;

    animation:
        nova-nebula-drift
        22s
        ease-in-out
        infinite alternate;
}

/* faint star dust layer */
.nova-page .team-identity-bg::after {
    content: "";
    position: absolute;
    inset: 0;

    background-image:
        radial-gradient(
            circle,
            rgba(222, 200, 255, 0.22) 0 1px,
            transparent 1.3px
        ),
        radial-gradient(
            circle,
            rgba(170, 126, 255, 0.16) 0 0.8px,
            transparent 1.1px
        );

    background-size:
        82px 82px,
        137px 137px;

    background-position:
        8px 18px,
        42px 58px;

    opacity: 0.48;
}

.nova-page .team-page-hero {
    background:
        radial-gradient(
            circle at 80% 40%,
            rgba(150, 86, 255, 0.20),
            transparent 37%
        ),
        radial-gradient(
            circle at 22% 28%,
            rgba(102, 55, 180, 0.10),
            transparent 34%
        ),
        linear-gradient(
            90deg,
            rgba(4, 5, 13, 0.66) 0%,
            rgba(10, 8, 27, 0.56) 58%,
            rgba(20, 12, 48, 0.48) 100%
        ) !important;
}

.nova-page .team-roster-section {
    background:
        radial-gradient(
            circle at 84% 24%,
            rgba(154, 88, 255, 0.13),
            transparent 31%
        ),
        radial-gradient(
            circle at 16% 74%,
            rgba(105, 58, 198, 0.085),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            rgba(7, 7, 20, 0.67),
            rgba(8, 7, 22, 0.72)
        ) !important;
}

.nova-page .team-results-section {
    background:
        radial-gradient(
            circle at 18% 39%,
            rgba(155, 89, 255, 0.13),
            transparent 34%
        ),
        radial-gradient(
            circle at 82% 72%,
            rgba(102, 54, 194, 0.085),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            rgba(8, 7, 22, 0.70),
            rgba(6, 6, 18, 0.74)
        ) !important;
}

.nova-page .team-page-background-logo {
    opacity: 0.11 !important;

    filter:
        brightness(1.10)
        saturate(1.28)
        drop-shadow(
            0 0 26px
            rgba(170, 108, 255, 0.12)
        );

    animation:
        nova-emblem-breathe
        9s
        ease-in-out
        infinite;
}

.nova-page .team-page-main-logo {
    filter:
        drop-shadow(
            0 0 18px
            rgba(178, 119, 255, 0.20)
        )
        drop-shadow(
            0 0 38px
            rgba(136, 74, 230, 0.10)
        );
}

/* purple section separators */
.nova-page .team-roster-section::before,
.nova-page .team-results-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 8%;
    right: 8%;
    height: 1px;
    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(190, 130, 255, 0.30) 24%,
            rgba(150, 91, 255, 0.15) 72%,
            transparent
        );

    box-shadow:
        0 0 22px
        rgba(162, 96, 255, 0.13);
}


/* =====================================================
   SHARED DEPTH
===================================================== */

.team-page .team-page-hero,
.team-page .team-roster-section,
.team-page .team-results-section {
    position: relative;
    z-index: 1;
}

.team-page .team-section-heading,
.team-page .roster-grid,
.team-page .team-competition-grid,
.team-page .team-page-hero-content {
    position: relative;
    z-index: 2;
}

.team-page .roster-card,
.team-page .competition-card {
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}


/* =====================================================
   EMBLEM MOTION
   Opacity only — preserves original transform/position.
===================================================== */

@keyframes zenith-emblem-breathe {
    0%,
    100% {
        opacity: 0.080;
    }

    50% {
        opacity: 0.115;
    }
}

@keyframes nova-emblem-breathe {
    0%,
    100% {
        opacity: 0.085;
    }

    50% {
        opacity: 0.125;
    }
}

@keyframes nova-nebula-drift {
    from {
        transform: translate3d(-1.5%, -1%, 0) scale(1);
    }

    to {
        transform: translate3d(1.5%, 1%, 0) scale(1.035);
    }
}



@keyframes zenith-aurora-drift {
    from {
        transform: translate3d(-1.4%, -0.7%, 0) scale(1);
        background-position:
            0 0,
            0 0,
            0 0;
    }

    to {
        transform: translate3d(1.4%, 0.8%, 0) scale(1.025);
        background-position:
            34px 0,
            26px 0,
            0 18px;
    }
}

/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 700px) {

    .zenith-page #team-identity-fx {
        opacity: 0.72;
    }

    .nova-page #team-identity-fx {
        opacity: 0.88;
    }

    .zenith-page .team-page-background-logo,
    .nova-page .team-page-background-logo {
        opacity: 0.070 !important;
    }

    .nova-page .team-identity-bg::after {
        opacity: 0.36;
    }

    .team-identity-vignette {
        background:
            linear-gradient(
                180deg,
                rgba(1, 6, 10, 0.01),
                transparent 74%,
                rgba(1, 5, 9, 0.13)
            );
    }
}


/* =====================================================
   REDUCED MOTION
===================================================== */

@media (prefers-reduced-motion: reduce) {

    .zenith-page .team-page-background-logo,
    .nova-page .team-page-background-logo,
    .nova-page .team-identity-bg::before {
        animation: none !important;
    }
}
/* =========================================================
   CRYONIX TEAM BACKGROUNDS — FINAL IMAGE VERSION
   Zenith + Nova
========================================================= */


/* =========================================================
   SHARED TEAM PAGE SETUP
========================================================= */

body.team-page {
    position: relative;
    overflow-x: hidden;

    background: #02060b;
}


/* ---------------------------------------------------------
   ACTUAL BACKGROUND IMAGE LAYER
--------------------------------------------------------- */

.team-page .team-identity-bg {
    position: fixed !important;

    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;

    z-index: 0 !important;

    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;

    animation: none !important;

    pointer-events: none;
}


/* REMOVE OLD GENERATED EXTRA BACKGROUND LAYERS */

.team-page .team-identity-bg::before,
.team-page .team-identity-bg::after {
    content: none !important;
    display: none !important;
}


/* REMOVE OLD CANVAS EFFECTS */

.team-page #team-identity-fx {
    display: none !important;
}


/* ---------------------------------------------------------
   LIGHT READABILITY OVERLAY
--------------------------------------------------------- */

.team-page .team-identity-vignette {
    position: fixed !important;

    inset: 0 !important;

    z-index: 1 !important;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            rgba(2, 5, 10, 0.28) 0%,
            rgba(2, 5, 10, 0.10) 42%,
            rgba(2, 5, 10, 0.02) 72%,
            rgba(2, 5, 10, 0.06) 100%
        ) !important;
}


/* KEEP PAGE CONTENT ABOVE BACKGROUND */

body.team-page > header,
body.team-page > main,
body.team-page > footer {
    position: relative;
    z-index: 2;
}


.team-page main {
    background: transparent !important;
}



/* =========================================================
   ZENITH BACKGROUND
========================================================= */

.zenith-page .team-identity-bg {
    background-image:
        linear-gradient(
            rgba(2, 8, 14, 0.05),
            rgba(2, 8, 14, 0.10)
        ),
        url("Zenith-Team-Background.webp") !important;
}


/* ZENITH HERO */

.zenith-page .team-page-hero {
    background:
        linear-gradient(
            90deg,
            rgba(2, 8, 14, 0.56) 0%,
            rgba(2, 8, 14, 0.34) 36%,
            rgba(2, 8, 14, 0.12) 66%,
            rgba(2, 8, 14, 0.02) 100%
        ) !important;
}


/* ZENITH ROSTER */

.zenith-page .team-roster-section {
    background:
        linear-gradient(
            180deg,
            rgba(3, 10, 16, 0.70),
            rgba(3, 10, 16, 0.60)
        ) !important;
}


/* ZENITH RESULTS */

.zenith-page .team-results-section {
    background:
        linear-gradient(
            180deg,
            rgba(3, 10, 16, 0.60),
            rgba(2, 8, 13, 0.70)
        ) !important;
}



/* =========================================================
   NOVA BACKGROUND
========================================================= */

.nova-page .team-identity-bg {
    background-image:
        linear-gradient(
            rgba(7, 3, 17, 0.04),
            rgba(7, 3, 17, 0.08)
        ),
        url("Nova-Team-Background.webp") !important;
}


/* NOVA HERO */

.nova-page .team-page-hero {
    background:
        linear-gradient(
            90deg,
            rgba(8, 3, 18, 0.54) 0%,
            rgba(10, 4, 24, 0.30) 36%,
            rgba(10, 4, 24, 0.10) 66%,
            rgba(10, 4, 24, 0.02) 100%
        ) !important;
}


/* NOVA ROSTER */

.nova-page .team-roster-section {
    background:
        linear-gradient(
            180deg,
            rgba(8, 5, 21, 0.68),
            rgba(8, 5, 21, 0.58)
        ) !important;
}


/* NOVA RESULTS */

.nova-page .team-results-section {
    background:
        linear-gradient(
            180deg,
            rgba(8, 5, 21, 0.58),
            rgba(6, 4, 17, 0.68)
        ) !important;
}



/* =========================================================
   KEEP EXISTING TEAM EMBLEMS
========================================================= */

.zenith-page .team-page-background-logo,
.nova-page .team-page-background-logo {
    display: block !important;
}



/* =========================================================
   SMALLER WINDOWS
========================================================= */

@media (max-width: 1100px) {

    .team-page .team-identity-bg {
        background-size: cover !important;
        background-position: center center !important;
    }

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

    .team-page .team-identity-bg {
        background-size: cover !important;
        background-position: center center !important;
    }

    .team-page .team-identity-vignette {
        background:
            rgba(2, 5, 10, 0.16) !important;
    }

}
/* =========================================================
   TEAM WATERMARKS — BRIGHTER
========================================================= */


/* ZENITH WATERMARK */

.zenith-page .team-page-background-logo {
    opacity: 0.22 !important;

    filter:
        brightness(1.22)
        contrast(1.08)
        saturate(1.18)
        drop-shadow(
            0 0 18px
            rgba(130, 230, 255, 0.20)
        )
        drop-shadow(
            0 0 42px
            rgba(72, 190, 235, 0.12)
        ) !important;

    animation: none !important;
}


/* NOVA WATERMARK */

.nova-page .team-page-background-logo {
    opacity: 0.21 !important;

    filter:
        brightness(1.20)
        contrast(1.08)
        saturate(1.32)
        drop-shadow(
            0 0 18px
            rgba(192, 145, 255, 0.20)
        )
        drop-shadow(
            0 0 42px
            rgba(133, 78, 230, 0.14)
        ) !important;

    animation: none !important;
}


/* MOBILE — slightly softer so it doesn't dominate */

@media (max-width: 700px) {

    .zenith-page .team-page-background-logo {
        opacity: 0.14 !important;
    }

    .nova-page .team-page-background-logo {
        opacity: 0.14 !important;
    }

}
/* =========================================================
   CRYONIX TEAM BACKGROUND MOTION
========================================================= */

.team-page {
    --team-bg-x: 0px;
    --team-bg-y: 0px;
}


/* =========================================================
   BACKGROUND PARALLAX
========================================================= */

.team-page .team-identity-bg {
    background-position:
        calc(50% + var(--team-bg-x))
        calc(50% + var(--team-bg-y)) !important;

    will-change:
        background-position,
        filter;
}


/* ZENITH — colder / more controlled */

.zenith-page .team-identity-bg {
    filter:
        brightness(1)
        saturate(1);

    animation:
        zenith-background-breathe
        14s
        ease-in-out
        infinite alternate !important;
}


@keyframes zenith-background-breathe {

    from {
        filter:
            brightness(1)
            saturate(1);
    }

    to {
        filter:
            brightness(1.035)
            saturate(1.05);
    }

}


/* NOVA — softer / more atmospheric */

.nova-page .team-identity-bg {
    filter:
        brightness(1)
        saturate(1.03);

    animation:
        nova-background-breathe
        18s
        ease-in-out
        infinite alternate !important;
}


@keyframes nova-background-breathe {

    from {
        filter:
            brightness(1)
            saturate(1.03);
    }

    to {
        filter:
            brightness(1.04)
            saturate(1.09);
    }

}



/* =========================================================
   LARGE TEAM WATERMARK MOTION
========================================================= */

/* Important:
   preserve the translateY(-50%) used to position the logo.
*/


.zenith-page .team-page-background-logo {
    animation:
        zenith-watermark-float
        9s
        ease-in-out
        infinite !important;

    will-change:
        transform,
        opacity,
        filter;
}


@keyframes zenith-watermark-float {

    0%,
    100% {
        transform:
            translateY(-50%)
            translate3d(0, 0, 0)
            rotate(2deg);

        opacity: 0.20;
    }

    50% {
        transform:
            translateY(-50%)
            translate3d(-5px, -4px, 0)
            rotate(2.3deg);

        opacity: 0.24;
    }

}



.nova-page .team-page-background-logo {
    animation:
        nova-watermark-float
        12s
        ease-in-out
        infinite !important;

    will-change:
        transform,
        opacity,
        filter;
}


@keyframes nova-watermark-float {

    0%,
    100% {
        transform:
            translateY(-50%)
            translate3d(0, 0, 0)
            rotate(2deg);

        opacity: 0.19;
    }

    50% {
        transform:
            translateY(-50%)
            translate3d(-7px, -5px, 0)
            rotate(1.5deg);

        opacity: 0.23;
    }

}



/* =========================================================
   MAIN TEAM EMBLEM
   Very small idle movement
========================================================= */

.zenith-page .team-page-main-logo {
    animation:
        zenith-main-logo-idle
        7s
        ease-in-out
        infinite;
}


@keyframes zenith-main-logo-idle {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-3px);
    }

}



.nova-page .team-page-main-logo {
    animation:
        nova-main-logo-idle
        9s
        ease-in-out
        infinite;
}


@keyframes nova-main-logo-idle {

    0%,
    100% {
        transform:
            translateY(0)
            rotate(0deg);
    }

    50% {
        transform:
            translateY(-4px)
            rotate(0.35deg);
    }

}



/* =========================================================
   MOBILE
   Less movement
========================================================= */

@media (max-width: 700px) {

    .team-page {
        --team-bg-x: 0px !important;
        --team-bg-y: 0px !important;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .team-page .team-identity-bg,
    .team-page .team-page-background-logo,
    .team-page .team-page-main-logo {
        animation: none !important;
    }

}
/* =========================================================
   LIVE TEAM ENVIRONMENT FX
========================================================= */

.team-page #team-identity-fx {
    display: block !important;

    position: fixed !important;
    inset: 0 !important;

    width: 100% !important;
    height: 100% !important;

    z-index: 1 !important;

    pointer-events: none !important;

    mix-blend-mode: screen;

    opacity: 0.90;
}


/* Zenith FX slightly sharper */

.zenith-page #team-identity-fx {
    opacity: 0.82;
}


/* Nova can be a little more luminous */

.nova-page #team-identity-fx {
    opacity: 0.95;
}


/* vignette sits above effects */

.team-page .team-identity-vignette {
    z-index: 2 !important;
}


/* actual page content */

body.team-page > header,
body.team-page > main,
body.team-page > footer {
    z-index: 3 !important;
}


/* MOBILE */

@media (max-width: 700px) {

    .zenith-page #team-identity-fx {
        opacity: 0.60;
    }

    .nova-page #team-identity-fx {
        opacity: 0.72;
    }

}
/* =========================================================
   LIVE TEAM FX STACKING
========================================================= */

.team-page .team-identity-bg {
    z-index: 0 !important;
}


/* Don't let MAIN hide the canvas */

body.team-page > main {
    position: relative !important;
    z-index: auto !important;
}


/* Sections also must not hide it */

.team-page .team-page-hero,
.team-page .team-roster-section,
.team-page .team-results-section {
    position: relative !important;
    z-index: auto !important;
}


/* =========================================================
   LIVE CANVAS
========================================================= */

.team-page #team-identity-fx {
    display: block !important;

    position: fixed !important;
    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;

    z-index: 2 !important;

    opacity: 1 !important;

    pointer-events: none !important;

    mix-blend-mode: screen;
}


/* =========================================================
   CONTENT ABOVE FX
========================================================= */

.team-page .team-page-hero-content,
.team-page .team-section-heading,
.team-page .roster-grid,
.team-page .team-competition-grid {
    position: relative !important;

    z-index: 3 !important;
}


/* =========================================================
   TEAM WATERMARK
========================================================= */

.team-page .team-page-background-logo {
    z-index: 1 !important;
}


/* =========================================================
   VIGNETTE
========================================================= */

.team-page .team-identity-vignette {
    z-index: 1 !important;
}


/* =========================================================
   HEADER / FOOTER
========================================================= */

body.team-page > header {
    position: sticky !important;

    z-index: 10000 !important;
}


body.team-page > footer {
    position: relative !important;

    z-index: 3 !important;
}
/* =========================================================
   ZENITH WATERMARK — STRONGER
========================================================= */

.zenith-page .team-page-background-logo {
    opacity: 0.36 !important;

    filter:
        brightness(1.45)
        contrast(1.14)
        saturate(1.22)
        drop-shadow(
            0 0 12px
            rgba(205, 248, 255, 0.38)
        )
        drop-shadow(
            0 0 30px
            rgba(90, 205, 255, 0.28)
        )
        drop-shadow(
            0 0 60px
            rgba(45, 145, 230, 0.18)
        ) !important;
}
/* =====================================================
   NEXUS
   CONNECTED ENERGY / NETWORK FIELD
===================================================== */

.nexus-page {
    background:
        linear-gradient(
            180deg,
            #020611 0%,
            #031021 48%,
            #030714 100%
        );
}


/* =====================================================
   NEXUS STATIC BACKGROUND ART
===================================================== */

.nexus-page .team-identity-bg {
    position: fixed !important;

    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;

    z-index: 0 !important;

    background:
        linear-gradient(
            90deg,
            rgba(2, 5, 15, 0.10) 0%,
            rgba(2, 7, 18, 0.02) 45%,
            rgba(3, 4, 16, 0.07) 100%
        ),
        url("Nexus-Team-Background.webp")
        center center /
        cover
        no-repeat !important;

    pointer-events: none;
}


/* =====================================================
   HERO OVERLAY

   Keeps text readable without hiding the Nexus artwork.
===================================================== */

.nexus-page .team-page-hero {
    background:
        linear-gradient(
            90deg,
            rgba(2, 6, 15, 0.72) 0%,
            rgba(3, 8, 19, 0.42) 40%,
            rgba(5, 8, 23, 0.12) 72%,
            rgba(5, 5, 18, 0.05) 100%
        ) !important;
}


/* =====================================================
   NEXUS BACKGROUND WATERMARK
===================================================== */

.nexus-page .team-page-background-logo {
    width: 750px;

    right: -105px;

    opacity: 0.20;

    filter:
        brightness(1.15)
        contrast(1.08)
        saturate(1.30)
        drop-shadow(
            0 0 14px
            rgba(189, 226, 255, 0.18)
        )
        drop-shadow(
            0 0 32px
            rgba(57, 164, 255, 0.18)
        )
        drop-shadow(
            0 0 58px
            rgba(117, 72, 255, 0.16)
        );
}


/* =====================================================
   NEXUS MAIN LOGO
===================================================== */

.nexus-page .team-page-main-logo {
    filter:
        brightness(1.12)
        contrast(1.08)
        saturate(1.20)
        drop-shadow(
            0 0 8px
            rgba(230, 248, 255, 0.22)
        )
        drop-shadow(
            0 0 20px
            rgba(67, 181, 255, 0.20)
        )
        drop-shadow(
            0 0 34px
            rgba(118, 78, 255, 0.16)
        );
}


/* =====================================================
   NEXUS META COLOURS
===================================================== */

.nexus-page .team-page-number,
.nexus-page .team-page-type {
    color: #73d8ff;
}


.nexus-page .team-page-line {
    background:
        linear-gradient(
            90deg,
            rgba(84, 204, 255, 0.72),
            rgba(118, 87, 255, 0.34),
            transparent
        );
}


.nexus-page .team-page-status {
    color: #d7f6ff;

    background:
        rgba(50, 155, 255, 0.075);

    border-color:
        rgba(89, 201, 255, 0.32);
}


/* =====================================================
   NEXUS STATEMENT
===================================================== */

.nexus-page .nexus-statement {
    background:
        linear-gradient(
            90deg,
            rgba(37, 157, 255, 0.09),
            rgba(111, 68, 255, 0.045),
            rgba(37, 157, 255, 0.01)
        );

    border-left-color:
        #62d7ff;

    border-top-color:
        rgba(88, 202, 255, 0.16);

    border-bottom-color:
        rgba(112, 86, 255, 0.14);
}


.nexus-page .nexus-statement span {
    color: #69d9ff;
}


/* =====================================================
   NEXUS QUICK INFO
===================================================== */

.nexus-page .team-page-info {
    border-color:
        rgba(81, 189, 255, 0.14);

    background:
        linear-gradient(
            90deg,
            rgba(5, 20, 39, 0.28),
            rgba(22, 13, 58, 0.14)
        );
}


.nexus-page .team-page-info-item {
    border-color:
        rgba(93, 185, 255, 0.12);
}


/* =====================================================
   ROSTER + RESULTS BACKGROUND

   Transparent enough that the Nexus network artwork
   continues through the entire page.
===================================================== */

.nexus-page .team-roster-section {
    background:
        linear-gradient(
            180deg,
            rgba(3, 9, 22, 0.45),
            rgba(4, 10, 25, 0.58)
        ) !important;
}


.nexus-page .team-results-section {
    background:
        linear-gradient(
            180deg,
            rgba(4, 9, 24, 0.55),
            rgba(3, 6, 18, 0.68)
        ) !important;
}


/* =====================================================
   SECTION DIVIDERS
===================================================== */

.nexus-page .team-roster-section::before,
.nexus-page .team-results-section::before {
    content: "";

    position: absolute;

    top: 0;
    left: 8%;
    right: 8%;

    height: 1px;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(83, 205, 255, 0.34) 24%,
            rgba(116, 82, 255, 0.26) 55%,
            rgba(73, 181, 255, 0.18) 78%,
            transparent
        );

    box-shadow:
        0 0 18px
        rgba(67, 177, 255, 0.13);
}


/* =====================================================
   NEXUS ROSTER CARDS
===================================================== */

.nexus-page .roster-card {
    border-color:
        rgba(80, 184, 255, 0.17);

    background:
        linear-gradient(
            145deg,
            rgba(7, 19, 39, 0.72),
            rgba(10, 10, 35, 0.67)
        );

    box-shadow:
        inset 0 0 30px
        rgba(67, 178, 255, 0.025);
}


.nexus-page .roster-card::before {
    background:
        linear-gradient(
            90deg,
            #59d1ff,
            #6758ff,
            transparent
        );
}


.nexus-page .roster-card:hover {
    border-color:
        rgba(105, 211, 255, 0.32);

    box-shadow:
        0 16px 45px
        rgba(23, 95, 185, 0.12),
        0 0 28px
        rgba(89, 75, 255, 0.06);
}


.nexus-page .roster-card-number {
    color:
        rgba(108, 211, 255, 0.48);
}


.nexus-page .roster-card-team {
    color:
        #65d4ff;
}


/* =====================================================
   COMPETITION CARDS
===================================================== */

.nexus-page .competition-card {
    border-color:
        rgba(82, 187, 255, 0.16);

    background:
        linear-gradient(
            145deg,
            rgba(7, 18, 38, 0.70),
            rgba(12, 10, 38, 0.62)
        );
}


.nexus-page .competition-card:hover {
    border-color:
        rgba(107, 211, 255, 0.30);
}


.nexus-page .competition-label {
    color:
        #64d4ff;
}


/* =====================================================
   BACK LINK
===================================================== */

.nexus-page .team-page-back {
    color:
        #85dcff;
}


.nexus-page .team-page-back:hover {
    color:
        #ffffff;
}


/* =====================================================
   VIGNETTE
===================================================== */

.nexus-page .team-identity-vignette {
    background:

        linear-gradient(
            180deg,
            rgba(1, 4, 12, 0.06) 0%,
            transparent 20%,
            transparent 72%,
            rgba(1, 3, 11, 0.24) 100%
        ),

        radial-gradient(
            ellipse at center,
            transparent 55%,
            rgba(0, 3, 13, 0.19) 100%
        );
}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 700px) {

    .nexus-page .team-identity-bg {
        background-position:
            center center !important;
    }


    .nexus-page .team-page-background-logo {
        opacity:
            0.13 !important;

        filter:
            brightness(1.15)
            saturate(1.22)
            drop-shadow(
                0 0 24px
                rgba(74, 188, 255, 0.14)
            );
    }

}
/* =========================================================
   NEXUS — INTERACTIVE NETWORK ENVIRONMENT
========================================================= */

.nexus-page {
    background:
        #040711;
}


/* =========================================================
   NEXUS BACKGROUND ART
========================================================= */

.nexus-page .team-identity-bg {
    position:
        fixed !important;

    inset:
        -2% !important;

    width:
        104vw !important;

    height:
        104vh !important;

    z-index:
        0 !important;

    background-image:

        radial-gradient(
            circle at 50% 46%,
            rgba(215, 224, 238, 0.015),
            transparent 38%
        ),

        linear-gradient(
            180deg,
            rgba(3, 6, 14, 0.12),
            rgba(3, 6, 14, 0.18)
        ),

        url("Nexus-Team-Background.webp") !important;

    background-size:
        cover !important;

    background-position:
        center center !important;

    background-repeat:
        no-repeat !important;

    transform:
        translate3d(
            var(
                --nexus-bg-x,
                0px
            ),
            var(
                --nexus-bg-y,
                0px
            ),
            0
        )
        scale(1.035);

    transform-origin:
        center center;

    will-change:
        transform;

    pointer-events:
        none;
}


/* =========================================================
   INTERACTIVE NETWORK CANVAS
========================================================= */

.nexus-page #team-identity-fx {
    display:
        block !important;

    position:
        fixed !important;

    inset:
        0 !important;

    width:
        100vw !important;

    height:
        100vh !important;

    z-index:
        2 !important;

    opacity:
        0.92 !important;

    mix-blend-mode:
        screen;

    pointer-events:
        none !important;
}


/* =========================================================
   VIGNETTE

   Keeps the network from competing with text.
========================================================= */

.nexus-page .team-identity-vignette {
    background:

        linear-gradient(
            90deg,
            rgba(2, 5, 13, 0.28) 0%,
            rgba(2, 5, 13, 0.10) 35%,
            rgba(2, 5, 13, 0.02) 64%,
            rgba(2, 5, 13, 0.09) 100%
        ),

        linear-gradient(
            180deg,
            rgba(2, 5, 13, 0.08) 0%,
            transparent 24%,
            transparent 72%,
            rgba(2, 5, 13, 0.30) 100%
        ),

        radial-gradient(
            ellipse at center,
            transparent 54%,
            rgba(0, 3, 11, 0.20) 100%
        ) !important;
}


/* =========================================================
   NEXUS CONTENT STILL SITS ABOVE THE NETWORK
========================================================= */

.nexus-page .team-page-hero-content,
.nexus-page .team-section-heading,
.nexus-page .roster-grid,
.nexus-page .team-competition-grid {
    position:
        relative !important;

    z-index:
        3 !important;
}


/* =========================================================
   HERO — KEEP IMAGE VISIBLE
========================================================= */

.nexus-page .team-page-hero {
    background:

        linear-gradient(
            90deg,
            rgba(3, 7, 16, 0.66) 0%,
            rgba(4, 8, 18, 0.40) 38%,
            rgba(4, 8, 18, 0.12) 68%,
            rgba(4, 8, 18, 0.03) 100%
        ) !important;
}


/* =========================================================
   ROSTER / RESULTS

   Transparent enough for the network to continue through.
========================================================= */

.nexus-page .team-roster-section {
    background:

        linear-gradient(
            180deg,
            rgba(5, 8, 17, 0.51),
            rgba(5, 8, 17, 0.62)
        ) !important;
}


.nexus-page .team-results-section {
    background:

        linear-gradient(
            180deg,
            rgba(5, 8, 17, 0.58),
            rgba(4, 7, 15, 0.70)
        ) !important;
}


/* =========================================================
   SECTION EDGE
========================================================= */

.nexus-page .team-roster-section::before,
.nexus-page .team-results-section::before {
    content:
        "";

    position:
        absolute;

    top:
        0;

    left:
        8%;

    right:
        8%;

    height:
        1px;

    pointer-events:
        none;

    background:

        linear-gradient(
            90deg,
            transparent,
            rgba(218, 227, 240, 0.22) 22%,
            rgba(77, 168, 255, 0.13) 52%,
            rgba(118, 93, 255, 0.12) 76%,
            transparent
        );

    box-shadow:
        0 0 18px
        rgba(77, 168, 255, 0.06);
}


/* =========================================================
   MOBILE
========================================================= */

@media (
    max-width: 700px
) {

    .nexus-page .team-identity-bg {
        inset:
            -3% !important;

        width:
            106vw !important;

        height:
            106vh !important;

        transform:
            translate3d(
                var(
                    --nexus-bg-x,
                    0px
                ),
                var(
                    --nexus-bg-y,
                    0px
                ),
                0
            )
            scale(1.05);
    }


    .nexus-page #team-identity-fx {
        opacity:
            0.76 !important;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (
    prefers-reduced-motion:
    reduce
) {

    .nexus-page .team-identity-bg {
        transform:
            scale(1.035) !important;
    }

}
/* =========================================================
   NEXUS — SIGNAL NETWORK FINAL TUNING
========================================================= */


/* =========================================================
   BACKGROUND PARALLAX
========================================================= */

.nexus-page .team-identity-bg {
    inset:
        -2.5% !important;

    width:
        105vw !important;

    height:
        105vh !important;

    background-image:

        linear-gradient(
            180deg,
            rgba(3, 6, 14, 0.05),
            rgba(3, 6, 14, 0.10)
        ),

        url("Nexus-Team-Background.webp") !important;

    background-size:
        cover !important;

    background-position:
        center center !important;

    background-repeat:
        no-repeat !important;

    transform:
        translate3d(
            var(
                --nexus-bg-x,
                0px
            ),
            var(
                --nexus-bg-y,
                0px
            ),
            0
        )
        scale(1.045);

    transform-origin:
        center center;

    will-change:
        transform;
}


/* =========================================================
   SIGNAL CANVAS
========================================================= */

.nexus-page #team-identity-fx {
    display:
        block !important;

    position:
        fixed !important;

    inset:
        0 !important;

    width:
        100vw !important;

    height:
        100vh !important;

    z-index:
        2 !important;

    opacity:
        0.74 !important;

    pointer-events:
        none !important;

    mix-blend-mode:
        screen;
}


/* =========================================================
   DARKEN TEXT SIDE SLIGHTLY

   This prevents the signal paths from competing with
   the Nexus copy.
========================================================= */

.nexus-page .team-identity-vignette {
    background:

        linear-gradient(
            90deg,
            rgba(2, 5, 13, 0.33) 0%,
            rgba(2, 5, 13, 0.18) 33%,
            rgba(2, 5, 13, 0.04) 59%,
            rgba(2, 5, 13, 0.06) 100%
        ),

        linear-gradient(
            180deg,
            rgba(2, 5, 13, 0.09) 0%,
            transparent 23%,
            transparent 72%,
            rgba(2, 5, 13, 0.27) 100%
        ),

        radial-gradient(
            ellipse at center,
            transparent 57%,
            rgba(0, 3, 11, 0.17) 100%
        ) !important;
}


/* =========================================================
   HERO
========================================================= */

.nexus-page .team-page-hero {
    background:

        linear-gradient(
            90deg,
            rgba(3, 7, 16, 0.61) 0%,
            rgba(4, 8, 18, 0.34) 39%,
            rgba(4, 8, 18, 0.08) 68%,
            rgba(4, 8, 18, 0.02) 100%
        ) !important;
}


/* =========================================================
   LOWER SECTIONS

   Keep enough transparency that signals can travel
   behind the content.
========================================================= */

.nexus-page .team-roster-section {
    background:

        linear-gradient(
            180deg,
            rgba(5, 8, 17, 0.42),
            rgba(5, 8, 17, 0.55)
        ) !important;
}


.nexus-page .team-results-section {
    background:

        linear-gradient(
            180deg,
            rgba(5, 8, 17, 0.50),
            rgba(4, 7, 15, 0.62)
        ) !important;
}


/* =========================================================
   CONTENT ABOVE SIGNALS
========================================================= */

.nexus-page .team-page-hero-content,
.nexus-page .team-section-heading,
.nexus-page .roster-grid,
.nexus-page .team-competition-grid {
    position:
        relative !important;

    z-index:
        3 !important;
}


/* =========================================================
   SECTION DIVIDERS

   Silver -> CRX blue -> CRX violet
========================================================= */

.nexus-page .team-roster-section::before,
.nexus-page .team-results-section::before {
    content:
        "";

    position:
        absolute;

    top:
        0;

    left:
        8%;

    right:
        8%;

    height:
        1px;

    pointer-events:
        none;

    background:

        linear-gradient(
            90deg,
            transparent,
            rgba(210, 220, 234, 0.22) 24%,
            rgba(77, 168, 255, 0.14) 52%,
            rgba(118, 93, 255, 0.12) 75%,
            transparent
        );

    box-shadow:
        0 0 16px
        rgba(77, 168, 255, 0.055);
}


/* =========================================================
   MOBILE
========================================================= */

@media (
    max-width: 700px
) {

    .nexus-page #team-identity-fx {
        opacity:
            0.62 !important;
    }


    .nexus-page .team-identity-bg {
        inset:
            -3% !important;

        width:
            106vw !important;

        height:
            106vh !important;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (
    prefers-reduced-motion:
    reduce
) {

    .nexus-page .team-identity-bg {
        transform:
            scale(1.045) !important;
    }


    .nexus-page #team-identity-fx {
        opacity:
            0.48 !important;
    }

}
/* =========================================================
   NEXUS — FINAL INTERACTIVE ENVIRONMENT
========================================================= */


/* =========================================================
   BACKGROUND ART PARALLAX
========================================================= */

.nexus-page .team-identity-bg {
    inset:
        -4% !important;

    width:
        108vw !important;

    height:
        108vh !important;

    background-image:

        linear-gradient(
            180deg,
            rgba(3, 6, 14, 0.035),
            rgba(3, 6, 14, 0.07)
        ),

        url("Nexus-Team-Background.webp") !important;

    background-size:
        cover !important;

    background-position:
        center center !important;

    background-repeat:
        no-repeat !important;

    transform:
        translate3d(
            var(
                --nexus-bg-x,
                0px
            ),
            var(
                --nexus-bg-y,
                0px
            ),
            0
        )
        scale(1.065);

    transform-origin:
        center center;

    will-change:
        transform;
}


/* =========================================================
   INTERACTIVE NETWORK
========================================================= */

.nexus-page #team-identity-fx {
    display:
        block !important;

    position:
        fixed !important;

    inset:
        0 !important;

    width:
        100vw !important;

    height:
        100vh !important;

    z-index:
        2 !important;

    opacity:
        0.80 !important;

    pointer-events:
        none !important;

    mix-blend-mode:
        screen;
}


/* =========================================================
   NEXUS LARGE WATERMARK

   PARALLAX + BREATHING
========================================================= */

.nexus-page .team-page-background-logo {
    transform:
        translate3d(
            var(
                --nexus-logo-x,
                0px
            ),
            var(
                --nexus-logo-y,
                0px
            ),
            0
        )
        scale(
            var(
                --nexus-breathe-scale,
                1
            )
        );

    transform-origin:
        center center;

    animation:
        nexus-emblem-breathe
        8.5s
        ease-in-out
        infinite !important;

    will-change:
        transform,
        opacity,
        filter;
}


/* =========================================================
   NEXUS BREATHING

   Similar family behaviour to Zenith / Nova but
   slightly more controlled and metallic.
========================================================= */

@keyframes nexus-emblem-breathe {

    0%,
    100% {

        opacity:
            0.15;

        filter:
            brightness(1.02)
            contrast(1.06)
            saturate(0.98)

            drop-shadow(
                0 0 14px
                rgba(
                    210,
                    221,
                    236,
                    0.10
                )
            )

            drop-shadow(
                0 0 28px
                rgba(
                    77,
                    168,
                    255,
                    0.10
                )
            )

            drop-shadow(
                0 0 46px
                rgba(
                    118,
                    93,
                    255,
                    0.075
                )
            );

    }


    50% {

        opacity:
            0.22;

        filter:
            brightness(1.16)
            contrast(1.08)
            saturate(1.08)

            drop-shadow(
                0 0 18px
                rgba(
                    222,
                    231,
                    244,
                    0.16
                )
            )

            drop-shadow(
                0 0 38px
                rgba(
                    77,
                    168,
                    255,
                    0.17
                )
            )

            drop-shadow(
                0 0 58px
                rgba(
                    118,
                    93,
                    255,
                    0.12
                )
            );

    }

}


/* =========================================================
   MAIN NEXUS LOGO SUBTLE BREATHING TOO
========================================================= */

.nexus-page .team-page-main-logo {
    animation:
        nexus-main-logo-breathe
        7.5s
        ease-in-out
        infinite;
}


@keyframes nexus-main-logo-breathe {

    0%,
    100% {

        filter:
            brightness(1.04)
            contrast(1.06)
            saturate(1.05)

            drop-shadow(
                0 0 10px
                rgba(
                    216,
                    227,
                    241,
                    0.13
                )
            )

            drop-shadow(
                0 0 22px
                rgba(
                    77,
                    168,
                    255,
                    0.13
                )
            )

            drop-shadow(
                0 0 34px
                rgba(
                    118,
                    93,
                    255,
                    0.09
                )
            );

    }


    50% {

        filter:
            brightness(1.17)
            contrast(1.08)
            saturate(1.12)

            drop-shadow(
                0 0 14px
                rgba(
                    224,
                    233,
                    245,
                    0.20
                )
            )

            drop-shadow(
                0 0 30px
                rgba(
                    77,
                    168,
                    255,
                    0.20
                )
            )

            drop-shadow(
                0 0 44px
                rgba(
                    118,
                    93,
                    255,
                    0.14
                )
            );

    }

}


/* =========================================================
   VIGNETTE
========================================================= */

.nexus-page .team-identity-vignette {
    background:

        linear-gradient(
            90deg,
            rgba(
                2,
                5,
                13,
                0.30
            )
            0%,

            rgba(
                2,
                5,
                13,
                0.14
            )
            33%,

            rgba(
                2,
                5,
                13,
                0.025
            )
            61%,

            rgba(
                2,
                5,
                13,
                0.06
            )
            100%
        ),

        linear-gradient(
            180deg,
            rgba(
                2,
                5,
                13,
                0.07
            )
            0%,

            transparent
            22%,

            transparent
            75%,

            rgba(
                2,
                5,
                13,
                0.24
            )
            100%
        ),

        radial-gradient(
            ellipse at center,
            transparent
            58%,

            rgba(
                0,
                3,
                11,
                0.15
            )
            100%
        ) !important;
}


/* =========================================================
   HERO
========================================================= */

.nexus-page .team-page-hero {
    background:

        linear-gradient(
            90deg,

            rgba(
                3,
                7,
                16,
                0.56
            )
            0%,

            rgba(
                4,
                8,
                18,
                0.29
            )
            39%,

            rgba(
                4,
                8,
                18,
                0.055
            )
            69%,

            rgba(
                4,
                8,
                18,
                0.015
            )
            100%

        ) !important;
}


/* =========================================================
   LOWER PAGE

   Less opaque than before so the interactive system
   remains visible all the way down the page.
========================================================= */

.nexus-page .team-roster-section {
    background:

        linear-gradient(
            180deg,
            rgba(
                5,
                8,
                17,
                0.32
            ),
            rgba(
                5,
                8,
                17,
                0.43
            )
        ) !important;
}


.nexus-page .team-results-section {
    background:

        linear-gradient(
            180deg,
            rgba(
                5,
                8,
                17,
                0.37
            ),
            rgba(
                4,
                7,
                15,
                0.49
            )
        ) !important;
}


/* =========================================================
   CONTENT LAYER
========================================================= */

.nexus-page .team-page-hero-content,
.nexus-page .team-section-heading,
.nexus-page .roster-grid,
.nexus-page .team-competition-grid {
    position:
        relative !important;

    z-index:
        3 !important;
}


/* =========================================================
   SECTION DIVIDERS
========================================================= */

.nexus-page .team-roster-section::before,
.nexus-page .team-results-section::before {
    content:
        "";

    position:
        absolute;

    top:
        0;

    left:
        7%;

    right:
        7%;

    height:
        1px;

    pointer-events:
        none;

    background:

        linear-gradient(
            90deg,

            transparent,

            rgba(
                214,
                224,
                238,
                0.22
            )
            21%,

            rgba(
                77,
                168,
                255,
                0.15
            )
            51%,

            rgba(
                118,
                93,
                255,
                0.13
            )
            76%,

            transparent
        );

    box-shadow:
        0 0 18px
        rgba(
            77,
            168,
            255,
            0.06
        );
}


/* =========================================================
   MOBILE
========================================================= */

@media (
    max-width: 700px
) {

    .nexus-page .team-identity-bg {

        inset:
            -5% !important;

        width:
            110vw !important;

        height:
            110vh !important;

    }


    .nexus-page #team-identity-fx {

        opacity:
            0.67 !important;

    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (
    prefers-reduced-motion:
    reduce
) {

    .nexus-page .team-identity-bg {

        transform:
            scale(1.065) !important;

    }


    .nexus-page .team-page-background-logo,
    .nexus-page .team-page-main-logo {

        animation:
            none !important;

    }


    .nexus-page #team-identity-fx {

        opacity:
            0.50 !important;

    }

}
/* =========================================================
   NEXUS — CLEANER NETWORK BALANCE
========================================================= */

.nexus-page #team-identity-fx {
    opacity:
        0.62 !important;
}


/* Let the original Nexus art stay dominant */

.nexus-page .team-roster-section {
    background:
        linear-gradient(
            180deg,
            rgba(5, 8, 17, 0.29),
            rgba(5, 8, 17, 0.40)
        ) !important;
}


.nexus-page .team-results-section {
    background:
        linear-gradient(
            180deg,
            rgba(5, 8, 17, 0.34),
            rgba(4, 7, 15, 0.45)
        ) !important;
}


/* Slightly calmer on mobile */

@media (max-width: 700px) {

    .nexus-page #team-identity-fx {
        opacity:
            0.52 !important;
    }

}
/* =========================================================
   NEXUS — BACKGROUND-TRACED NETWORK ALIGNMENT
========================================================= */

.nexus-page .team-identity-bg {
    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;

    background-image:
        linear-gradient(
            180deg,
            rgba(3, 6, 14, 0.025),
            rgba(3, 6, 14, 0.055)
        ),
        url("Nexus-Team-Background.webp") !important;

    background-size:
        cover !important;

    background-position:
        center center !important;

    background-repeat:
        no-repeat !important;

    transform:
        translate3d(
            var(--nexus-bg-x, 0px),
            var(--nexus-bg-y, 0px),
            0
        )
        scale(1.045) !important;

    transform-origin:
        center center !important;

    will-change:
        transform;
}


/* Animation is now DETAIL, not a second network */

.nexus-page #team-identity-fx {
    opacity:
        0.78 !important;

    mix-blend-mode:
        screen;
}


/* Keep main watermark parallax */

.nexus-page .team-page-background-logo {
    transform:
        translate3d(
            var(--nexus-logo-x, 0px),
            var(--nexus-logo-y, 0px),
            0
        );

    animation:
        nexus-emblem-breathe
        8.5s
        ease-in-out
        infinite !important;
}


/* Mobile */

@media (max-width: 700px) {

    .nexus-page #team-identity-fx {
        opacity:
            0.66 !important;
    }

}
/* =========================================================
   NEXUS — EXACT BACKGROUND / SIGNAL ALIGNMENT

   The background receives a small overscan so mouse
   parallax never exposes an empty edge.

   IMPORTANT:
   No additional CSS scale is used.
   nexus-effects.js reads this element's real dimensions.
========================================================= */


/* =========================================================
   BACKGROUND
========================================================= */

.nexus-page .team-identity-bg {

    position:
        fixed !important;


    top:
        -2.5vh !important;

    left:
        -2.5vw !important;


    right:
        auto !important;

    bottom:
        auto !important;


    width:
        105vw !important;

    height:
        105vh !important;


    z-index:
        0 !important;


    background-image:

        linear-gradient(
            180deg,
            rgba(3, 6, 14, 0.025),
            rgba(3, 6, 14, 0.055)
        ),

        url("Nexus-Team-Background.webp") !important;


    background-size:
        cover !important;


    background-position:
        center center !important;


    background-repeat:
        no-repeat !important;


    transform:
        translate3d(
            var(
                --nexus-bg-x,
                0px
            ),
            var(
                --nexus-bg-y,
                0px
            ),
            0
        ) !important;


    transform-origin:
        center center !important;


    will-change:
        transform;


    pointer-events:
        none !important;

}



/* =========================================================
   SIGNAL CANVAS

   The WebP stays dominant.
========================================================= */

.nexus-page #team-identity-fx {

    display:
        block !important;


    position:
        fixed !important;


    inset:
        0 !important;


    width:
        100vw !important;

    height:
        100vh !important;


    z-index:
        2 !important;


    opacity:
        0.86 !important;


    mix-blend-mode:
        screen;


    pointer-events:
        none !important;

}



/* =========================================================
   LARGE NEXUS WATERMARK PARALLAX + BREATHING
========================================================= */

.nexus-page .team-page-background-logo {

    transform:
        translate3d(
            var(
                --nexus-logo-x,
                0px
            ),
            var(
                --nexus-logo-y,
                0px
            ),
            0
        );


    animation:
        nexus-emblem-breathe
        8.5s
        ease-in-out
        infinite !important;


    transform-origin:
        center center;


    will-change:
        transform,
        opacity,
        filter;

}



/* =========================================================
   KEEP THE BACKGROUND VISIBLE THROUGH PAGE SECTIONS
========================================================= */

.nexus-page .team-roster-section {

    background:

        linear-gradient(
            180deg,
            rgba(5, 8, 17, 0.30),
            rgba(5, 8, 17, 0.41)
        ) !important;

}


.nexus-page .team-results-section {

    background:

        linear-gradient(
            180deg,
            rgba(5, 8, 17, 0.35),
            rgba(4, 7, 15, 0.46)
        ) !important;

}



/* =========================================================
   CONTENT ABOVE EFFECTS
========================================================= */

.nexus-page .team-page-hero-content,
.nexus-page .team-section-heading,
.nexus-page .roster-grid,
.nexus-page .team-competition-grid {

    position:
        relative !important;


    z-index:
        3 !important;

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

    .nexus-page .team-identity-bg {

        top:
            -3vh !important;

        left:
            -3vw !important;


        width:
            106vw !important;

        height:
            106vh !important;

    }


    .nexus-page #team-identity-fx {

        opacity:
            0.72 !important;

    }

}



/* =========================================================
   REDUCED MOTION
========================================================= */

@media (
    prefers-reduced-motion:
    reduce
) {

    .nexus-page .team-identity-bg {

        transform:
            none !important;

    }


    .nexus-page #team-identity-fx {

        opacity:
            0.55 !important;

    }

}
/* =========================================================
   NEXUS — FINAL CANVAS COLOUR RENDERING

   IMPORTANT:
   Normal blend mode preserves the platinum circuitry.
========================================================= */

.nexus-page #team-identity-fx {
    display: block !important;

    position: fixed !important;

    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;

    z-index: 2 !important;

    opacity: 1 !important;

    pointer-events: none !important;

    mix-blend-mode: normal !important;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

    .nexus-page #team-identity-fx {
        opacity: 0.90 !important;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .nexus-page #team-identity-fx {
        opacity: 0.70 !important;
    }

}
/* =========================================================
   TEAM PAGE TEXT READABILITY
   Zenith / Nova / Nexus

   Keeps the artwork visible while making all text readable.
========================================================= */


/* =========================================================
   BASE HERO STACKING
========================================================= */

.team-page .team-page-hero {
    position: relative !important;
    isolation: isolate;
}


/*
    Readability wash sits:
    ABOVE background artwork
    BELOW actual page content
*/

.team-page .team-page-hero::after {
    content: "";
    position: absolute;
    inset: 0;

    pointer-events: none;

    z-index: 2;

    opacity: 1;
}


/* Keep actual content above the wash */

.team-page .team-page-hero-content {
    position: relative !important;
    z-index: 3 !important;
}



/* =========================================================
   GLOBAL TEAM TEXT
========================================================= */


/*
    Normal paragraph/body copy
*/

.team-page .team-page-hero-content p {
    color: rgba(220, 229, 238, 0.82) !important;

    text-shadow:
        0 1px 2px rgba(0, 0, 0, 0.95),
        0 2px 8px rgba(0, 0, 0, 0.72),
        0 0 18px rgba(0, 0, 0, 0.42);
}


/*
    Small region line under team name
*/

.team-page .team-page-region {
    color: rgba(196, 211, 223, 0.76) !important;

    text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.95),
        0 0 12px rgba(0, 0, 0, 0.62);
}


/*
    Main team title
*/

.team-page .team-page-title {
    color: #ffffff !important;

    text-shadow:
        0 2px 4px rgba(0, 0, 0, 0.78),
        0 0 18px rgba(0, 0, 0, 0.26);
}


/*
    Small labels such as:
    MAIN COMPETITIVE ROSTER
    DEVELOPMENT ROSTER
    COMPETITIVE ROSTER
*/

.team-page .team-page-type,
.team-page .team-page-number {
    text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.95),
        0 0 12px rgba(0, 0, 0, 0.70);
}


/*
    Active tag
*/

.team-page .team-page-status {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.92);
}



/* =========================================================
   INFO / STATEMENT AREAS
========================================================= */

.team-page .team-page-info {
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}


.team-page .team-page-info-item strong,
.team-page .team-page-info-item span,
.team-page .team-page-info-item p {
    text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.90);
}


.team-page .nexus-statement,
.team-page .nova-statement,
.team-page .zenith-statement {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}


.team-page .nexus-statement,
.team-page .nova-statement,
.team-page .zenith-statement,
.team-page .nexus-statement *,
.team-page .nova-statement *,
.team-page .zenith-statement * {
    text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.92),
        0 0 10px rgba(0, 0, 0, 0.42);
}



/* =========================================================
   ZENITH
   Brightest background, so this needs the strongest wash.
========================================================= */

.zenith-page .team-page-hero::after {
    background:

        /*
            Main left-side readability field
        */

        radial-gradient(
            ellipse 74% 92% at 20% 48%,
            rgba(1, 11, 20, 0.80) 0%,
            rgba(1, 13, 24, 0.68) 38%,
            rgba(1, 14, 25, 0.40) 61%,
            rgba(1, 12, 22, 0.10) 78%,
            transparent 100%
        ),

        /*
            Bottom protection against bright ice
        */

        linear-gradient(
            180deg,
            rgba(0, 5, 10, 0.05) 0%,
            rgba(0, 7, 13, 0.12) 52%,
            rgba(0, 8, 15, 0.32) 100%
        );
}


/*
    Zenith body text needs to be a little brighter
    because the ice has so many pale values.
*/

.zenith-page .team-page-hero-content p {
    color: rgba(222, 235, 242, 0.88) !important;

    text-shadow:
        0 1px 2px rgba(0, 0, 0, 1),
        0 2px 7px rgba(0, 0, 0, 0.90),
        0 0 18px rgba(0, 5, 12, 0.82);
}


.zenith-page .team-page-region {
    color: rgba(201, 220, 230, 0.82) !important;
}


.zenith-page .team-page-type,
.zenith-page .team-page-number {
    color: #a9efff !important;
}



/* =========================================================
   NOVA
   Naturally dark background, so preserve more of the artwork.
========================================================= */

.nova-page .team-page-hero::after {
    background:

        radial-gradient(
            ellipse 72% 96% at 20% 48%,
            rgba(8, 5, 24, 0.60) 0%,
            rgba(8, 5, 25, 0.46) 40%,
            rgba(10, 6, 28, 0.22) 66%,
            transparent 88%
        ),

        linear-gradient(
            180deg,
            rgba(5, 3, 18, 0.02) 0%,
            rgba(5, 3, 18, 0.08) 58%,
            rgba(5, 3, 18, 0.18) 100%
        );
}


.nova-page .team-page-hero-content p {
    color: rgba(224, 220, 236, 0.84) !important;

    text-shadow:
        0 1px 2px rgba(0, 0, 0, 0.95),
        0 2px 7px rgba(0, 0, 0, 0.74),
        0 0 16px rgba(11, 5, 29, 0.62);
}


.nova-page .team-page-region {
    color: rgba(207, 201, 222, 0.80) !important;
}


.nova-page .team-page-type,
.nova-page .team-page-number {
    color: #c4a9ff !important;
}



/* =========================================================
   NEXUS
   Protect text from bright blue/violet energy ribbons
   without killing the interactive background.
========================================================= */

.nexus-page .team-page-hero::after {
    background:

        /*
            Text zone
        */

        radial-gradient(
            ellipse 75% 96% at 20% 46%,
            rgba(1, 8, 19, 0.72) 0%,
            rgba(2, 10, 23, 0.57) 39%,
            rgba(2, 10, 24, 0.31) 64%,
            rgba(2, 9, 22, 0.08) 82%,
            transparent 100%
        ),

        /*
            Darkens the horizon just enough so body copy
            doesn't disappear into the bright Nexus hub.
        */

        linear-gradient(
            180deg,
            transparent 0%,
            rgba(1, 7, 17, 0.03) 42%,
            rgba(1, 7, 17, 0.18) 62%,
            rgba(1, 7, 17, 0.26) 100%
        );
}


.nexus-page .team-page-hero-content p {
    color: rgba(219, 229, 238, 0.87) !important;

    text-shadow:
        0 1px 2px rgba(0, 0, 0, 1),
        0 2px 7px rgba(0, 0, 0, 0.82),
        0 0 18px rgba(1, 5, 16, 0.74);
}


.nexus-page .team-page-region {
    color: rgba(199, 215, 227, 0.80) !important;
}


.nexus-page .team-page-type,
.nexus-page .team-page-number {
    color: #77ddff !important;
}



/* =========================================================
   LARGE TEAM TITLES
   Extra crispness on every environment
========================================================= */

.zenith-page .team-page-title,
.nova-page .team-page-title,
.nexus-page .team-page-title {
    color: #ffffff !important;

    -webkit-font-smoothing: antialiased;

    text-rendering: geometricPrecision;

    text-shadow:
        0 2px 3px rgba(0, 0, 0, 0.76),
        0 5px 18px rgba(0, 0, 0, 0.26);
}



/* =========================================================
   SMALL UI LABELS
========================================================= */

.team-page .team-page-info-item span,
.team-page .team-page-info-item small,
.team-page .team-page-info-item label {
    color: rgba(165, 185, 200, 0.82) !important;
}


.team-page .team-page-info-item strong {
    color: rgba(242, 247, 250, 0.96) !important;
}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 760px) {

    /*
        Mobile backgrounds sit underneath much more text,
        so strengthen the local wash slightly.
    */

    .zenith-page .team-page-hero::after {
        background:
            linear-gradient(
                90deg,
                rgba(1, 10, 18, 0.84) 0%,
                rgba(1, 11, 20, 0.68) 75%,
                rgba(1, 11, 20, 0.34) 100%
            );
    }


    .nova-page .team-page-hero::after {
        background:
            linear-gradient(
                90deg,
                rgba(7, 4, 23, 0.75) 0%,
                rgba(8, 5, 25, 0.60) 75%,
                rgba(8, 5, 25, 0.30) 100%
            );
    }


    .nexus-page .team-page-hero::after {
        background:
            linear-gradient(
                90deg,
                rgba(1, 8, 19, 0.80) 0%,
                rgba(1, 9, 21, 0.65) 75%,
                rgba(1, 9, 21, 0.30) 100%
            );
    }


    .team-page .team-page-hero-content p {
        color: rgba(229, 236, 242, 0.90) !important;
    }

}
/* =========================================================
   TEAM ENVIRONMENT STACKING — FINAL FIX

   0 = static team artwork
   1 = readability wash / watermark / vignette
   2 = animated environment canvas
   3 = actual text/content

   IMPORTANT:
   Do NOT isolate the hero.
   Isolation was hiding Zenith/Nova's animated canvas.
========================================================= */

.team-page .team-page-hero {
    position: relative !important;

    isolation: auto !important;

    z-index: auto !important;
}


/* STATIC BACKGROUND */

.team-page .team-identity-bg {
    z-index: 0 !important;
}


/* WATERMARK */

.team-page .team-page-background-logo {
    z-index: 1 !important;
}


/* READABILITY WASH */

.team-page .team-page-hero::after {
    z-index: 1 !important;

    pointer-events: none !important;
}


/* VIGNETTE */

.team-page .team-identity-vignette {
    z-index: 1 !important;

    pointer-events: none !important;
}


/* =========================================================
   ANIMATED ENVIRONMENT

   Zenith frost/glints
   Nova particles/stars
   Nexus network/circuits
========================================================= */

.team-page #team-identity-fx {
    display: block !important;

    position: fixed !important;

    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;

    z-index: 2 !important;

    opacity: 1 !important;

    pointer-events: none !important;
}


/*
    Zenith + Nova need screen blending for their effects.
*/

.zenith-page #team-identity-fx,
.nova-page #team-identity-fx {
    mix-blend-mode: screen !important;
}


/*
    Nexus stays normal so the platinum floor circuits
    do not get recoloured blue.
*/

.nexus-page #team-identity-fx {
    mix-blend-mode: normal !important;
}


/* =========================================================
   PAGE CONTENT ABOVE EVERYTHING
========================================================= */

.team-page .team-page-hero-content,
.team-page .team-section-heading,
.team-page .roster-grid,
.team-page .team-competition-grid {
    position: relative !important;

    z-index: 3 !important;
}


/* HEADER */

body.team-page > header {
    position: sticky !important;

    z-index: 10000 !important;
}


/* FOOTER */

body.team-page > footer {
    position: relative !important;

    z-index: 3 !important;
}
/* =========================================================
   TEAM ENVIRONMENT STACKING — FINAL OVERRIDE

   Restores:
   - Zenith frost / glints / mouse response
   - Nova particles / stars / mouse response
   - Nexus network animation

   STACK:
   0 = background artwork
   1 = readability wash / watermark / vignette
   2 = animated canvas
   3 = text/content
========================================================= */


/* =========================================================
   HERO
========================================================= */

.team-page .team-page-hero {
    position: relative !important;

    isolation: auto !important;

    z-index: auto !important;
}


/* =========================================================
   STATIC TEAM BACKGROUND
========================================================= */

.team-page .team-identity-bg {
    position: fixed !important;

    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;

    z-index: 0 !important;

    pointer-events: none !important;
}


/* =========================================================
   LARGE TEAM WATERMARK
========================================================= */

.team-page .team-page-background-logo {
    z-index: 1 !important;

    pointer-events: none !important;
}


/* =========================================================
   TEXT READABILITY WASH

   Must stay BELOW animation canvas.
========================================================= */

.team-page .team-page-hero::after {
    z-index: 1 !important;

    pointer-events: none !important;
}


/* =========================================================
   VIGNETTE
========================================================= */

.team-page .team-identity-vignette {
    z-index: 1 !important;

    pointer-events: none !important;
}


/* =========================================================
   MAIN ANIMATION CANVAS
========================================================= */

.team-page #team-identity-fx {
    display: block !important;

    position: fixed !important;

    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;

    z-index: 2 !important;

    opacity: 1 !important;

    pointer-events: none !important;
}


/* =========================================================
   ZENITH

   Frost, mist and glints use screen blending.
========================================================= */

.zenith-page #team-identity-fx {
    mix-blend-mode: screen !important;

    opacity: 1 !important;
}


/* =========================================================
   NOVA

   Stars / dust / shooting stars use screen blending.
========================================================= */

.nova-page #team-identity-fx {
    mix-blend-mode: screen !important;

    opacity: 1 !important;
}


/* =========================================================
   NEXUS

   Normal blending preserves neutral silver circuitry.
========================================================= */

.nexus-page #team-identity-fx {
    mix-blend-mode: normal !important;

    opacity: 1 !important;
}


/* =========================================================
   MAIN CONTENT
========================================================= */

body.team-page > main {
    position: relative !important;

    z-index: auto !important;
}


.team-page .team-page-hero,
.team-page .team-roster-section,
.team-page .team-results-section {
    position: relative !important;

    z-index: auto !important;
}


.team-page .team-page-hero-content,
.team-page .team-section-heading,
.team-page .roster-grid,
.team-page .team-competition-grid {
    position: relative !important;

    z-index: 3 !important;
}


/* =========================================================
   HEADER
========================================================= */

body.team-page > header {
    position: sticky !important;

    z-index: 10000 !important;
}


/* =========================================================
   FOOTER
========================================================= */

body.team-page > footer {
    position: relative !important;

    z-index: 3 !important;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

    .team-page #team-identity-fx {
        opacity: 0.92 !important;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .team-page #team-identity-fx {
        opacity: 0.72 !important;
    }

}
/* =========================================================
   NEXUS — LARGE BACKGROUND WATERMARK
   FINAL POSITION + BREATHING

   This overrides any older Nexus watermark styling.

   Goal:
   - sit higher like Zenith/Nova
   - remain behind the content
   - stay visible without overpowering text
   - preserve Nexus blue/violet identity
========================================================= */


/* =========================================================
   DESKTOP
========================================================= */

.nexus-page .team-page-background-logo {
    position: absolute !important;

    width: 740px !important;
    height: auto !important;

    /*
        IMPORTANT:
        Nexus was sitting too low at ~50%.

        40% moves the visual centre upward so it lines up
        much more closely with Zenith and Nova.
    */

    top: 40% !important;

    right: -90px !important;

    transform:
        translateY(-50%)
        rotate(0deg) !important;

    transform-origin:
        center center !important;

    opacity: 0.16 !important;

    pointer-events: none !important;

    z-index: 1 !important;

    filter:
        brightness(0.94)
        contrast(1.06)
        saturate(1.22)

        drop-shadow(
            0 0 18px
            rgba(91, 205, 255, 0.14)
        )

        drop-shadow(
            0 0 38px
            rgba(84, 153, 255, 0.10)
        )

        drop-shadow(
            0 0 58px
            rgba(137, 91, 255, 0.09)
        ) !important;

    animation:
        nexus-watermark-breathe
        9s
        ease-in-out
        infinite !important;
}



/* =========================================================
   NEXUS WATERMARK BREATHING

   Opacity/filter only.

   We deliberately DO NOT animate transform because that
   would overwrite translateY(-50%) and move the emblem.
========================================================= */

@keyframes nexus-watermark-breathe {

    0%,
    100% {
        opacity: 0.145;

        filter:
            brightness(0.92)
            contrast(1.06)
            saturate(1.20)

            drop-shadow(
                0 0 16px
                rgba(91, 205, 255, 0.11)
            )

            drop-shadow(
                0 0 34px
                rgba(84, 153, 255, 0.08)
            )

            drop-shadow(
                0 0 52px
                rgba(137, 91, 255, 0.07)
            );
    }


    50% {
        opacity: 0.185;

        filter:
            brightness(1.02)
            contrast(1.07)
            saturate(1.27)

            drop-shadow(
                0 0 21px
                rgba(91, 205, 255, 0.17)
            )

            drop-shadow(
                0 0 42px
                rgba(84, 153, 255, 0.12)
            )

            drop-shadow(
                0 0 64px
                rgba(137, 91, 255, 0.11)
            );
    }

}



/* =========================================================
   MEDIUM DESKTOP / TABLET
========================================================= */

@media (max-width: 1200px) {

    .nexus-page .team-page-background-logo {
        width: 650px !important;

        top: 39% !important;

        right: -165px !important;
    }

}



/* =========================================================
   SMALL TABLET
========================================================= */

@media (max-width: 900px) {

    .nexus-page .team-page-background-logo {
        width: 590px !important;

        top: 36% !important;

        right: -225px !important;

        opacity: 0.12 !important;
    }

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

    .nexus-page .team-page-background-logo {
        width: 500px !important;

        /*
            Keep it higher than the generic mobile rule.
        */

        top: 30% !important;

        right: -275px !important;

        opacity: 0.085 !important;

        filter:
            brightness(0.95)
            contrast(1.05)
            saturate(1.18)

            drop-shadow(
                0 0 18px
                rgba(91, 205, 255, 0.10)
            )

            drop-shadow(
                0 0 32px
                rgba(137, 91, 255, 0.07)
            ) !important;
    }

}



/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .nexus-page .team-page-background-logo {
        animation: none !important;

        opacity: 0.16 !important;
    }

}
/* =========================================================
   NEXUS BACKGROUND WATERMARK — FINAL POSITION

   Changes:
   - moved noticeably higher
   - brighter / clearer
   - stronger blue + violet glass
   - still transparent enough to remain a watermark
   - gentle breathing retained
========================================================= */


/* =========================================================
   DESKTOP
========================================================= */

.nexus-page .team-page-background-logo {
    position: absolute !important;

    width: 740px !important;
    height: auto !important;

    /*
        HIGHER THAN BEFORE

        Previous: ~40%
        New: 32%

        This places it much closer to the vertical position
        of Nova / Zenith instead of sinking into the floor.
    */

    top: 32% !important;

    right: -92px !important;

    transform:
        translateY(-50%)
        rotate(0deg) !important;

    transform-origin:
        center center !important;

    /*
        BRIGHTER
    */

    opacity: 0.22 !important;

    pointer-events: none !important;

    z-index: 1 !important;

    filter:
        brightness(1.12)
        contrast(1.10)
        saturate(1.34)

        drop-shadow(
            0 0 14px
            rgba(205, 242, 255, 0.16)
        )

        drop-shadow(
            0 0 30px
            rgba(79, 190, 255, 0.18)
        )

        drop-shadow(
            0 0 52px
            rgba(116, 86, 255, 0.16)
        )

        drop-shadow(
            0 0 78px
            rgba(79, 143, 255, 0.09)
        ) !important;

    animation:
        nexus-watermark-breathe-final
        9s
        ease-in-out
        infinite !important;
}



/* =========================================================
   BREATHING

   Only opacity / light changes.
   Position remains locked.
========================================================= */

@keyframes nexus-watermark-breathe-final {

    0%,
    100% {
        opacity: 0.20;

        filter:
            brightness(1.06)
            contrast(1.09)
            saturate(1.30)

            drop-shadow(
                0 0 13px
                rgba(205, 242, 255, 0.13)
            )

            drop-shadow(
                0 0 27px
                rgba(79, 190, 255, 0.15)
            )

            drop-shadow(
                0 0 48px
                rgba(116, 86, 255, 0.13)
            )

            drop-shadow(
                0 0 70px
                rgba(79, 143, 255, 0.07)
            );
    }


    50% {
        opacity: 0.255;

        filter:
            brightness(1.20)
            contrast(1.11)
            saturate(1.40)

            drop-shadow(
                0 0 17px
                rgba(219, 248, 255, 0.19)
            )

            drop-shadow(
                0 0 36px
                rgba(79, 202, 255, 0.22)
            )

            drop-shadow(
                0 0 60px
                rgba(131, 91, 255, 0.20)
            )

            drop-shadow(
                0 0 88px
                rgba(82, 149, 255, 0.11)
            );
    }

}



/* =========================================================
   MEDIUM DESKTOP
========================================================= */

@media (max-width: 1200px) {

    .nexus-page .team-page-background-logo {
        width: 660px !important;

        top: 31% !important;

        right: -150px !important;
    }

}



/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    .nexus-page .team-page-background-logo {
        width: 590px !important;

        top: 30% !important;

        right: -205px !important;

        opacity: 0.18 !important;
    }

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

    .nexus-page .team-page-background-logo {
        width: 490px !important;

        top: 27% !important;

        right: -260px !important;

        opacity: 0.12 !important;

        filter:
            brightness(1.07)
            contrast(1.08)
            saturate(1.28)

            drop-shadow(
                0 0 16px
                rgba(80, 196, 255, 0.13)
            )

            drop-shadow(
                0 0 32px
                rgba(128, 88, 255, 0.11)
            ) !important;
    }

}



/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .nexus-page .team-page-background-logo {
        animation: none !important;

        opacity: 0.22 !important;
    }

}
/* =========================================================
   NEXUS BACKGROUND WATERMARK — POSITION CORRECTION

   32% = too high
   40% = too low

   New desktop position: 36%

   Keeps:
   - brighter visibility
   - blue/violet glass look
   - breathing animation
========================================================= */


/* =========================================================
   DESKTOP
========================================================= */

.nexus-page .team-page-background-logo {
    position: absolute !important;

    width: 740px !important;
    height: auto !important;

    /* FINAL VERTICAL POSITION */
    top: 36% !important;

    right: -92px !important;

    transform:
        translateY(-50%)
        rotate(0deg) !important;

    transform-origin:
        center center !important;

    opacity: 0.22 !important;

    pointer-events: none !important;

    z-index: 1 !important;

    filter:
        brightness(1.12)
        contrast(1.10)
        saturate(1.34)

        drop-shadow(
            0 0 14px
            rgba(205, 242, 255, 0.16)
        )

        drop-shadow(
            0 0 30px
            rgba(79, 190, 255, 0.18)
        )

        drop-shadow(
            0 0 52px
            rgba(116, 86, 255, 0.16)
        )

        drop-shadow(
            0 0 78px
            rgba(79, 143, 255, 0.09)
        ) !important;

    animation:
        nexus-watermark-breathe-final
        9s
        ease-in-out
        infinite !important;
}


/* =========================================================
   BREATHING
========================================================= */

@keyframes nexus-watermark-breathe-final {

    0%,
    100% {
        opacity: 0.20;

        filter:
            brightness(1.06)
            contrast(1.09)
            saturate(1.30)

            drop-shadow(
                0 0 13px
                rgba(205, 242, 255, 0.13)
            )

            drop-shadow(
                0 0 27px
                rgba(79, 190, 255, 0.15)
            )

            drop-shadow(
                0 0 48px
                rgba(116, 86, 255, 0.13)
            )

            drop-shadow(
                0 0 70px
                rgba(79, 143, 255, 0.07)
            );
    }


    50% {
        opacity: 0.255;

        filter:
            brightness(1.20)
            contrast(1.11)
            saturate(1.40)

            drop-shadow(
                0 0 17px
                rgba(219, 248, 255, 0.19)
            )

            drop-shadow(
                0 0 36px
                rgba(79, 202, 255, 0.22)
            )

            drop-shadow(
                0 0 60px
                rgba(131, 91, 255, 0.20)
            )

            drop-shadow(
                0 0 88px
                rgba(82, 149, 255, 0.11)
            );
    }
}


/* =========================================================
   MEDIUM DESKTOP
========================================================= */

@media (max-width: 1200px) {

    .nexus-page .team-page-background-logo {
        width: 660px !important;

        top: 35% !important;

        right: -150px !important;
    }
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    .nexus-page .team-page-background-logo {
        width: 590px !important;

        top: 34% !important;

        right: -205px !important;

        opacity: 0.18 !important;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

    .nexus-page .team-page-background-logo {
        width: 490px !important;

        top: 30% !important;

        right: -260px !important;

        opacity: 0.12 !important;

        filter:
            brightness(1.07)
            contrast(1.08)
            saturate(1.28)

            drop-shadow(
                0 0 16px
                rgba(80, 196, 255, 0.13)
            )

            drop-shadow(
                0 0 32px
                rgba(128, 88, 255, 0.11)
            ) !important;
    }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .nexus-page .team-page-background-logo {
        animation: none !important;

        opacity: 0.22 !important;
    }
}
/* =========================================================
   NEXUS BACKGROUND WATERMARK
   LOWER POSITION — FINAL OVERRIDE
========================================================= */


/* =========================================================
   DESKTOP
========================================================= */

.nexus-page .team-page-background-logo {
    position: absolute !important;

    width: 740px !important;
    height: auto !important;

    /*
        36% was still too high.
        42% drops the emblem into the scene more like Nova.
    */

    top: 42% !important;

    right: -92px !important;

    transform:
        translateY(-50%)
        rotate(0deg) !important;

    transform-origin:
        center center !important;

    opacity: 0.22 !important;

    pointer-events: none !important;

    z-index: 1 !important;

    filter:
        brightness(1.12)
        contrast(1.10)
        saturate(1.34)

        drop-shadow(
            0 0 14px
            rgba(205, 242, 255, 0.16)
        )

        drop-shadow(
            0 0 30px
            rgba(79, 190, 255, 0.18)
        )

        drop-shadow(
            0 0 52px
            rgba(116, 86, 255, 0.16)
        )

        drop-shadow(
            0 0 78px
            rgba(79, 143, 255, 0.09)
        ) !important;

    animation:
        nexus-watermark-breathe-final
        9s
        ease-in-out
        infinite !important;
}


/* =========================================================
   BREATHING
========================================================= */

@keyframes nexus-watermark-breathe-final {

    0%,
    100% {
        opacity: 0.20;

        filter:
            brightness(1.06)
            contrast(1.09)
            saturate(1.30)

            drop-shadow(
                0 0 13px
                rgba(205, 242, 255, 0.13)
            )

            drop-shadow(
                0 0 27px
                rgba(79, 190, 255, 0.15)
            )

            drop-shadow(
                0 0 48px
                rgba(116, 86, 255, 0.13)
            )

            drop-shadow(
                0 0 70px
                rgba(79, 143, 255, 0.07)
            );
    }


    50% {
        opacity: 0.255;

        filter:
            brightness(1.20)
            contrast(1.11)
            saturate(1.40)

            drop-shadow(
                0 0 17px
                rgba(219, 248, 255, 0.19)
            )

            drop-shadow(
                0 0 36px
                rgba(79, 202, 255, 0.22)
            )

            drop-shadow(
                0 0 60px
                rgba(131, 91, 255, 0.20)
            )

            drop-shadow(
                0 0 88px
                rgba(82, 149, 255, 0.11)
            );
    }
}


/* =========================================================
   MEDIUM DESKTOP
========================================================= */

@media (max-width: 1200px) {

    .nexus-page .team-page-background-logo {
        width: 660px !important;

        top: 41% !important;

        right: -150px !important;
    }
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    .nexus-page .team-page-background-logo {
        width: 590px !important;

        top: 39% !important;

        right: -205px !important;

        opacity: 0.18 !important;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

    .nexus-page .team-page-background-logo {
        width: 490px !important;

        top: 35% !important;

        right: -260px !important;

        opacity: 0.12 !important;

        filter:
            brightness(1.07)
            contrast(1.08)
            saturate(1.28)

            drop-shadow(
                0 0 16px
                rgba(80, 196, 255, 0.13)
            )

            drop-shadow(
                0 0 32px
                rgba(128, 88, 255, 0.11)
            ) !important;
    }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .nexus-page .team-page-background-logo {
        animation: none !important;

        opacity: 0.22 !important;
    }
}
/* =========================================================
   NEXUS BACKGROUND WATERMARK
   SLIGHTLY LOWER POSITION
========================================================= */

.nexus-page .team-page-background-logo {
    position: absolute !important;

    width: 740px !important;
    height: auto !important;

    top: 45% !important;

    right: -92px !important;

    transform:
        translateY(-50%)
        rotate(0deg) !important;

    transform-origin:
        center center !important;

    opacity: 0.22 !important;

    pointer-events: none !important;

    z-index: 1 !important;

    filter:
        brightness(1.12)
        contrast(1.10)
        saturate(1.34)

        drop-shadow(
            0 0 14px
            rgba(205, 242, 255, 0.16)
        )

        drop-shadow(
            0 0 30px
            rgba(79, 190, 255, 0.18)
        )

        drop-shadow(
            0 0 52px
            rgba(116, 86, 255, 0.16)
        )

        drop-shadow(
            0 0 78px
            rgba(79, 143, 255, 0.09)
        ) !important;

    animation:
        nexus-watermark-breathe-final
        9s
        ease-in-out
        infinite !important;
}


@keyframes nexus-watermark-breathe-final {

    0%,
    100% {
        opacity: 0.20;

        filter:
            brightness(1.06)
            contrast(1.09)
            saturate(1.30)

            drop-shadow(
                0 0 13px
                rgba(205, 242, 255, 0.13)
            )

            drop-shadow(
                0 0 27px
                rgba(79, 190, 255, 0.15)
            )

            drop-shadow(
                0 0 48px
                rgba(116, 86, 255, 0.13)
            )

            drop-shadow(
                0 0 70px
                rgba(79, 143, 255, 0.07)
            );
    }


    50% {
        opacity: 0.255;

        filter:
            brightness(1.20)
            contrast(1.11)
            saturate(1.40)

            drop-shadow(
                0 0 17px
                rgba(219, 248, 255, 0.19)
            )

            drop-shadow(
                0 0 36px
                rgba(79, 202, 255, 0.22)
            )

            drop-shadow(
                0 0 60px
                rgba(131, 91, 255, 0.20)
            )

            drop-shadow(
                0 0 88px
                rgba(82, 149, 255, 0.11)
            );
    }
}


@media (max-width: 1200px) {

    .nexus-page .team-page-background-logo {
        width: 660px !important;

        top: 44% !important;

        right: -150px !important;
    }
}


@media (max-width: 900px) {

    .nexus-page .team-page-background-logo {
        width: 590px !important;

        top: 42% !important;

        right: -205px !important;

        opacity: 0.18 !important;
    }
}


@media (max-width: 700px) {

    .nexus-page .team-page-background-logo {
        width: 490px !important;

        top: 38% !important;

        right: -260px !important;

        opacity: 0.12 !important;

        filter:
            brightness(1.07)
            contrast(1.08)
            saturate(1.28)

            drop-shadow(
                0 0 16px
                rgba(80, 196, 255, 0.13)
            )

            drop-shadow(
                0 0 32px
                rgba(128, 88, 255, 0.11)
            ) !important;
    }
}


@media (prefers-reduced-motion: reduce) {

    .nexus-page .team-page-background-logo {
        animation: none !important;

        opacity: 0.22 !important;
    }
}
/* =========================================================
   NEXUS PLAYER CARDS
   CRX NETWORK / SIGNAL IDENTITY
========================================================= */


/* =========================================================
   ROSTER GRID
========================================================= */

.nexus-page .nexus-roster-grid {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 22px;

    width: min(1480px, calc(100% - 80px));

    margin:
        0 auto;
}



/* =========================================================
   CARD
========================================================= */

.nexus-page .nexus-player-card {
    position: relative;

    min-height: 570px;

    padding:
        30px 28px 32px;

    overflow: hidden;

    isolation: isolate;

    background:

        radial-gradient(
            circle at 50% 10%,
            rgba(91, 205, 255, 0.075),
            transparent 29%
        ),

        radial-gradient(
            circle at 90% 92%,
            rgba(139, 90, 255, 0.055),
            transparent 32%
        ),

        linear-gradient(
            155deg,
            rgba(4, 16, 31, 0.96),
            rgba(3, 11, 24, 0.985) 52%,
            rgba(5, 8, 22, 0.99)
        );

    border:
        1px solid
        rgba(129, 187, 218, 0.18);

    clip-path:
        polygon(
            0 0,
            calc(100% - 24px) 0,
            100% 24px,
            100% calc(100% - 24px),
            calc(100% - 24px) 100%,
            24px 100%,
            0 calc(100% - 24px)
        );

    box-shadow:
        0 18px 45px
        rgba(0, 0, 0, 0.28);

    transition:
        transform 0.28s ease,
        border-color 0.28s ease,
        box-shadow 0.28s ease,
        background 0.28s ease;
}



/* =========================================================
   SUBTLE INTERNAL CIRCUIT TEXTURE
========================================================= */

.nexus-page .nexus-player-card::after {
    content: "";

    position: absolute;

    inset: 0;

    z-index: -1;

    pointer-events: none;

    opacity: 0.35;

    background:

        linear-gradient(
            90deg,
            transparent 0 12%,
            rgba(204, 216, 224, 0.05) 12% 12.3%,
            transparent 12.3% 65%,
            rgba(87, 189, 255, 0.04) 65% 65.2%,
            transparent 65.2%
        ),

        linear-gradient(
            0deg,
            transparent 0 20%,
            rgba(205, 215, 223, 0.04) 20% 20.25%,
            transparent 20.25% 72%,
            rgba(150, 97, 255, 0.035) 72% 72.2%,
            transparent 72.2%
        );
}



/* =========================================================
   TOP SIGNAL BAR
========================================================= */

.nexus-page .nexus-card-signal {
    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 2px;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            #63dcff 17%,
            #d9e7ed 47%,
            #8e68ff 72%,
            transparent 100%
        );

    opacity: 0.78;

    pointer-events: none;
}


.nexus-page .nexus-card-signal::after {
    content: "";

    position: absolute;

    top: 50%;
    left: 12%;

    width: 6px;
    height: 6px;

    border-radius: 50%;

    transform:
        translate(-50%, -50%);

    background:
        #ffffff;

    box-shadow:
        0 0 7px
        rgba(255, 255, 255, 0.95),

        0 0 14px
        rgba(87, 204, 255, 0.68);

    opacity: 0;

    transition:
        opacity 0.2s ease;
}



/* =========================================================
   PLAYER NUMBER
========================================================= */

.nexus-page .nexus-player-card .roster-card-number {
    position: relative;

    z-index: 3;

    color:
        rgba(109, 220, 255, 0.72);

    font-family:
        "Orbitron",
        sans-serif;

    font-size:
        0.78rem;

    font-weight:
        700;

    letter-spacing:
        0.14em;
}



/* =========================================================
   CIRCULAR PLAYER IMAGE
========================================================= */

.nexus-page .nexus-player-image-wrap {
    display: flex;

    justify-content: center;

    align-items: center;

    margin:
        2px 0 22px;
}


.nexus-page .nexus-player-image-ring {
    position: relative;

    display: grid;

    place-items: center;

    width: 128px;
    height: 128px;

    border-radius: 50%;

    padding: 4px;

    background:
        conic-gradient(
            from 210deg,
            rgba(88, 206, 255, 0.95),
            rgba(215, 229, 236, 0.60),
            rgba(146, 91, 255, 0.92),
            rgba(88, 206, 255, 0.95)
        );

    box-shadow:
        0 0 0 1px
        rgba(165, 215, 238, 0.10),

        0 0 22px
        rgba(65, 172, 255, 0.10),

        0 0 32px
        rgba(135, 83, 255, 0.06);

    transition:
        transform 0.28s ease,
        box-shadow 0.28s ease;
}


.nexus-page .nexus-player-image-ring::before {
    content: "";

    position: absolute;

    inset: 6px;

    border-radius: 50%;

    border:
        1px solid
        rgba(225, 239, 245, 0.16);

    pointer-events: none;
}


.nexus-page .nexus-player-image {
    display: block;

    width: 120px !important;
    height: 120px !important;

    max-width: none !important;

    border-radius: 50% !important;

    object-fit: cover;

    opacity: 1 !important;

    filter: none !important;

    box-shadow:
        inset 0 0 18px
        rgba(0, 0, 0, 0.45);
}



/* =========================================================
   TEAM LABEL
========================================================= */

.nexus-page .nexus-player-card .roster-card-team {
    margin:
        0 0 8px;

    color:
        rgba(154, 218, 237, 0.78);

    font-family:
        "Orbitron",
        sans-serif;

    font-size:
        0.72rem;

    font-weight:
        700;

    letter-spacing:
        0.17em;

    text-transform:
        uppercase;
}



/* =========================================================
   PLAYER NAME
========================================================= */

.nexus-page .nexus-player-card h3 {
    margin:
        0 0 8px;

    color:
        #f5f8fa;

    font-family:
        "Orbitron",
        sans-serif;

    font-size:
        clamp(
            1.45rem,
            1.7vw,
            2rem
        );

    font-weight:
        600;

    line-height:
        1.08;

    text-shadow:
        0 2px 9px
        rgba(0, 0, 0, 0.55);
}



/* =========================================================
   CRX PLAYER TAG
========================================================= */

.nexus-page .nexus-player-card .roster-card-tag {
    margin:
        0 0 20px;

    color:
        rgba(191, 205, 215, 0.76);

    font-size:
        0.92rem;
}



/* =========================================================
   ROLE TAGS
========================================================= */

.nexus-page .nexus-player-card .player-card-details {
    display: flex;

    flex-wrap: wrap;

    gap: 7px;

    margin:
        0 0 16px;
}


.nexus-page .nexus-player-card .player-card-details span {
    display: inline-flex;

    align-items: center;

    min-height: 29px;

    padding:
        6px 10px;

    color:
        #a8f0ef;

    background:
        rgba(37, 111, 119, 0.11);

    border:
        1px solid
        rgba(97, 218, 216, 0.22);

    font-family:
        "Orbitron",
        sans-serif;

    font-size:
        0.62rem;

    font-weight:
        700;

    letter-spacing:
        0.13em;

    text-transform:
        uppercase;
}



/* =========================================================
   AGENT POOL
========================================================= */

.nexus-page .nexus-player-card .player-card-agent-pool {
    margin:
        0;

    padding:
        0 0 17px;

    color:
        rgba(203, 215, 224, 0.80);

    border-bottom:
        1px solid
        rgba(112, 178, 205, 0.15);

    font-size:
        0.82rem;

    line-height:
        1.65;
}


.nexus-page .agent-learning {
    color:
        rgba(174, 139, 255, 0.90);
}



/* =========================================================
   QUOTE
========================================================= */

.nexus-page .nexus-player-card .player-card-quote {
    margin:
        18px 0 0;

    color:
        rgba(226, 232, 237, 0.82);

    font-size:
        0.84rem;

    line-height:
        1.55;

    font-style: normal;
}


.nexus-page .nexus-player-card .quote-credit {
    display: block;

    margin-top: 6px;

    color:
        rgba(138, 207, 225, 0.58);

    font-size:
        0.72rem;
}



/* =========================================================
   HOVER — NETWORK ACTIVATION
========================================================= */

.nexus-page .nexus-player-card:hover {
    transform:
        translateY(-7px);

    border-color:
        rgba(122, 220, 244, 0.40);

    background:

        radial-gradient(
            circle at 50% 10%,
            rgba(85, 207, 255, 0.11),
            transparent 31%
        ),

        radial-gradient(
            circle at 90% 92%,
            rgba(149, 91, 255, 0.085),
            transparent 34%
        ),

        linear-gradient(
            155deg,
            rgba(5, 21, 38, 0.97),
            rgba(3, 13, 27, 0.99) 52%,
            rgba(6, 9, 24, 1)
        );

    box-shadow:
        0 24px 58px
        rgba(0, 0, 0, 0.35),

        0 0 26px
        rgba(60, 190, 255, 0.09),

        0 0 38px
        rgba(128, 80, 255, 0.06);
}


.nexus-page .nexus-player-card:hover
.nexus-player-image-ring {
    transform:
        scale(1.045);

    box-shadow:
        0 0 0 1px
        rgba(187, 233, 247, 0.15),

        0 0 24px
        rgba(62, 198, 255, 0.20),

        0 0 42px
        rgba(135, 86, 255, 0.13);
}


.nexus-page .nexus-player-card:hover
.nexus-card-signal {
    opacity: 1;
}


.nexus-page .nexus-player-card:hover
.nexus-card-signal::after {
    opacity: 1;

    animation:
        nexus-player-signal
        1.9s
        linear
        infinite;
}



/* =========================================================
   SIGNAL TRAVEL
========================================================= */

@keyframes nexus-player-signal {

    0% {
        left: 5%;

        background:
            #78e4ff;

        box-shadow:
            0 0 7px
            rgba(120, 228, 255, 0.95),

            0 0 16px
            rgba(77, 193, 255, 0.72);
    }


    48% {
        left: 50%;

        background:
            #eef4f6;

        box-shadow:
            0 0 8px
            rgba(240, 247, 249, 0.95),

            0 0 16px
            rgba(221, 233, 238, 0.62);
    }


    100% {
        left: 95%;

        background:
            #a57aff;

        box-shadow:
            0 0 7px
            rgba(165, 122, 255, 0.95),

            0 0 17px
            rgba(137, 89, 255, 0.72);
    }

}



/* =========================================================
   2-COLUMN TABLET / SMALL DESKTOP
========================================================= */

@media (max-width: 1250px) {

    .nexus-page .nexus-roster-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        width:
            min(
                920px,
                calc(100% - 60px)
            );
    }

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

    .nexus-page .nexus-roster-grid {
        grid-template-columns:
            1fr;

        width:
            calc(100% - 34px);

        gap:
            18px;
    }


    .nexus-page .nexus-player-card {
        min-height:
            0;

        padding:
            26px 23px 28px;
    }


    .nexus-page .nexus-player-image-ring {
        width:
            116px;

        height:
            116px;
    }


    .nexus-page .nexus-player-image {
        width:
            108px !important;

        height:
            108px !important;
    }

}



/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .nexus-page .nexus-player-card,
    .nexus-page .nexus-player-image-ring {
        transition:
            none !important;
    }


    .nexus-page .nexus-player-card:hover {
        transform:
            none;
    }


    .nexus-page .nexus-player-card:hover
    .nexus-card-signal::after {
        animation:
            none !important;

        left:
            50%;
    }

}
/* =========================================================
   NEXUS ROSTER CARDS
   SAME CRX CARD SYSTEM AS ZENITH / NOVA
   NEXUS-SPECIFIC COLOUR IDENTITY ONLY
========================================================= */


/* =========================================================
   ROSTER SECTION
========================================================= */

.nexus-page .nexus-roster-section {
    background:
        linear-gradient(
            180deg,
            rgba(2, 8, 20, 0.36),
            rgba(3, 8, 21, 0.52)
        ) !important;
}



/* =========================================================
   CARD

   Keep the exact same dimensions / structure as
   Nova and Zenith.
========================================================= */

.nexus-page .roster-card {
    background:

        radial-gradient(
            circle at 82% 12%,
            rgba(88, 205, 255, 0.075),
            transparent 30%
        ),

        radial-gradient(
            circle at 18% 90%,
            rgba(137, 88, 255, 0.055),
            transparent 34%
        ),

        linear-gradient(
            150deg,
            rgba(5, 19, 35, 0.97),
            rgba(4, 12, 27, 0.985) 55%,
            rgba(5, 8, 21, 0.99)
        ) !important;

    border-color:
        rgba(107, 192, 225, 0.20) !important;

    box-shadow:
        0 18px 40px
        rgba(0, 0, 0, 0.26) !important;
}



/* =========================================================
   TOP ACCENT

   Same card language as Nova/Zenith,
   Nexus uses cyan -> silver -> violet.
========================================================= */

.nexus-page .roster-card::before {
    background:
        linear-gradient(
            90deg,
            #67dcff 0%,
            #dce8ed 42%,
            #936bff 76%,
            transparent 100%
        ) !important;
}



/* =========================================================
   PLAYER EMBLEMS
========================================================= */

.nexus-page .player-card-emblem {
    border-radius:
        50% !important;

    object-fit:
        cover !important;

    opacity:
        0.78 !important;

    filter:
        brightness(0.92)
        contrast(1.05)
        saturate(1.05)

        drop-shadow(
            0 0 12px
            rgba(83, 197, 255, 0.09)
        ) !important;

    transition:
        opacity 0.28s ease,
        filter 0.28s ease,
        transform 0.28s ease !important;
}



/* =========================================================
   NUMBER
========================================================= */

.nexus-page .roster-card-number {
    color:
        rgba(118, 218, 255, 0.76) !important;
}



/* =========================================================
   TEAM LABEL
========================================================= */

.nexus-page .roster-card-team {
    color:
        rgba(212, 225, 233, 0.88) !important;
}



/* =========================================================
   PLAYER NAME
========================================================= */

.nexus-page .roster-card h3 {
    color:
        #f7f9fb !important;

    text-shadow:
        0 2px 10px
        rgba(0, 0, 0, 0.42);
}



/* =========================================================
   CRX TAG
========================================================= */

.nexus-page .roster-card-tag {
    color:
        rgba(194, 207, 217, 0.76) !important;
}



/* =========================================================
   ROLE CHIPS
========================================================= */

.nexus-page .player-card-details {
    display:
        flex !important;

    flex-wrap:
        wrap !important;

    gap:
        8px !important;
}


.nexus-page .player-card-details span {
    color:
        #c7f7f4 !important;

    background:
        linear-gradient(
            135deg,
            rgba(40, 117, 128, 0.18),
            rgba(85, 62, 135, 0.16)
        ) !important;

    border-color:
        rgba(105, 218, 220, 0.25) !important;
}



/* Alternate the role-chip edge slightly violet */

.nexus-page
.player-card-details
span:nth-child(even) {
    color:
        #ddd0ff !important;

    border-color:
        rgba(160, 113, 255, 0.26) !important;

    background:
        rgba(85, 55, 137, 0.17) !important;
}



/* =========================================================
   AGENT POOL
========================================================= */

.nexus-page .player-card-agent-pool {
    color:
        rgba(207, 217, 225, 0.80) !important;

    border-bottom-color:
        rgba(107, 188, 216, 0.16) !important;
}



/* =========================================================
   QUOTES
========================================================= */

.nexus-page .player-card-quote {
    color:
        rgba(226, 233, 238, 0.84) !important;
}


.nexus-page .quote-credit {
    color:
        rgba(160, 189, 209, 0.58) !important;
}



/* =========================================================
   HOVER

   Still behaves like the shared CRX cards,
   but lights up with Nexus channels.
========================================================= */

.nexus-page .roster-card:hover {
    border-color:
        rgba(120, 217, 244, 0.42) !important;

    background:

        radial-gradient(
            circle at 82% 12%,
            rgba(85, 211, 255, 0.12),
            transparent 32%
        ),

        radial-gradient(
            circle at 18% 90%,
            rgba(145, 91, 255, 0.09),
            transparent 35%
        ),

        linear-gradient(
            150deg,
            rgba(6, 23, 40, 0.98),
            rgba(4, 14, 29, 0.99) 55%,
            rgba(6, 9, 23, 1)
        ) !important;

    box-shadow:

        0 22px 50px
        rgba(0, 0, 0, 0.32),

        0 0 26px
        rgba(75, 196, 255, 0.08),

        0 0 36px
        rgba(139, 88, 255, 0.06) !important;
}


.nexus-page
.roster-card:hover
.player-card-emblem {
    opacity:
        1 !important;

    transform:
        scale(1.035);

    filter:
        brightness(1.04)
        contrast(1.06)
        saturate(1.10)

        drop-shadow(
            0 0 16px
            rgba(81, 201, 255, 0.16)
        )

        drop-shadow(
            0 0 24px
            rgba(145, 91, 255, 0.08)
        ) !important;
}
/* =========================================================
   NEXUS ROSTER — FINAL COMPACT CRX CARD SYSTEM

   MATCHES NOVA / ZENITH CARD SCALE

   - Same compact width
   - Same 320px card height
   - Same emblem sizing / placement
   - Same padding
   - 4 Nexus cards centred
   - Nexus keeps cyan / silver / violet identity
========================================================= */


/* =========================================================
   ROSTER SECTION
========================================================= */

.nexus-page .nexus-roster-section {
    padding:
        95px 60px
        115px !important;

    background:
        linear-gradient(
            180deg,
            rgba(2, 8, 20, 0.28),
            rgba(2, 7, 18, 0.48)
        ) !important;
}



/* =========================================================
   HEADING

   Same general width as Nova / Zenith.
========================================================= */

.nexus-page .nexus-roster-section
.team-section-heading {
    width: 100% !important;

    max-width:
        760px !important;

    margin:
        0 auto
        55px !important;
}



/* =========================================================
   GRID

   Nova fits 5 cards inside ~1250px.

   Nexus only has 4 players, so instead of stretching
   them wider, we keep each card at roughly Nova width
   and centre the four-card group.
========================================================= */

.nexus-page .roster-grid,
.nexus-page .nexus-roster-grid {
    width:
        100% !important;

    max-width:
        1250px !important;

    margin:
        0 auto !important;

    display:
        grid !important;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 235px)
        ) !important;

    justify-content:
        center !important;

    align-items:
        stretch !important;

    gap:
        18px !important;
}



/* =========================================================
   CARD

   Match Nova:
   min-height 320px
   padding 24px 22px
========================================================= */

.nexus-page
.roster-card.roster-card-player {
    position:
        relative !important;

    width:
        100% !important;

    min-width:
        0 !important;

    max-width:
        235px !important;

    min-height:
        320px !important;

    height:
        auto !important;

    padding:
        24px
        22px !important;

    display:
        flex !important;

    flex-direction:
        column !important;

    justify-content:
        flex-start !important;

    overflow:
        hidden !important;

    border:
        1px solid
        rgba(
            148,
            193,
            222,
            0.20
        ) !important;

    border-radius:
        0 !important;

    clip-path:
        polygon(
            0 0,
            calc(100% - 20px) 0,
            100% 20px,
            100% 100%,
            20px 100%,
            0 calc(100% - 20px)
        ) !important;

    background:

        radial-gradient(
            circle at 82% 18%,
            rgba(
                92,
                203,
                255,
                0.085
            ),
            transparent 35%
        ),

        radial-gradient(
            circle at 18% 88%,
            rgba(
                140,
                91,
                255,
                0.055
            ),
            transparent 31%
        ),

        linear-gradient(
            145deg,
            rgba(
                8,
                21,
                37,
                0.98
            ),
            rgba(
                5,
                9,
                22,
                0.99
            )
        ) !important;

    box-shadow:
        none !important;

    transition:
        transform
        0.28s ease,
        border-color
        0.28s ease,
        box-shadow
        0.28s ease,
        background
        0.28s ease !important;
}



/* =========================================================
   TOP LINE

   Same width as Nova / Zenith.
========================================================= */

.nexus-page
.roster-card.roster-card-player::before {
    content:
        "" !important;

    position:
        absolute !important;

    top:
        0 !important;

    left:
        0 !important;

    width:
        85px !important;

    height:
        2px !important;

    background:
        linear-gradient(
            90deg,
            #6edfff,
            #dce9ef 38%,
            #9a70ff 72%,
            transparent
        ) !important;

    transition:
        width
        0.35s ease,
        filter
        0.35s ease !important;
}



/* =========================================================
   LOWER CORNER DETAIL
========================================================= */

.nexus-page
.roster-card.roster-card-player::after {
    content:
        "" !important;

    position:
        absolute !important;

    width:
        150px !important;

    height:
        150px !important;

    right:
        -70px !important;

    bottom:
        -80px !important;

    transform:
        rotate(45deg) !important;

    border:
        1px solid
        rgba(
            155,
            192,
            219,
            0.055
        ) !important;

    box-shadow:
        0 0 24px
        rgba(
            139,
            91,
            255,
            0.025
        ) !important;

    pointer-events:
        none !important;
}



/* =========================================================
   NUMBER
========================================================= */

.nexus-page
.roster-card-number {
    position:
        relative !important;

    z-index:
        3 !important;

    color:
        #7896aa !important;

    font-family:
        "Orbitron",
        sans-serif !important;

    font-size:
        11px !important;

    font-weight:
        700 !important;

    letter-spacing:
        2px !important;
}



/* =========================================================
   PLAYER EMBLEM

   THIS NOW MATCHES NOVA:
   105px x 105px
   top-right
========================================================= */

.nexus-page
.player-card-emblem {
    position:
        absolute !important;

    top:
        20px !important;

    right:
        18px !important;

    width:
        105px !important;

    height:
        105px !important;

    max-width:
        105px !important;

    object-fit:
        cover !important;

    object-position:
        center !important;

    border-radius:
        50% !important;

    opacity:
        0.68 !important;

    pointer-events:
        none !important;

    z-index:
        1 !important;

    filter:
        brightness(0.90)
        contrast(1.04)
        saturate(1.04) !important;

    transition:
        opacity
        0.35s ease,
        transform
        0.40s ease,
        filter
        0.35s ease !important;
}



/* =========================================================
   CONTENT POSITION

   Nova uses 82px of upper space beneath the emblem.
========================================================= */

.nexus-page
.roster-card-player
.roster-card-content {
    position:
        relative !important;

    z-index:
        2 !important;

    display:
        flex !important;

    flex-direction:
        column !important;

    height:
        100% !important;

    margin-top:
        82px !important;

    padding-bottom:
        34px !important;
}



/* =========================================================
   TEAM LABEL
========================================================= */

.nexus-page
.roster-card-team {
    margin:
        0 0
        10px !important;

    color:
        #a8dff1 !important;

    font-size:
        9px !important;

    font-weight:
        700 !important;

    letter-spacing:
        1.8px !important;
}



/* =========================================================
   PLAYER NAME
========================================================= */

.nexus-page
.roster-card h3 {
    margin:
        0 0
        10px !important;

    color:
        #ffffff !important;

    font-family:
        "Orbitron",
        sans-serif !important;

    font-size:
        clamp(
            20px,
            2vw,
            28px
        ) !important;

    font-weight:
        600 !important;

    line-height:
        1.1 !important;

    overflow-wrap:
        anywhere;
}



/* Enzelio has the longest name */

.nexus-page
.roster-card:first-child h3 {
    font-size:
        20px !important;

    letter-spacing:
        -0.5px;
}



/* =========================================================
   CRX NAME
========================================================= */

.nexus-page
.roster-card-tag {
    margin:
        0 !important;

    color:
        #7d8c9b !important;

    font-size:
        12px !important;
}



/* =========================================================
   ROLE CHIPS
========================================================= */

.nexus-page
.player-card-details {
    display:
        flex !important;

    flex-wrap:
        wrap !important;

    gap:
        7px !important;

    margin-top:
        18px !important;
}


.nexus-page
.player-card-details span {
    padding:
        6px
        9px !important;

    color:
        #c9eef3 !important;

    background:
        rgba(
            56,
            116,
            137,
            0.16
        ) !important;

    border:
        1px solid
        rgba(
            103,
            215,
            232,
            0.20
        ) !important;

    font-size:
        8px !important;

    font-weight:
        700 !important;

    letter-spacing:
        1.2px !important;

    line-height:
        1 !important;
}


/* Violet variation */

.nexus-page
.player-card-details span:nth-child(even) {
    color:
        #d7c9ff !important;

    background:
        rgba(
            91,
            61,
            142,
            0.16
        ) !important;

    border-color:
        rgba(
            157,
            112,
            255,
            0.22
        ) !important;
}



/* =========================================================
   AGENT POOL
========================================================= */

.nexus-page
.player-card-agent-pool {
    margin:
        12px 0
        0 !important;

    color:
        #808fa0 !important;

    font-size:
        10px !important;

    line-height:
        1.5 !important;
}



/* =========================================================
   QUOTE

   Shared CRX sizing keeps the dividers aligned.
========================================================= */

.nexus-page
.player-card-quote {
    margin-top:
        auto !important;

    width:
        100% !important;

    min-height:
        88px !important;

    height:
        88px !important;

    box-sizing:
        border-box !important;

    padding-top:
        14px !important;

    color:
        #8d98a8 !important;

    font-size:
        11px !important;

    line-height:
        1.55 !important;

    border-top:
        1px solid
        rgba(
            114,
            198,
            225,
            0.14
        ) !important;
}


.nexus-page
.quote-credit {
    display:
        block !important;

    margin-top:
        5px !important;

    color:
        #68778a !important;

    font-size:
        9px !important;
}



/* =========================================================
   HOVER
========================================================= */

.nexus-page
.roster-card.roster-card-player:hover {
    transform:
        translateY(-6px) !important;

    border-color:
        rgba(
            150,
            221,
            244,
            0.55
        ) !important;

    background:

        radial-gradient(
            circle at 80% 20%,
            rgba(
                91,
                206,
                255,
                0.14
            ),
            transparent 38%
        ),

        radial-gradient(
            circle at 18% 88%,
            rgba(
                145,
                91,
                255,
                0.09
            ),
            transparent 31%
        ),

        linear-gradient(
            145deg,
            rgba(
                9,
                29,
                46,
                0.99
            ),
            rgba(
                6,
                10,
                24,
                0.99
            )
        ) !important;

    box-shadow:
        0 18px 38px
        rgba(
            0,
            0,
            0,
            0.34
        ),

        0 0 15px
        rgba(
            92,
            203,
            255,
            0.09
        ),

        0 0 27px
        rgba(
            143,
            91,
            255,
            0.07
        ) !important;
}



/* =========================================================
   TOP LINE HOVER
========================================================= */

.nexus-page
.roster-card.roster-card-player:hover::before {
    width:
        150px !important;

    filter:
        drop-shadow(
            0 0 5px
            rgba(
                222,
                246,
                255,
                0.44
            )
        )

        drop-shadow(
            0 0 11px
            rgba(
                87,
                204,
                255,
                0.25
            )
        )

        drop-shadow(
            0 0 15px
            rgba(
                151,
                99,
                255,
                0.16
            )
        ) !important;
}



/* =========================================================
   EMBLEM HOVER
========================================================= */

.nexus-page
.roster-card-player:hover
.player-card-emblem {
    opacity:
        1 !important;

    transform:
        scale(1.08)
        rotate(2deg) !important;

    filter:
        brightness(1.08)
        contrast(1.05)
        saturate(1.08)

        drop-shadow(
            0 0 7px
            rgba(
                100,
                211,
                255,
                0.17
            )
        )

        drop-shadow(
            0 0 18px
            rgba(
                145,
                92,
                255,
                0.12
            )
        ) !important;
}



/* =========================================================
   ROLE HOVER
========================================================= */

.nexus-page
.roster-card-player:hover
.player-card-details span {
    color:
        #e7fbff !important;

    border-color:
        rgba(
            107,
            220,
            239,
            0.40
        ) !important;
}


.nexus-page
.roster-card-player:hover
.player-card-details span:nth-child(even) {
    color:
        #eee6ff !important;

    border-color:
        rgba(
            166,
            124,
            255,
            0.42
        ) !important;
}



/* =========================================================
   TABLET

   2 compact cards instead of stretching.
========================================================= */

@media (max-width: 1050px) {

    .nexus-page .roster-grid,
    .nexus-page .nexus-roster-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 235px)
            ) !important;
    }

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .nexus-page
    .nexus-roster-section {
        padding:
            75px 20px
            90px !important;
    }


    .nexus-page .roster-grid,
    .nexus-page .nexus-roster-grid {
        grid-template-columns:
            minmax(
                0,
                320px
            ) !important;

        justify-content:
            center !important;

        gap:
            18px !important;
    }


    .nexus-page
    .roster-card.roster-card-player {
        max-width:
            320px !important;

        min-height:
            320px !important;
    }

}
/* =========================================================
   UNKNOWN.EXE — LONG NAME FIX
========================================================= */

.nexus-page
.roster-card:nth-child(5)
h3 {
    font-size: 18px !important;
    letter-spacing: -0.5px !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}