@charset "UTF-8";
/* Survey layer. Extends style.css — the parent page's tokens are reused verbatim
   so the directory reads as the same publication, not a bolted-on subdomain.
   No new colours. If a value is needed that isn't already in style.css's :root,
   that is a signal the two have drifted. */

.s-head { padding-block: 56px 34px; max-width: 760px }
.crumb { font-size: .85rem; color: var(--muted); margin-bottom: 20px }
.crumb a { text-decoration: none; border-bottom: 1px solid var(--line) }
.crumb a:hover { border-bottom-color: var(--plum) }
.s-head h1 { font-size: clamp(2.6rem, 5.4vw, 4.4rem); letter-spacing: -.05em; line-height: 1.02; margin-bottom: 22px }
.s-head .dek { font-size: clamp(1.1rem, 1.7vw, 1.3rem); color: var(--plum); margin-bottom: 22px }
.s-head .subtle { max-width: 62ch; font-size: .98rem }

/* Category index */
.sec { padding-bottom: 46px }
.sec h2 { font-size: clamp(1.6rem, 2.6vw, 2.1rem); margin-bottom: 8px }
.sec .subtle { font-size: .93rem; margin-bottom: 20px }
.cats { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 0 34px }
.cats li { border-top: 1px solid var(--line) }
.cats a { display: flex; justify-content: space-between; align-items: baseline; gap: 14px;
          padding: 13px 0; text-decoration: none; font-weight: 550 }
.cats a:hover { color: var(--plum) }
.cats .n { font-size: .78rem; color: var(--muted); font-weight: 400; white-space: nowrap; flex-shrink: 0 }

/* Entries */
.col-h { font-size: 1.5rem; margin: 42px 0 6px; padding-top: 22px; border-top: 3px solid var(--plum) }
.col-h + .subtle { font-size: .9rem; max-width: 64ch; margin-bottom: 8px }
.entries { list-style: none; padding: 0; margin: 0 }
.entry { padding: 17px 0; border-bottom: 1px solid var(--line) }
.entry-head { margin: 0 0 4px; font-weight: 600; font-size: 1.06rem; max-width: none }
.entry-head a { text-decoration: none; border-bottom: 1px solid var(--line) }
.entry-head a:hover { border-bottom-color: var(--plum); color: var(--plum) }
.gone-name { color: var(--muted) }
.tag { font-size: .7rem; text-transform: uppercase; letter-spacing: .07em; color: var(--muted);
       border: 1px solid var(--line); border-radius: 20px; padding: 2px 9px; margin-left: 8px;
       vertical-align: 2px; white-space: nowrap }
.entry-host { margin: 0; font-size: .82rem; color: var(--muted); font-family: "SF Mono", Menlo, Consolas, monospace; max-width: none }
.entry-desc { margin: 7px 0 0; font-size: .93rem; max-width: 74ch; color: var(--plum) }
.entry-dead .entry-desc { display: none }

/* Prose (methodology) */
.prose { padding-bottom: 70px; max-width: 760px }
.prose h2 { font-size: 1.55rem; margin: 40px 0 12px }
.prose p { font-size: 1rem; max-width: 68ch }
.prose ul, .prose dl { padding-left: 0; max-width: 68ch }
.prose code { font-family: "SF Mono", Menlo, Consolas, monospace; font-size: .88em;
              background: var(--rose); padding: 1px 5px; border-radius: 3px }
.facts { list-style: none }
.facts li { padding: 8px 0; border-bottom: 1px solid var(--line) }
.caveats { list-style: none }
.caveats li { padding: 10px 0; border-bottom: 1px solid var(--line); font-size: .96rem }
.fields { margin: 0 }
.fields dt { font-weight: 650; font-size: .93rem; margin-top: 14px }
.fields dd { margin: 3px 0 0; font-size: .93rem; color: var(--muted) }

@media (max-width: 620px) {
  .cats { grid-template-columns: 1fr }
  .s-head { padding-block: 38px 26px }
  .entry-desc { font-size: .9rem }
  .col-h { font-size: 1.3rem }
}