@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300&display=swap');

:root {
    --height: 3vh;
}

html, body {
    background-color: #131313;
    margin: 1.5vh;
}

* {
    font-family: 'JetBrains Mono', monospace;
}

#console {
    font-size: 2.5vh;
    position: relative;
    display: inline-block;
    line-height: 3.1vh;
    color: #dedede;
}

#console a {
    color: #CD5C5C;
}

.prompt, .body {
    display: inline-block;
}

.body {
    overflow-wrap: anywhere;
}

.console-line {
    margin-bottom: 1vh;
}

.console-line.active .body::after {
    content: "";
    display: inline-block;
    background-color: #d0d0d0;
    vertical-align: bottom;
    position: relative;
    width: 1.5vh;
    height: var(--height);
    -webkit-animation: blink 1s step-end infinite;
    animation: blink 1s step-end infinite;
}

.stdout {
    color: #dedede;
    margin: 0 0 1vh 0;
    overflow-wrap: anywhere;
}

@-webkit-keyframes blink {
    0% {
        opacity: 1.0;
    }
    50% {
        opacity: 0.0;
    }
    100% {
        opacity: 1.0;
    }
}

@keyframes blink {
    0% {
        opacity: 1.0;
    }
    50% {
        opacity: 0.0;
    }
    100% {
        opacity: 1.0;
    }
}
