@import"https://fonts.googleapis.com/css2?family=Kode+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";@import"https://fonts.googleapis.com/css2?family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";:root {
    font-family: Kode Mono,monospace!important;
    line-height: 1.5;
    font-weight: 400;
    background-color: #151515
}

body {
    margin: 0;
    padding: 0;
    min-width: 320px;
    min-height: 100vh;
    opacity: 0;
    animation: fadeIn 1.5s ease-in-out forwards
}

::-webkit-scrollbar {
    display: none
}

@keyframes blink {
    0%,to {
        border-color: #fff
    }

    50% {
        border-color: red
    }
}

.blink {
    animation: blink 2s infinite
}

@keyframes spin {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

@keyframes fadeIn {
    to {
        opacity: 1
    }
}

.diagonal-glow {
    overflow: hidden
}

.diagonal-glow img {
    display: block;
    width: 100%;
    height: auto
}

.diagonal-glow:after {
    content: "";
    position: absolute;
    top: -100px;
    left: -100px;
    width: 4px;
    height: 200px;
    background: linear-gradient(120deg,#fff0,#fff6,#fff0);
    transform: rotate(45deg);
    z-index: 0;
    pointer-events: none;
    animation: diagonalShine 2.5s infinite;
    filter: blur(2px);
    box-shadow: 0 0 20px #fff3;
    mix-blend-mode: screen
}

@keyframes diagonalShine {
    0% {
        top: -500px;
        left: -100px
    }

    60% {
        top: 100%;
        left: 100%
    }

    to {
        top: 100%;
        left: 100%
    }
}

@keyframes glowEffect {
    0% {
        box-shadow: 0 0 5px #00954f80,0 0 10px #00954f80
    }

    50% {
        box-shadow: 0 0 10px 3px #00954fb3,0 0 15px 5px #00954f99
    }

    to {
        box-shadow: 0 0 5px #00954f80,0 0 10px #00954f80
    }
}

.glow {
    animation: glowEffect 1.5s infinite alternate
}

.MuiSkeleton-root {
    background: #232323!important
}

@keyframes fadeUp {
    0% {
        opacity: 0;
        transform: translateY(16px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.fade-up {
    opacity: 0;
    animation: fadeUp 1s ease forwards;
    animation-delay: .2s
}
