/* Apache-ish, but readable */
:root { color-scheme: light; }
body { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; margin: 18px; }
h1 { font-size: 20px; font-weight: 600; margin: 0 0 14px 0; }
hr { margin: 16px 0; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }

table.index { border-collapse: collapse; width: 100%; max-width: 980px; }
table.index th, table.index td { padding: 6px 8px; border-bottom: 1px solid #ddd; vertical-align: top; }
table.index th { text-align: left; font-weight: 700; border-bottom: 2px solid #bbb; }
td.size, th.size { text-align: right; white-space: nowrap; width: 1%; }
td.name { white-space: nowrap; }
td.desc { width: 100%; }
td.empty { color: #666; font-style: italic; }

.footer { color: #666; font-size: 12px; }
th[data-sort] { cursor: pointer; user-select: none; }
th[data-sort]:hover { text-decoration: underline; }
th[data-sort][data-active="asc"]::after { content: " ▲"; }
th[data-sort][data-active="desc"]::after { content: " ▼"; }