main {
    font-family: 'Consolas', monospace;
    font-size: 12pt;

    h1 {
        text-align: center;
        font-size: clamp(2em, 5vw, 3em);
        margin-bottom: 50px;
    }

    .main-content {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
        gap: 10px;
    }
}

.column {
    width: 400px;
    height: 600px;
    outline: 1px dashed rgb(199, 186, 2);
    padding: 10px;

    display: flex;
    flex-direction: column;
    gap: 10px;

    .content {
        padding: 10px;
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
        justify-content: space-around;
        overflow: auto;
        scrollbar-width: thin;
    }
}

.cache {

    margin-top: auto;
    height: 300px;
    border: 1px solid gray;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 20px;

    h3 {
        text-align: center;
    }

    .info {
        display: flex;
        justify-content: space-between;
    }

    .items-list {
        padding-left: 4ch;
        padding-right: 10px;
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        gap: 5px;
        overflow: auto;
        padding-block: 10px;
        scrollbar-width: thin;


        .item {
            display: flex;
            justify-content: space-between;

            a {
                text-decoration: none;
                color: var(--color-cyan);
            }

            a:hover {
                text-decoration: underline;
            }

            span.size {
                color: var(--color-yellow);
            }
        }
    }

    .progress {

        display: flex;
        flex-direction: column;
        gap: 10px;

        progress {
            width: 100%;
            height: 20px;
        }
    }

    span {
        font-weight: bold;
    }

    span.max-entries {
        color: var(--color-blue);
    }

    span.max-size {
        color: var(--color-green);
    }

    span.current-entries {
        color: var(--color-yellow);
    }

    span.current-size {
        color: var(--color-purple);
    }
}