@font-face {

    font-family: "NEW ACADEMY";

    src: url("NewAcademy.woff2") format("woff2");
	font-display: block;
    font-weight: normal;
    font-style: normal;
	


}


:root{

    --bg:#000000;

    --text:#b7d8b1;

    --bright:#d9f5d4;

    --dim:#7f9d79;

    --hover:#333333;
	
    --startup-delay: .35s;
}

*{

    margin:0;

    padding:0;

    box-sizing:border-box;

}


html{

    min-height:100%;

}


body{

    min-height:100%;

    background:var(--bg);

    color:var(--text);

    font-family:
        "NEW ACADEMY",
        "Lucida Console",
        "Courier New",
        monospace;

    font-size:16px;

    line-height:1.65;

    overflow-x:hidden;

    animation:flicker 18s infinite;

}





.background-video{

    position:fixed;

    inset:0;

    width:100%;

    height:100%;

    object-fit:cover;

    opacity:.05;

    z-index:-1;

}





.terminal {
    width: 0;
    margin: 5px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}





.line,
.cmd{

    display:block;

    width: 0;

    opacity:0;

    overflow:hidden;

    white-space:nowrap;


    animation:

        reveal .01s forwards,

        typing .08s steps(var(--chars), end) forwards;


    animation-delay:

        calc(var(--startup-delay) + var(--d) * .08s),

        calc(var(--startup-delay) + var(--d) * .08s);

}


.title{

    color:var(--bright);

}






.cmd{

    width:fit-content;

    color:var(--text);

    text-decoration:none;

    padding:2px 6px;

}



.cmd:hover{

    background:var(--hover);

    color:#ffffff;

}






.cmd.steam{

    color:var(--bright);

    font-size:18px;

    font-weight:bold;


    animation:

        reveal .01s forwards,
        typing .08s steps(var(--chars), end) forwards,
        steamPulse 1.2s infinite;


    animation-delay:

        calc(var(--startup-delay) + var(--d) * .08s),

        calc(var(--startup-delay) + var(--d) * .08s),

        2.8s;

}



.cmd.steam:hover{

    background:#444;

}

.cmd{

    padding:3px 8px;

    border-left:2px solid transparent;

    transition:
        background .15s ease,
        border-color .15s ease,
        color .15s ease;

}

.cmd:hover{

    background:#333;

    border-left:2px solid var(--bright);

    color:white;

}






.cursor{

    display:inline-block;

    width:.65em;

    height:1em;

    background:var(--bright);

    margin-left:3px;

    vertical-align:-2px;

    animation:cursor .85s steps(1) infinite;

}






.secret{

    display: block;
    white-space: nowrap;

    margin-top:0px;

    color:transparent;

    opacity:0;

    transition:

        color .3s ease,

        opacity .3s ease;

    cursor:default;

}



.secret:hover{

    color:var(--text);

    opacity:1;

}







.scanlines{

    position:fixed;

    inset:0;

    pointer-events:none;

    opacity:.035;


    background:

    repeating-linear-gradient(

        to bottom,

        rgba(255,255,255,.15) 0,

        rgba(255,255,255,.15) 1px,

        transparent 2px,

        transparent 4px

    );

}






@keyframes reveal{

    to{

        opacity:1;

    }

}



@keyframes typing{

    from{

        width:0;

    }


    to{

        width:calc(var(--chars) * 1ch);

    }

}



@keyframes cursor{

    0%,
    49%{

        opacity:1;

    }


    50%,
    100%{

        opacity:0;

    }

}



@keyframes steamPulse{

    0%,100%{
        color:var(--bright);
    }

    50%{
        color:white;
        background:#111;
    }

}



@keyframes flicker{


    0%,
    96%,
    100%{

        opacity:1;

    }


    97%{

        opacity:.985;

    }


    98%{

        opacity:1;

    }

}