/* Keek record pages. Loaded after style.css, and only by /record/:id pages, so
   nothing here can move the home page. Same paper, same ink, same one accent. */

.record-wrap { padding: 30px 0 60px; }

.record { max-width: 46rem; }

.record-crumbs {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 13px;
  color: var(--ink-soft);
  margin: 0 0 22px;
}
.record-crumbs a { text-decoration: none; }
.record-crumbs a:hover { text-decoration: underline; }
.record-crumbs span[aria-hidden] { color: var(--rule); padding: 0 4px; }

.record-class {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin: 0 0 8px;
}

.record-num {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.06em;
  color: var(--accent-ink);
  margin-left: 8px;
}

.record-name {
  font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.35rem);
  line-height: 1.2;
  margin: 0 0 18px;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.record-desc {
  font-size: 16px;
  color: var(--ink-soft);
  margin: 0 0 20px;
}
.record-desc .tag { margin-right: 8px; vertical-align: 1px; }

.record-flags { margin: 0 0 22px; }
.record-flag { margin: 0 0 8px; }
.record-flag .flag { margin-right: 9px; }

.record-facts {
  margin: 0 0 26px;
  padding: 20px 0 4px;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}

.record-row {
  display: grid;
  grid-template-columns: 11rem 1fr;
  gap: 6px 18px;
  padding: 7px 0;
}

.record-row dt {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
  padding-top: 2px;
}

.record-row dd {
  margin: 0;
  font-size: 17px;
  overflow-wrap: anywhere;
}

.record-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  padding: 0 0 4px;
  margin-bottom: 22px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
}
.record-links a { text-decoration: none; }
.record-links a:hover { text-decoration: underline; }

.record-meta {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 13px;
  line-height: 1.5;
  color: var(--ink-soft);
  margin: 0 0 18px;
  max-width: 40rem;
}

.record-note {
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink-soft);
  border-left: 3px solid var(--rule);
  padding: 2px 0 2px 16px;
  margin: 0 0 26px;
  max-width: 40rem;
}

.record-share {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  padding: 16px 0 0;
  border-top: 1px solid var(--rule);
  margin-bottom: 30px;
}

.record-share-btn {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
  background: var(--card);
  color: var(--accent-ink);
  border: 1px solid var(--rule);
  border-radius: 3px;
  padding: 8px 14px;
  cursor: pointer;
}
.record-share-btn:hover { border-color: var(--accent); color: var(--ink); }

.record-share-note {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 12px;
  color: var(--ink-soft);
}

.record-back { padding-top: 4px; }
.record-back .record-meta { margin-bottom: 10px; }

.record-search input {
  width: 100%;
  max-width: 30rem;
  font-family: inherit;
  font-size: 18px;
  padding: 12px 14px;
  border: 1px solid var(--rule);
  border-radius: 3px;
  background: var(--card);
  color: var(--ink);
}
.record-search input:focus { outline: 2px solid var(--accent); outline-offset: 1px; }

@media (max-width: 640px) {
  .record-wrap { padding: 22px 0 46px; }
  .record-row { grid-template-columns: 1fr; gap: 2px; }
  .record-row dt { padding-top: 6px; }
}

/* ---- the records index (/records.html) ---- */
/* One static page of links, so a crawler has a real route to every record page
   rather than only a sitemap. Grouped by class, because that is how the site
   thinks about records. */

.record-index-section + .record-index-section { margin-top: 42px; }

.record-index-section h2 {
  font-size: 1.15rem;
  margin: 0 0 6px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--rule);
}

.record-index-count {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: var(--ink-soft);
  letter-spacing: 0.06em;
  margin-left: 8px;
}

.record-index-note {
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink-soft);
  margin: 10px 0 18px;
  max-width: 44rem;
}

.record-index {
  list-style: none;
  margin: 0;
  padding: 0;
}

.record-index li {
  padding: 6px 0;
  border-bottom: 1px solid rgba(217, 212, 201, 0.6);
  font-size: 16px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.record-index li a { text-decoration: none; }
.record-index li a:hover { text-decoration: underline; }

.record-index-num {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 12px;
  color: var(--ink-soft);
  margin-left: 8px;
  font-variant-numeric: tabular-nums;
}

.record-index-where {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 13px;
  color: var(--ink-soft);
  margin-left: 8px;
}

/* PAGINATION, for the classes too big for one page (food businesses: 77 council
   pages of 1,000). The pager sits above and below the list, and the rule lines
   keep it reading as furniture rather than as part of the list. */
.record-pager {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 18px;
  padding: 0 0 12px;
  border-bottom: 1px solid var(--rule);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
}

.record-index-section + .record-pager {
  margin: 18px 0 0;
  padding: 14px 0 0;
  border-bottom: 0;
  border-top: 1px solid var(--rule);
}

.record-pager + .record-index-section { margin-top: 0; }
.record-pager a { color: var(--ink); text-decoration: underline; }
.pager-count { color: var(--ink-soft); font-variant-numeric: tabular-nums; }

@media (max-width: 640px) {
  .record-index-num, .record-index-where { display: block; margin-left: 0; }
}

/* ---- place pages: /place/<outward>, rendered by the box -------------------
   A place page is a list of cited lists, so the styles are deliberately quiet:
   a heading with its count, the register it came from, then rows of name over
   where. Nothing here is a card and nothing competes with the record pages. */
.place-group { margin: 0 0 30px; }
.place-h {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--ink);
  margin: 0 0 4px;
}
.place-count {
  display: inline-block;
  min-width: 2.2em;
  padding: 1px 6px;
  border: 1px solid var(--rule);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 400;
  text-align: center;
  color: var(--ink-soft);
  vertical-align: 2px;
}
.place-source {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 12px;
  color: var(--ink-soft);
  margin: 0 0 10px;
}
.place-list {
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: 46rem;
}
.place-list li {
  padding: 7px 0;
  border-bottom: 1px solid var(--rule);
  font-size: 15px;
}
.place-list li:last-child { border-bottom: 0; }
.place-list a { color: var(--accent); text-decoration: none; }
.place-list a:hover { text-decoration: underline; }
.place-where {
  display: block;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 12px;
  color: var(--ink-soft);
  margin-top: 2px;
}
.place-note {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 12px;
  color: var(--ink-soft);
  margin: 12px 0 0;
  max-width: 40rem;
}
/* the one block on the page that is not a register count, so it is marked apart */
.place-trading {
  border-left: 3px solid var(--accent);
  padding-left: 16px;
}
.place-gap { margin-top: 34px; }
/* THE WAY BACK (1 Nov 2026). One link at the head of every record and one at its foot, for the
   Architect's note that a visitor had no route back to what they were reading. The markup reuses
   .record-crumbs so the link reads as part of the page rather than as a button, and these rules only
   tighten the spacing so the back link and the breadcrumb below it do not each carry a full
   paragraph gap. No dependency on script: with JavaScript off the link still points at the search.
   NAMED WAYBACK, NOT BACK: .record-back is already the "Search this name on Keek" box at the foot of
   these pages, and a link sharing that name would have inherited its padding. */
.record-wayback { margin: 0 0 8px; }
.record-wayback-foot { margin: 26px 0 0; }
.record-wayback a { text-decoration: underline; }