:root {
    --main-font: 'Main Font', 'Main Font SC', 'Times New Roman', Times, serif;
    --sans-font: 'Sans Font', 'Sans Font SC',
        'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande',
        'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    --mono-font: 'Mono Font', 'Sans Font SC', 'Courier New', Courier, monospace;
}

@font-face {
    font-family: 'Main Font';
    src: url(/static/fonts/Main.ttf) format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Main Font SC';
    src: url(/static/fonts/MainSC.ttf) format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Sans Font';
    src: url(/static/fonts/Sans.ttf) format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Sans Font SC';
    src: url(/static/fonts/SansSC.ttf) format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Mono Font';
    src: url(/static/fonts/Mono.ttf) format('truetype');
    font-display: swap;
}

* {
    box-sizing: border-box;
}


html,
body {
    background: var(--bg);
    color: var(--text);
}


body {
    font-family: var(--main-font);
}

code,
pre {
    font-family: var(--mono-font) !important;
}


p.tips {
    color: var(--muted);
    font-size: 13px;
    line-height: 25px;
}

p.tips a {
    color: inherit;
    text-decoration: none;
}

p.tips a:hover {
    color: var(--primary);
}

.disabled {
    cursor: not-allowed !important;
    opacity: .6;
}

.hidden {
    display: none !important;
}

.katex {
    font-size: 1em;
}

p.katex-block {
    overflow-x: auto;
}

.markdown-body {
    font-family: var(--main-font);
}

#loading-bar {
    position: fixed;
    top: 0;
    left: 0;
    width: 0;
    height: 3px;
    background: var(--strong-accent);
    z-index: 9999;
    transition: width 0.3s ease;
}

#loading-bar.running {
    width: 70%;
    transition: width 3s cubic-bezier(0.1, 0.7, 0.5, 1);
}

#loading-bar.done {
    width: 100%;
    transition: width 0.2s ease;
    opacity: 0;
    transition: width 0.2s ease, opacity 0.3s ease 0.2s;
}