main {

    display: flex;
    flex-direction: column;
    align-items: center;

    table {
        width: 100%;
        border-spacing: 0;

        thead {
            user-select: none;

            tr {
                th {
                    font-weight: normal;
                    border-right: 1px solid rgb(from var(--panel-border-primary) r g b / calc(alpha / 3));
                    position: relative;
                }
                th:last-child {
                    border-right: none;
                }
                th[data-sort-asc]::after {
                    color: rgb(from var(--panel-fg) r g b / calc(alpha / 2));
                    position: absolute;
                    transform: translateX(1mm);
                }
                th[data-sort-asc="true"]::after {
                    content: "▲"
                }
                th[data-sort-asc="false"]::after {
                    content: "▼"
                }
            }
        }
        tbody {
            tr {
                td {
                    border: 1px solid transparent;
                    border-left: none;
                    border-right: none;
                    padding: 0 2mm 0 2mm;
                }
                td:first-child {
                    border-radius: 1mm 0 0 1mm;
                    border: 1px solid transparent;
                    border-right: none;
                }
                td:last-child {
                    border-radius: 0 1mm 1mm 0;
                    border: 1px solid transparent;
                    border-left: none;
                }
                td:not(:nth-child(1)) {
                    color: rgba(0, 0, 0, .5);
                    color: rgb(from var(--panel-fg) r g b / calc(alpha / 2))
                }
                td.name {
                    display: flex;
                    flex-direction: row;
                    gap: 2mm;
                    img.thumb {
                        height: 1em;
                        width: 1em;
                    }
                }
            }
            tr:hover {
                td {
                    border-color: var(--panel-border-primary);
                }
            }
        }
    }

    div.readme {
        padding: 2mm;
        max-width: 100%;
        width: 8.5in;
        img {
            width: 100%;
        }
        a {
            text-decoration: underline;
        }
    }

    div.error {
        padding: 2mm;
        text-align: center;
    }
}