* {
    box-sizing:border-box;
}


body {

    font-family:
    "Courier New",
    monospace;

    overflow:hidden;

}


#boot-screen {
    width:100vw;
    height:100vh;

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    padding:20px;

    opacity:0;
    animation:fadeIn 2s forwards;

    overflow:hidden;
}


#identity {
	width: 60%;
	max-width: 500px;
	height: auto;

    opacity:0;
    animation:reveal 2s 1s forwards;
}


h1 {
    font-size:clamp(1.8rem, 8vw, 3rem);

    letter-spacing:
    clamp(0.15rem, 1vw, 0.4rem);

    margin:0;

    white-space:nowrap;
}


h2 {

    font-size:
    clamp(0.7rem, 3vw, 1.2rem);

    letter-spacing:
    clamp(0.15rem, 1vw, 0.5rem);

    margin-top:20px;

}



#terminal {

    width:min(600px, 90vw);

    min-height:250px;

    margin-top:50px;

    font-size:
    clamp(0.75rem, 2.8vw, 1rem);

    opacity:0;

    animation:reveal 1s 3s forwards;

}



#terminal-output {

    line-height:1.6;

    overflow-wrap:anywhere;

}



#progress-container {

    width:100%;

    height:
    clamp(8px, 2vw, 15px);

}


#progress-bar {

    width:0%;

    height:100%;

    background:#ddd;

}


#percent {

    margin-top:10px;

}



.cursor {

    animation:
    blink 1s infinite;

}



@keyframes fadeIn {

    to {
        opacity:1;
    }

}



@keyframes reveal {

    to {
        opacity:1;
    }

}


@keyframes blink {

    50% {
        opacity:0;
    }

}