/* Plain early-2000s page. Tag colors are Okabe-Ito (color-blind safe), and
   every tag also prints its name. No rounded corners.
   Fonts: Source Serif 4 + Source Sans 3, self-hosted (SIL OFL). */
@font-face { font-family: "Source Serif 4"; src: url(fonts/source-serif-4-latin-400-normal.woff2) format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url(fonts/source-serif-4-latin-600-normal.woff2) format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url(fonts/source-serif-4-latin-700-normal.woff2) format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Source Sans 3"; src: url(fonts/source-sans-3-latin-400-normal.woff2) format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Source Sans 3"; src: url(fonts/source-sans-3-latin-600-normal.woff2) format("woff2"); font-weight: 600; font-display: swap; }

:root {
  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --sans: "Source Sans 3", "Segoe UI", Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; border-radius: 0 !important; }

body {
  max-width: 680px;
  margin: 0 auto;
  padding: 16px;
  background: #fff;
  color: #111;
  font: 16px/1.4 var(--serif);
  -webkit-font-smoothing: antialiased;
}

header { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 10px; }
h1 { margin: 0; font: 700 24px/1.1 var(--serif); letter-spacing: -0.01em; }
.meta { margin: 0; font: 12px var(--sans); color: #555; }

.filters { flex-basis: 100%; margin-top: 6px; padding: 2px 0; border-top: 1px solid #000; border-bottom: 1px solid #000; font: 13px var(--sans); }
.filters a { display: inline-block; padding: 3px 5px; color: #0000cc; }
.filters a.active { color: #000; font-weight: 600; text-decoration: none; }

h2 {
  margin: 16px 0 2px;
  padding-bottom: 2px;
  border-bottom: 1px solid #999;
  font: 600 12px var(--sans);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #333;
}

ul { list-style: none; margin: 0; padding: 0; }
main li { padding: 6px 0; border-bottom: 1px dotted #bbb; }
main li:last-child { border-bottom: none; }

main a { color: #0000cc; font-weight: 600; line-height: 1.3; text-underline-offset: 2px; }
main a:visited { color: #551a8b; }
.item-meta { margin-top: 1px; font: 12px var(--sans); color: #555; }

.tag { margin-right: 4px; padding: 0 3px; font: 600 10px var(--sans); letter-spacing: 0.04em; text-transform: uppercase; }
.tag-patent        { background: #0072b2; color: #fff; }
.tag-policy        { background: #e69f00; color: #000; }
.tag-academic      { background: #009e73; color: #000; }
.tag-international { background: #cc79a7; color: #000; }
.tag-copyright-tm  { background: #56b4e9; color: #000; }
.tag-cafc          { background: #f0e442; color: #000; outline: 1px solid #000; }

footer { margin-top: 24px; font: 12px var(--sans); color: #555; }
footer .fail { color: #d55e00; font-weight: 600; }

[hidden] { display: none !important; }

@media (max-width: 480px) {
  body { padding: 12px; font-size: 16px; }
  h1 { font-size: 22px; }
  .filters a { padding: 5px 6px; }  /* bigger tap targets */
}
footer summary { cursor: pointer; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; }
footer details ul { margin-top: 4px; }
