@import url('https://fonts.googleapis.com/css2?family=Inconsolata:wght@200..900&family=Red+Hat+Mono:ital,wght@0,300..700;1,300..700&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');


 body {
            font-family: "Roboto", sans-serif;
            font-optical-sizing: auto;
            font-weight: 100;
            font-style: normal;
            font-variation-settings:"wdth" 100;


        }


@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
.animate-fadeInUp {
    animation: fadeInUp 0.6s ease-out forwards;
    }
html {
    scroll-behavior: smooth;
}

        .test{
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }

        .box {
            background: #fff;
            padding: 30px;
            border-radius: 8px;
            width: 420px;
            box-shadow: 0 0 10px rgba(0,0,0,0.1);
        }

        h2 {
            text-align: center;
            margin-bottom: 20px;
        }

        .status {
            margin: 15px 0;
            padding: 12px;
            border-radius: 5px;
            font-weight: bold;
        }

        .ok {
            background: #d4edda;
            color: #155724;
        }

        .fail {
            background: #f8d7da;
            color: #721c24;
        }

        .testing {
            background: #fff3cd;
            color: #856404;
        }

        .info {
            font-weight: normal;
            margin-top: 5px;
            font-size: 14px;
        }