.lists-page {
    --lists-ink: #232323;
    --lists-border: #dddddd;
    --lists-muted: #666666;
    --lists-card: #ffffff;
    max-width: 78rem;
    margin: 0 auto 3rem;
}

.lists-head {
    margin-bottom: 1.4rem;
}

.lists-head p {
    margin: -1rem 0 0;
    color: var(--lists-muted);
    font-size: 0.88rem;
    line-height: 1.55;
    text-align: center;
}

.list-card-title a,
.list-card-preview a,
.list-card-footer a {
    text-decoration: none;
}

.lists-section {
    margin-top: 0.85rem;
}

.lists-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.list-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: 0.9rem 0.95rem;
    border-radius: 4px;
    border: 1px solid var(--lists-border);
    background: var(--lists-card);
    transition: border-color 160ms ease;
}

.list-card:hover {
    border-color: #cfcfcf;
}

.list-card-title {
    margin-top: 0;
}

.list-card-title a {
    color: var(--lists-ink);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.45;
}

.list-card-title a:visited {
    color: var(--lists-ink);
}

.list-card-desc {
    margin-top: 0.35rem;
    color: var(--lists-muted);
    font-size: 0.85rem;
    line-height: 1.55;
    word-break: keep-all;
}

.list-card-preview {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #eeeeee;
}

.list-card-preview ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.list-card-preview li + li {
    margin-top: 0.6rem;
    padding-top: 0.6rem;
    border-top: 1px solid #f1f1f1;
}

.list-card-preview a {
    color: var(--lists-ink);
    font-size: 0.88rem;
    line-height: 1.5;
    word-break: keep-all;
}

.list-card-preview-meta {
    margin-top: 0.18rem;
    color: var(--lists-muted);
    font-size: 0.76rem;
}

.list-card-footer {
    margin-top: auto;
    padding-top: 0.7rem;
}

.list-card-footer a {
    color: var(--lists-muted);
    font-size: 0.82rem;
    font-weight: 400;
    border-bottom: 1px solid currentColor;
    transition: color 120ms ease, border-color 120ms ease;
}

.list-card-footer a:hover {
    color: var(--lists-ink);
    border-bottom-color: var(--lists-ink);
}

@media only screen and (max-width: 760px) {
    .lists-page {
        margin-bottom: 2rem;
    }

    .lists-grid {
        grid-template-columns: 1fr;
    }
}

@media (prefers-color-scheme: dark) {
    .lists-page {
        --lists-ink: #e3e3e3;
        --lists-border: #4a4a4a;
        --lists-muted: #a3a3a3;
        --lists-card: #2a2a2a;
    }

    .list-card-preview {
        border-top-color: #454545;
    }

    .list-card-preview li + li {
        border-top-color: #3f3f3f;
    }

    .list-card-preview a {
        color: var(--lists-ink);
    }
}