/* FORTI_FINAL_SCREEN_START */

body.forti-final-open {
    overflow: hidden !important;
}


.forti-final-overlay[hidden] {
    display: none !important;
}


.forti-final-overlay {
    position: fixed;
    inset: 0;

    z-index: 2147483646;

    display: grid;
    place-items: center;

    padding: 24px;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 50% 35%,
            rgba(144, 115, 62, .24),
            transparent 42%
        ),
        linear-gradient(
            145deg,
            #090908,
            #16130e 52%,
            #080807
        );

    color: #f4ead5;

    text-align: center;
}


.forti-final-card {
    position: relative;
    z-index: 2;

    width: min(680px, 94vw);

    padding:
        clamp(32px, 6vw, 66px)
        clamp(22px, 6vw, 60px);

    border:
        1px solid rgba(210, 179, 112, .42);

    border-radius: 8px;

    background:
        rgba(11, 10, 8, .82);

    box-shadow:
        0 32px 90px rgba(0,0,0,.7),
        inset 0 0 80px rgba(178,137,65,.05);

    backdrop-filter: blur(8px);
}


.forti-final-kicker {
    margin-bottom: 22px;

    color: #bfa36c;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .22em;
}


.forti-final-check {
    width: 72px;
    height: 72px;

    margin:
        0 auto 22px;

    display: grid;
    place-items: center;

    border:
        1px solid #c8ab70;

    border-radius: 50%;

    color: #e6cd99;

    font-family:
        Georgia,
        serif;

    font-size: 38px;
}


.forti-final-card h1 {
    margin:
        0 0 8px;

    color: #fff8e9;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(
            38px,
            8vw,
            72px
        );

    font-weight: 400;

    letter-spacing: .025em;
}


.forti-final-card h2 {
    margin:
        0 0 34px;

    color: #c6aa70;

    font-size:
        clamp(
            15px,
            3vw,
            21px
        );

    letter-spacing: .16em;
}


.forti-final-main {
    max-width: 470px;

    margin:
        0 auto 22px;

    color: #ded3bd;

    font-size:
        clamp(
            16px,
            3vw,
            20px
        );

    line-height: 1.6;
}


.forti-final-name {
    margin:
        10px 0 30px;

    color: #fff2d1;

    font-family:
        Georgia,
        serif;

    font-size:
        clamp(
            27px,
            6vw,
            44px
        );

    letter-spacing: .08em;
}


.forti-final-reward {
    display: inline-block;

    margin:
        0 auto 20px;

    padding:
        12px 18px;

    border:
        1px solid
        rgba(215, 180, 106, .55);

    background:
        rgba(169, 128, 54, .12);

    color: #e2c687;

    font-size: 12px;
    font-weight: 800;

    letter-spacing: .15em;
}


.forti-final-small {
    margin:
        0 0 30px;

    color: #958a76;

    font-size: 14px;
}





.forti-final-stars {
    position: absolute;
    inset: 0;

    overflow: hidden;

    pointer-events: none;
}


.forti-final-stars i {
    --x:
        calc(
            (var(--i) * 37)
            % 100
        );

    position: absolute;

    top: -10%;

    left:
        calc(
            (var(--i) * 37)
            % 100
            * 1%
        );

    width:
        calc(
            4px
            + (var(--i) % 4) * 2px
        );

    height:
        calc(
            10px
            + (var(--i) % 5) * 3px
        );

    background:
        rgba(
            210,
            174,
            102,
            .72
        );

    transform:
        rotate(
            calc(
                var(--i) * 19deg
            )
        );

    animation:
        fortiFinalFall
        calc(
            4s
            + (var(--i) % 5) * .7s
        )
        linear
        calc(
            (var(--i) % 7) * -.6s
        )
        infinite;
}


@keyframes fortiFinalFall {

    from {
        transform:
            translateY(-10vh)
            rotate(0deg);

        opacity: 0;
    }

    12% {
        opacity: .9;
    }

    to {
        transform:
            translateY(115vh)
            rotate(420deg);

        opacity: .15;
    }
}

/* FORTI_FINAL_SCREEN_END */
