/*
 * Hubbo Prime v39.2.6.2 — Global Background Consistency
 *
 * One backdrop for every public page using the Prime app layout.
 * Page-specific cards, heroes and accent colors remain untouched.
 */

:root{
    --hp-global-bg-base:#010403;
    --hp-global-bg-image:url('/assets/images/dusk/background_image.png');
}

html{
    background:var(--hp-global-bg-base);
}

body.hubbo-prime-body,
body.hubbo-prime-body.hp-help-context,
body.hubbo-prime-body.hp-frontier-rooms-context,
body.hubbo-prime-body.hp-nexus-friends-context{
    position:relative;
    isolation:isolate;
    min-height:100vh;
    background:var(--hp-global-bg-base)!important;
}

.hp-prime-global-bg{
    position:fixed;
    inset:0;
    z-index:0;
    overflow:hidden;
    pointer-events:none;
    background:
        linear-gradient(
            180deg,
            rgba(4,13,9,.78),
            rgba(2,7,5,.96) 72%,
            rgba(1,4,3,.98)
        ),
        radial-gradient(
            circle at 16% 8%,
            rgba(142,219,50,.18),
            transparent 34%
        ),
        radial-gradient(
            circle at 82% 12%,
            rgba(42,121,70,.18),
            transparent 36%
        ),
        var(--hp-global-bg-image) center top / cover fixed no-repeat;
    filter:saturate(.78);
}

.hp-prime-global-bg::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.40),
            rgba(0,0,0,.08) 42%,
            rgba(0,0,0,.50)
        ),
        radial-gradient(
            circle at 50% 0%,
            rgba(142,219,50,.08),
            transparent 38%
        );
    opacity:.96;
}

.hp-prime-global-bg::after{
    content:"";
    position:absolute;
    inset:0;
    opacity:.045;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.52'/%3E%3C/svg%3E");
    mix-blend-mode:soft-light;
}

.hp-prime-global-bg__glow{
    position:absolute;
    width:520px;
    height:520px;
    border-radius:50%;
    filter:blur(92px);
    opacity:.13;
}

.hp-prime-global-bg__glow--left{
    top:3%;
    left:-250px;
    background:rgba(142,219,50,.42);
}

.hp-prime-global-bg__glow--right{
    top:20%;
    right:-270px;
    background:rgba(56,135,78,.38);
}

/*
 * All public content stays above the single shared fixed backdrop.
 */
body.hubbo-prime-body > .hubbo-site-shell,
body.hubbo-prime-body > .hp-footer,
body.hubbo-prime-body > .hp-footer-prime{
    position:relative;
    z-index:1;
}

body.hubbo-prime-body .hp-page{
    position:relative;
    z-index:1;
    background:transparent;
}

/*
 * Disable old page-specific backdrop elements. These elements exist only for
 * background rendering; hiding them does not alter page content or layouts.
 */
.hp-home__background,
.hp-home__glow,
.hp-auth-bg,
.hp-auth-glow,
.hp-changelog-bg,
.hp-article-bg,
.hp-news-bg,
.hp-ascend-bg,
.hp-horizon__background,
.hp-identity-bg,
.hp-nexus-bg,
.hp-frontier-bg,
.hp-rulebook-bg,
.hp-unity-community-bg,
.hp-legacy-bg,
.hp-me-bg,
.hp-public-profile__bg,
.hubbo-legal-page__bg{
    display:none!important;
}

/*
 * A few wrappers painted an additional solid or gradient page background.
 * Keep their spacing and structure while making only the backdrop transparent.
 */
.hp-home,
.hp-auth-page{
    background:transparent!important;
}

.hp-home::before,
.hp-home::after{
    display:none!important;
}

/*
 * Ticket pages previously painted their own background through a pseudo layer.
 */
.hp-ticket-page::before{
    display:none!important;
}

/*
 * Preserve the fixed global image on mobile browsers without relying on
 * background-attachment: fixed, which is inconsistently supported on iOS.
 */
@media(max-width:760px){
    .hp-prime-global-bg{
        background-attachment:scroll;
        background-position:center top;
    }

    .hp-prime-global-bg__glow{
        width:360px;
        height:360px;
        filter:blur(74px);
        opacity:.10;
    }
}

@media(prefers-reduced-motion:reduce){
    .hp-prime-global-bg,
    .hp-prime-global-bg *{
        animation:none!important;
        transition:none!important;
    }
}

/* Hubbo Prime v39.2.6.3 — Remaining Background Exceptions Hotfix */

/*
 * Hilfezentrum:
 * The Horizon wrapper still painted its own solid gradient, noise pseudo-layer
 * and two module-specific glows after the original background element had
 * already been hidden.
 */
body.hubbo-prime-body.hp-help-context .hp-horizon{
    background:transparent!important;
}

body.hubbo-prime-body.hp-help-context .hp-horizon::after,
body.hubbo-prime-body.hp-help-context .hp-horizon__glow{
    display:none!important;
}

/*
 * Unser Team:
 * The team page renders two fixed full-viewport layers through pseudo-elements.
 * They must not sit above the shared Prime backdrop.
 */
body.hubbo-prime-body .hp-team-page::before,
body.hubbo-prime-body .hp-team-page::after{
    display:none!important;
}

/*
 * /user/me:
 * The dashboard template contains a late inline stylesheet with a dedicated
 * full-page gradient. The important override is required because that inline
 * stylesheet is emitted after the global stylesheet in the document body.
 */
body.hubbo-prime-body .hp-me-page{
    background:transparent!important;
}