* {
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body {
    background-color: #fff;
    color: #000;
    font-family: ui-sans-serif, sans-serif;
    padding: 1rem;
    margin: 0;
}

ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding-inline-start: 0;
    margin-block: 0 4px;
}

label {
    user-select: none;
    border-radius: 0.25rem;
    background-color: #666;
    color: #fff;
    display: block;
    padding: 0.25rem 0.5rem;
    font-weight: bold;
    cursor: pointer;
}

input[type=checkbox]:checked + label {
    background-color: #080;
    text-decoration: underline;
}

input[type=checkbox] {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

@media (max-width: 768px) {
    .table {
        overflow-x: scroll;
    }
}

table {
    font-size: 0.9rem;
    border-collapse: collapse;
    min-width: 100%;
    max-width: 100%;
}

thead {
    background-color: #fff;
    position: sticky;
    top: 0px;
}

:is(th, td) {
    padding: 0.75rem 1rem;
}

th {
    text-align: left;
    box-shadow: inset 0px -1px currentColor;
}

td {
    min-height: 120px;
    border-bottom: dotted 1px #ccc;
}

:is(th, td):first-child {
    padding-inline-start: 4px;
}

:is(th, td):last-child {
    padding-inline-end: 4px;
}

td:is(:nth-child(5), :nth-child(7), :nth-child(8), :nth-child(9)) {
    text-align: center;
}

th:is(#logo, #visual, #merch) {
    text-align: center;
}

:is(#font, #designers, #design-rules) {
    width: 120px;
}

:is(#palette, #merch, #visual, #logo) {
    width: 140px;
}

body:has(input:checked) tbody tr { display: none; }
body:has(#check-congress:checked) .congress { display: table-row; }
body:has(#check-camp:checked) .camp { display: table-row; }
body:has(#check-rc3:checked) .rc3 { display: table-row; }
body:has(#check-datenspuren:checked) .datenspuren { display: table-row; }
body:has(#check-easterhegg:checked) .easterhegg { display: table-row; }
body:has(#check-sigint:checked) .sigint { display: table-row; }
body:has(#check-gpn:checked) .gpn { display: table-row; }
body:has(#check-icmp:checked) .icmp { display: table-row; }
body:has(#check-mrmcd:checked) .mrmcd { display: table-row; }
body:has(#check-hackover:checked) .hackover { display: table-row; }
body:has(#check-easterhegg:checked) .easterhegg { display: table-row; }

img {
    display: block;
    max-width: 140px;
}

a {
    color: currentColor;
    text-decoration-line: underline;
    text-decoration-style: wavy;
}

a:hover {
    color: #080;
}

a img:hover {
    cursor: zoom-in;
}

td:is(:nth-child(7), :nth-child(8), :nth-child(9)) a {
    display: block;
}

:is(input:focus-visible + label, label:hover, a:focus-visible) {
    outline: 2px solid #080;
    outline-offset: 2px;
}