body {
    font-family: sans-serif;
    font-size: 18px;
    margin: auto;
    width: 95%;
    padding-bottom: 20px;
}
a {
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
table,
th,
td {
    border: 1px solid gray;
    border-collapse: collapse;
    padding: 3px 5px 3px 5px;
}

table.sortable {
	box-shadow:
		rgba(50, 50, 93, 0.25) 0px 6px 12px -2px,
		rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
	text-wrap: balance;
}
table.sortable th.sortable {
	cursor: pointer;
}

p.description, p.changelog {
    white-space: pre-line;
}

:has([aria-controls="panel-1"] input[type="radio"]:not(:checked)) #panel-1,
:has([aria-controls="panel-2"] input[type="radio"]:not(:checked)) #panel-2,
:has([aria-controls="panel-3"] input[type="radio"]:not(:checked)) #panel-3,
:has([aria-controls="panel-4"] input[type="radio"]:not(:checked)) #panel-4,
:has([aria-controls="panel-5"] input[type="radio"]:not(:checked)) #panel-5,
:has([aria-controls="panel-6"] input[type="radio"]:not(:checked)) #panel-6,
:has([aria-controls="panel-7"] input[type="radio"]:not(:checked)) #panel-7,
:has([aria-controls="panel-8"] input[type="radio"]:not(:checked)) #panel-8,
:has([aria-controls="panel-9"] input[type="radio"]:not(:checked)) #panel-9,
:has([aria-controls="panel-10"] input[type="radio"]:not(:checked)) #panel-10,
:has([aria-controls="panel-11"] input[type="radio"]:not(:checked)) #panel-11,
:has([aria-controls="panel-12"] input[type="radio"]:not(:checked)) #panel-12,
:has([aria-controls="panel-13"] input[type="radio"]:not(:checked)) #panel-13,
:has([aria-controls="panel-14"] input[type="radio"]:not(:checked)) #panel-14,
:has([aria-controls="panel-15"] input[type="radio"]:not(:checked)) #panel-15,
:has([aria-controls="panel-16"] input[type="radio"]:not(:checked)) #panel-16,
:has([aria-controls="panel-17"] input[type="radio"]:not(:checked)) #panel-17,
:has([aria-controls="panel-18"] input[type="radio"]:not(:checked)) #panel-18,
:has([aria-controls="panel-19"] input[type="radio"]:not(:checked)) #panel-19,
:has([aria-controls="panel-20"] input[type="radio"]:not(:checked)) #panel-20,
:has([aria-controls="panel-21"] input[type="radio"]:not(:checked)) #panel-21,
:has([aria-controls="panel-22"] input[type="radio"]:not(:checked)) #panel-22,
:has([aria-controls="panel-23"] input[type="radio"]:not(:checked)) #panel-23,
:has([aria-controls="panel-24"] input[type="radio"]:not(:checked)) #panel-24,
:has([aria-controls="panel-25"] input[type="radio"]:not(:checked)) #panel-25,
:has([aria-controls="panel-26"] input[type="radio"]:not(:checked)) #panel-26,
:has([aria-controls="panel-27"] input[type="radio"]:not(:checked)) #panel-27,
:has([aria-controls="panel-28"] input[type="radio"]:not(:checked)) #panel-28,
:has([aria-controls="panel-29"] input[type="radio"]:not(:checked)) #panel-29,
:has([aria-controls="panel-30"] input[type="radio"]:not(:checked)) #panel-30,
:has([aria-controls="panel-31"] input[type="radio"]:not(:checked)) #panel-31,
:has([aria-controls="panel-32"] input[type="radio"]:not(:checked)) #panel-32,
:has([aria-controls="panel-33"] input[type="radio"]:not(:checked)) #panel-33,
:has([aria-controls="panel-34"] input[type="radio"]:not(:checked)) #panel-34,
:has([aria-controls="panel-35"] input[type="radio"]:not(:checked)) #panel-35,
:has([aria-controls="panel-36"] input[type="radio"]:not(:checked)) #panel-36,
:has([aria-controls="panel-37"] input[type="radio"]:not(:checked)) #panel-37,
:has([aria-controls="panel-38"] input[type="radio"]:not(:checked)) #panel-38,
:has([aria-controls="panel-39"] input[type="radio"]:not(:checked)) #panel-39,
:has([aria-controls="panel-40"] input[type="radio"]:not(:checked)) #panel-40 {
    display: none;
}
label[role="tab"] {
    cursor: pointer;
    & input[type="radio"] {
        display: none;
    }
}
.tab-label {
    opacity: 0.7;
    padding-left: 2px;
    padding-right: 2px;
    &:hover {
        opacity: 1;
    }
    &:has(input[type="radio"]:checked) {
        opacity: 1;
        font-weight: 600;
        text-decoration: underline;
        text-decoration-thickness: 2px;
        background-color: #dddddd;
    }
}