body {
    background-color: var(--ctp-mocha-crust);
    color: var(--ctp-mocha-text);
    fill: var(--ctp-mocha-text);
    font-family: "Segoe UI", Helvetica, Arial, sans-serif;
    padding: 0 1rem;
    margin: 0;
}

a {
    color: var(--ctp-mocha-subtext0);
}

.grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 1rem;
}

.grid-item {
    background-color: var(--ctp-mocha-base);
    border-radius: 1rem;
    padding: 1rem;
}

.avatar {
    border-radius: 50%;
    float: left;
}

.profile-data {
    padding-left: 144px;
}

.stats {
    display: inline-block;
    margin-right: 0.75rem;
}

.icon {
    display: inline-block;
    vertical-align: -8%;
}

.topic {
    background-color: var(--ctp-mocha-surface0);
    color: var(--ctp-mocha-blue);
    display: inline-block;
    border-radius: 1rem;
    padding: 0 0.4rem 0.15rem;
    margin: 0.2rem;
}