* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: terminus, monospace;
}
@font-face {
    font-family: "terminus";
    src: url("/res/terminus.woff2");
}

:root {
    --cl-colour: #a883ff;
    --fg-colour: #4b3460;
    --bg-colour: #f7f5fe;
    --a-colour: #0000ee;
    --system-colour: #a43029;
}

body {
    color: var(--fg-colour);
    background-color: var(--bg-colour);
}

main {
    font-size: 12px;
    padding: 12px;
    width: 640px;
}

t-system {
    color: var(--system-colour);
    display: block;

    &:before {
        content: "-- ";
    }
    &:after {
        content: " --";
    }
    &:before, &:after {
        display: inline-block;
        white-space: pre;
    }
}

t-cl {
    color: var(--cl-colour);

    main > & {
        display: block;
        &:before {
            content: "CL: ";
        }
    }
}

a {
    color: var(--a-colour);
    width: fit-content;
    
    main > & {
        display: block;
        
        &:before {
            content: "> ";
            color: var(--fg-colour);
            text-decoration: none;
            display: inline-block;
            white-space: pre;
        }
    }
}