/* library-index.css — the Library's Index view (LIBRARY-INDEX-SPEC-REV0 §4).
   Loaded on site-map.html only. House tokens throughout: the boxes carry the
   catalog-plate chrome every component carries (paper-panel, hammertone
   hairline, gold top rule), not an encyclopedia grey. Three type roles and
   no fourth — serif for prose and titles, display small-caps for labels,
   mono for machine data only (filing codes, patent IDs, counts, tags, dates). */

.wk-cap {
  font-family: var(--disp); font-weight: 600; font-size: 0.8rem;
  letter-spacing: 0.28em; text-transform: uppercase; color: var(--oxblood);
  margin: 0 0 0.5rem;
}
.wk-num { font-family: var(--mono); font-size: 0.78rem; color: var(--gold-dim); min-width: 1.4em; }
.wk-n { font-family: var(--mono); font-size: 0.75rem; color: var(--ink-soft); margin-left: auto; padding-left: 1rem; }
.wk-code { font-family: var(--mono); font-size: 0.8em; letter-spacing: 0.02em; }
.wk-sep { color: var(--gold-dim); }

/* ---- the opening: contents and infobox in one row, like an article's head ---- */
.wk-open { display: flex; gap: 1.6rem; align-items: stretch; margin: 0.6rem 0 1.2rem; }
.wk-infobox {
  flex: 0 0 300px; width: 300px; margin: 0;
  padding: 0.9rem 1rem 1rem;
  background: var(--paper-panel);
  border: 1px solid var(--hammertone); border-top: 3px solid var(--gold);
}
.wk-infobox dl { display: grid; grid-template-columns: auto 1fr; gap: 0.32rem 0.9rem; margin: 0; }
.wk-infobox dt {
  font-family: var(--disp); font-size: 0.78rem; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--ink-soft);
}
.wk-infobox dd { margin: 0; font-family: var(--mono); font-size: 0.85rem; text-align: right; }

/* ---- contents ---- */
.wk-toc {
  flex: 1 1 auto; display: block; margin: 0;
  padding: 0.9rem 1.1rem 1rem;
  background: var(--paper-panel);
  border: 1px solid var(--hammertone); border-top: 3px solid var(--gold);
}
.wk-toc ol { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 2.5rem; }
.wk-toc li { display: flex; gap: 0.7rem; align-items: baseline; padding: 0.14rem 0; max-width: none; break-inside: avoid; }
.wk-toc a { text-decoration: none; }
.wk-toc a:hover { text-decoration: underline; }

/* ---- sections ---- */
.wk-sec h2 {
  display: flex; gap: 0.7rem; align-items: baseline;
  border-bottom: 1px solid var(--gold-dim); padding-bottom: 0.3rem; margin-top: 2.4rem;
}
.wk-sec h2 .wk-num { font-size: 0.95rem; }
.wk-note { color: var(--ink-soft); font-size: 0.95rem; }

/* ---- one stub per document; hairline-separated, never boxed ---- */
.wk-stub {
  display: flex; gap: 1.5rem; align-items: flex-start;
  padding: 1.1rem 0 1.25rem; border-bottom: 1px solid rgba(138, 141, 143, 0.45);
}
.wk-body { flex: 1 1 auto; min-width: 0; }
/* the card: the library cover (300x190 dial face, badge, accent) as a thumb.
   Borrows .lib-badge from library.css, which the page already loads for the
   view switch; the frame is the lib-card's, at thumb size. */
.wk-card {
  flex: 0 0 210px; width: 210px; aspect-ratio: 300 / 190; position: relative;
  display: block; overflow: hidden; border-radius: 6px;
  background: var(--paper-panel);
  border: 1px solid color-mix(in srgb, var(--acc, #8A8D8F) 42%, transparent);
  box-shadow: 0 8px 22px -16px rgba(34, 28, 25, 0.8);
  transition: transform 0.12s ease, box-shadow 0.12s ease, border-color 0.12s ease;
}
.wk-card:hover { transform: translateY(-2px); border-color: var(--acc, #8A8D8F); box-shadow: 0 14px 28px -13px rgba(34, 28, 25, 0.55); }
.wk-card svg { width: 100%; height: 100%; display: block; }
.wk-stub:last-child { border-bottom: 0; }
.wk-title {
  font-family: var(--body); font-size: 1.25rem; font-weight: 600;
  letter-spacing: 0; text-transform: none; line-height: 1.3; margin: 0 0 0.25rem;
}
.wk-title a { text-decoration: none; }
.wk-title a:hover { text-decoration: underline; }
.wk-title .wk-code { color: var(--ink-soft); margin-left: 0.4rem; font-weight: 400; }
.wk-rev {
  font-family: var(--mono); font-size: 0.66rem; font-weight: 400;
  padding: 0.08em 0.45em; margin-left: 0.3rem; vertical-align: middle;
  border: 1px solid var(--gold-dim); border-radius: 2px; color: var(--gold-dim);
}
.wk-desc { margin: 0 0 0.6rem; color: var(--ink-soft); }
.wk-kv {
  display: grid; grid-template-columns: max-content 1fr; gap: 0.22rem 1.1rem;
  margin: 0.45rem 0 0.7rem; max-width: var(--measure); font-size: 0.95rem;
}
.wk-kv dt {
  font-family: var(--disp); font-size: 0.75rem; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--ink-soft); padding-top: 0.22em;
}
.wk-kv dd { margin: 0; }
.wk-kv a { text-decoration: none; }
.wk-kv a:hover { text-decoration: underline; }

/* ---- the cross-reference lines ---- */
.wk-x, .wk-cats { margin: 0.28rem 0; font-size: 0.95rem; max-width: none; }
.wk-k {
  font-family: var(--disp); font-size: 0.75rem; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--oxblood); margin-right: 0.6rem;
}
.wk-x a { text-decoration: none; }
.wk-x a:hover { text-decoration: underline; }
.wk-off { color: var(--hammertone); border-bottom: 1px dotted var(--hammertone); cursor: help; }

/* ---- tags: mono, because a tag is an identifier ---- */
.wk-tag {
  display: inline-block; font-family: var(--mono); font-size: 0.72rem;
  padding: 0.1em 0.5em; margin: 0 0.3rem 0.2rem 0;
  border: 1px solid var(--hammertone); border-radius: 2px;
  color: var(--ink-soft); text-decoration: none;
}
a.wk-tag:hover { border-color: var(--gold); color: var(--ink); }

/* ---- the category index ---- */
.wk-catidx dl { margin: 0.6rem 0 0; columns: 2; column-gap: 2.5rem; }
.wk-cat { break-inside: avoid; padding: 0.45rem 0; border-bottom: 1px dotted var(--hammertone); }
.wk-cat dt { display: flex; align-items: baseline; }
.wk-cat dt .wk-n { margin-left: 0.5rem; padding-left: 0; }
.wk-cat dd { margin: 0.2rem 0 0; font-size: 0.92rem; }
.wk-cat dd a { text-decoration: none; }
.wk-cat dd a:hover { text-decoration: underline; }

@media (max-width: 760px) {
  .wk-open { flex-direction: column; gap: 1rem; }
  .wk-infobox { flex: none; width: auto; }
  .wk-infobox dd { text-align: left; }
  .wk-toc ol { columns: 1; }
  .wk-stub { flex-direction: column; gap: 0.8rem; }
  .wk-card { flex: none; width: 100%; max-width: 260px; }
  .wk-kv { grid-template-columns: 1fr; gap: 0; }
  .wk-kv dt { padding-top: 0.5em; }
  .wk-catidx dl { columns: 1; }
}
