body {
    font-family: 'GowunDodum', system-ui, sans-serif;
    color: var(--text-color);
    font-size: 1rem;
    min-height: 100vh;
    height: auto;
    background: var(--body-bg-color) linear-gradient(
        to bottom,
        var(--body-bg-color2) 0%,
        var(--body-bg-color3) 50%,
        var(--body-bg-color) 100%
    );
    background-size: 100% 100%;
    position: relative;
    display: flex;
    flex-direction: column;
}

body::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(var(--bg-white-02) 1px, var(--transparent) 1px),
        linear-gradient(90deg, var(--bg-white-02) 1px, var(--transparent) 1px);
    background-size: 2px 2px;
    opacity: 0.5;
    pointer-events: none;
}

main {
    flex-grow: 1;
}

.external-link::after {
    content: " ↗";
    font-size: 0.85em;
    display: inline-block;
    margin-left: 0.2em;
    vertical-align: baseline;
    text-decoration: none;
}