body {
    background: radial-gradient(circle at center, #171033 0%, #05000d 45%, #000000 100%);

    color: white;

    font-family: "Courier New", monospace;

    height: 100vh;
    margin: 0;

    display: flex;
    justify-content: center;
    align-items: center;

    cursor: none;

    overflow: hidden;
}


h1 {
    color: #ff66ff;
    text-shadow: 0 0 10px #ff66ff;
}


/* Custom lemon cursor */
.cursor {
    position: absolute;

    width: 40px;
    height: 40px;

    background-image: url("images/lemon.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    pointer-events: none;

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

    z-index: 9999;
}


/* Pink sparkle trail */
.sparkle {
    position: absolute;

    width: 8px;
    height: 8px;

    background: pink;

    border-radius: 50%;

    pointer-events: none;

    animation: disappear 0.8s forwards;
}


@keyframes disappear {

    from {
        opacity: 1;
        transform: scale(1);
    }

    to {
        opacity: 0;
        transform: scale(0);
    }

}


/* Moving stars */
body::before {

    content: "";

    position: fixed;

    top: 0;
    left: 0;

    width: 200%;
    height: 200%;

    background-image:
        radial-gradient(circle, white 1px, transparent 1px),
        radial-gradient(circle, white 1px, transparent 1px);

    background-size:
        120px 120px,
        200px 200px;

    background-position:
        0 0,
        40px 60px;

    opacity: 0.35;

    animation: starsMove 40s linear infinite;

    pointer-events: none;

    z-index: -1;
}


@keyframes starsMove {

    from {
        transform: translate(0,0);
    }

    to {
        transform: translate(-200px,-200px);
    }

}


/* SECRET EASTER EGG */

.secret-reveal {

    position: fixed;

    bottom: 80px;
    right: 80px;

    width: 80px;
    height: 80px;

    z-index: 100;

}


.secret-image {

    width: 150px;

    opacity: 0;

    transform: scale(0);

    transition: all 0.3s ease;

}


.secret-reveal:hover .secret-image {

    opacity: 1;

    transform: scale(1);

}.secret-page {

    text-align: center;

    max-width: 600px;

}


.secret-page h1 {

    color: #66ffff;

    text-shadow:
        0 0 10px #66ffff,
        0 0 20px #ff66ff;

}


.secret-page p {

    color: pink;

    font-size: 18px;

    line-height: 1.8;

}


.secret-page-image {

    width: 200px;

    margin: 30px;

    animation: float 3s infinite ease-in-out;

}


@keyframes float {

    0% {
        transform: translateY(0px);
    }

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

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

}