/* ==========================================================================
   Parcel Chronicle · Reference Desk — the whole look of the site.
   OWNER: Shell. Every builder uses these classes; see /style for a live sample
   of each one and NOTES_shell.md for the recommended markup.

   Feel: a small-town library reference desk crossed with a surveyor's field book.
   Warm paper, dark ink, forest green, a little brass, survey red for lines.
   Findings are catalog cards (red ruled header, punched hole). Surveyors' words
   are a ruled field-book page. Labels are small rubber stamps.

   Rules of the house:
   - mobile first; comfortable at 380 px; prints cleanly on white;
   - generic element defaults use :where() so ANY class beats them;
   - Leaflet maps (.leaflet-container) are never touched by the generic rules.
   ========================================================================== */

/* ---------- 1. Tokens ---------------------------------------------------- */
:root {
  --paper: #f6f1e3;
  --paper-deep: #ece4cd;
  --card: #fffdf6;
  --stock: #fbf6e8;          /* buff catalog-card stock, for cards sitting on a white sheet */
  --ink: #1f2a24;
  --muted: #5c665f;
  --green: #2f5d3a;
  --green-dark: #1f4229;
  --green-tint: #e6eee2;
  --brass: #a8842c;          /* lines and borders only (not text: too light) */
  --brass-ink: #7a5f1c;      /* brass for text */
  --brass-light: #d9b65a;    /* brass on dark green */
  --brass-tint: #f5ecd1;
  --survey-red: #a23b2a;
  --red-tint: #f8e7df;
  --line: #d9cfb4;
  --line-strong: #b9ad8c;
  --field-border: #8f8467;   /* form fields: 3:1 against white */
  --school: #e8d9a0;         /* school sections */
  --gap: #f3e3d8;            /* gaps in the record */
  --ai-ink: #47467f;         /* "Written by AI" stamp and the desk's answers */
  --ai-tint: #ecebf4;
  --software-ink: #35505e;   /* "Assembled by software" */
  --software-tint: #e4ecef;
  --rule: #c6d3cc;           /* field-book ruling */
  --focus: #8a6a17;

  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", "TeX Gyre Pagella", "URW Palladio L", P052, Georgia, serif;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Liberation Sans", sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;

  --measure: 39rem;          /* reading column */
  --sheet: 50rem;            /* one sheet of paper: the Walk card, the brief, the place page and the examples */
  --wide: 72rem;
  --gutter: clamp(1rem, 4vw, 2rem);
  --radius: 4px;
  --radius-card: 6px;
  --shadow-card: 0 1px 0 rgba(31, 42, 36, .05), 0 8px 18px -14px rgba(31, 42, 36, .45);
  --hole: var(--paper);      /* colour seen through a catalog card's punched hole */
  color-scheme: light;
}

/* ---------- 2. Base ------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--paper);
  color: var(--ink);
  font: 400 1.125rem/1.62 var(--serif);
  font-kerning: normal;
  font-variant-numeric: oldstyle-nums proportional-nums;
  overflow-wrap: break-word;
}
main {
  flex: 1 0 auto;
  width: 100%;
  max-width: var(--wide);
  margin: 0 auto;
  padding: clamp(1.25rem, 4vw, 2.5rem) var(--gutter) 3.5rem;
}
main [id] { scroll-margin-top: 4.5rem; }

h1, h2, h3, h4, h5 {
  font-family: var(--serif);
  color: var(--ink);
  line-height: 1.16;
  margin: 1.7em 0 .5em;
  text-wrap: balance;
  font-variant-numeric: lining-nums;
}
h1 { font-size: clamp(2.05rem, 1.45rem + 2.4vw, 2.9rem); font-weight: 400; letter-spacing: -.012em; margin-top: .15em; }
h2 { font-size: clamp(1.5rem, 1.25rem + 1vw, 1.85rem); font-weight: 700; letter-spacing: -.005em; }
h3 { font-size: 1.28rem; font-weight: 700; }
h4 { font-size: 1.08rem; font-weight: 700; }
h5 { font-size: .95rem; font-weight: 700; font-family: var(--sans); }
:where(h1, h2, h3, h4) + :where(h1, h2, h3, h4) { margin-top: .35em; }

p { margin: 0 0 1em; }
:where(main) :where(p, li, dd, blockquote, figcaption) { max-width: 70ch; }
a { color: var(--green); text-decoration-thickness: 1px; text-underline-offset: .17em; }
/* Links already followed fade to old ink (7.5:1 on paper), like a card already pulled from the drawer. */
:where(main) a:not([class]):visited { color: #5b4a2b; }
a:hover, :where(main) a:not([class]):visited:hover { color: var(--green-dark); text-decoration-thickness: 2px; }
strong, b { font-weight: 700; }
small, .fine { font-size: .85rem; }
:where(main) :where(ul, ol) { padding-left: 1.35em; margin: 0 0 1.1em; }
:where(main) li + li { margin-top: .3em; }
:where(main) li::marker { color: var(--brass-ink); }
dl { margin: 0 0 1.2em; }
dt { font: 700 .9rem/1.4 var(--sans); color: var(--ink); margin-top: .8rem; }
dd { margin: .15rem 0 0; }
code, kbd, samp { font-family: var(--mono); font-size: .88em; background: var(--paper-deep); border-radius: 3px; padding: .08em .3em; }
mark { background: var(--school); color: inherit; padding: 0 .15em; border-radius: 2px; }
abbr[title] { text-decoration: underline dotted; cursor: help; }
:where(main img:not(.leaflet-container *)) { max-width: 100%; height: auto; }
:where(main svg:not(.leaflet-container *)) { max-width: 100%; }
figure { margin: 1.5rem 0; }
figcaption { font: .86rem/1.45 var(--sans); color: var(--muted); margin-top: .55rem; }

/* A generic quotation: someone's printed words (e.g. Dr. Zybach's documents). */
blockquote { margin: 1.25rem 0; padding: .15rem 0 .15rem 1.15rem; border-left: 3px solid var(--brass); font-size: 1.06rem; }
blockquote > :last-child { margin-bottom: 0; }
blockquote :is(footer, cite) { display: block; font: normal .85rem/1.45 var(--sans); color: var(--muted); margin-top: .55rem; }
blockquote footer cite { display: inline; }

/* A survey line: red, with a tick every chain. Used for <hr> and under big titles. */
hr, .survey-line {
  border: 0;
  height: 9px;
  margin: 2.25rem 0;
  background:
    linear-gradient(var(--survey-red), var(--survey-red)) 0 50% / 100% 1.5px no-repeat,
    repeating-linear-gradient(to right, var(--survey-red) 0 2px, transparent 2px 26px) 0 0 / 100% 100% no-repeat;
  opacity: .75;
}

::selection { background: var(--school); color: var(--ink); }

/* Focus: always visible, brass ring. */
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; border-radius: 2px; }
:focus:not(:focus-visible) { outline: none; }

.skip {
  position: absolute; left: .75rem; top: -4rem; z-index: 3000;
  background: var(--card); color: var(--green-dark); font: 600 1rem var(--sans);
  padding: .6rem 1rem; border: 2px solid var(--green-dark); border-radius: var(--radius);
}
.skip:focus { top: .75rem; }
.sr-only, .visually-hidden {
  position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}

/* ---------- 3. Layout helpers ------------------------------------------- */
.narrow { max-width: var(--measure); margin-left: auto; margin-right: auto; }
.wide { max-width: var(--wide); margin-left: auto; margin-right: auto; }
main > section + section, .narrow + .narrow { margin-top: 2.75rem; }
.lede { font-size: clamp(1.18rem, 1.08rem + .45vw, 1.32rem); line-height: 1.55; color: var(--ink); }
.muted, .meta { color: var(--muted); }
.meta { font: .88rem/1.45 var(--sans); }
.empty { color: var(--muted); font-style: italic; }
.center { text-align: center; }
.columns { display: grid; gap: 1.5rem 2rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); }
.actions, .button-row { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin: 1.25rem 0; }
.icon { width: 1.25em; height: 1.25em; flex: none; vertical-align: -.22em; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

/* ---------- 4. Header ---------------------------------------------------- */
.site-header { background: var(--paper); position: relative; z-index: 30; }
.masthead {
  max-width: var(--wide);
  margin: 0 auto;
  padding: .85rem var(--gutter) .75rem;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas: "brand stamp" "motto motto";
  align-items: center;
  gap: .35rem 1rem;
}
.brand { grid-area: brand; display: inline-flex; align-items: center; gap: .65rem; color: var(--ink); text-decoration: none; min-width: 0; }
.brand:hover { color: var(--ink); }
.brand-mark { width: 2.35rem; height: 2.35rem; flex: none; display: block; }
.brand-text { display: flex; flex-direction: column; min-width: 0; }
.brand-name { font: 700 1.32rem/1.05 var(--serif); color: var(--green-dark); letter-spacing: -.01em; }
.brand-desk { font: italic 400 .98rem/1.2 var(--serif); color: var(--brass-ink); }
.brand:hover .brand-name { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .15em; }

.motto {
  grid-area: motto;
  margin: 0;
  font: italic 400 1rem/1.3 var(--serif);
  color: var(--ink);
}
.motto::before { content: ""; display: inline-block; width: 1.1rem; height: 1.5px; margin-right: .5rem; vertical-align: .32em; background: var(--survey-red); }

/* The one rubber stamp in the header. */
.proto-label {
  grid-area: stamp;
  justify-self: end;
  display: inline-block;
  width: min-content;             /* phones: "Working / prototype" as a square stamp */
  overflow-wrap: normal;
  word-break: normal;
  text-align: center;
  font: 800 .72rem/1.15 var(--sans);
  letter-spacing: .04em;
  color: var(--survey-red);
  border: 2px solid var(--survey-red);
  outline: 1px solid var(--survey-red);
  outline-offset: 2px;
  border-radius: 3px;
  padding: .3em .55em .28em;
  transform: rotate(-3deg);
  background: rgba(162, 59, 42, .05);
}

@media (min-width: 40rem) {
  .masthead { grid-template-columns: auto 1fr auto; grid-template-areas: "brand motto stamp"; padding-top: 1rem; padding-bottom: .9rem; }
  .motto { justify-self: end; text-align: right; }
  .proto-label { width: auto; white-space: nowrap; font-size: .74rem; }
  .brand-mark { width: 2.6rem; height: 2.6rem; }
  .brand-name { font-size: 1.5rem; }
}

/* Signed-in strip (name, sign out). Desktop only; phones get it inside the menu. */
.user-bar { display: none; }
.user-bar .nav-signout { display: inline; }

/* Main navigation: a green bar with a brass edge (a banker's lamp on the desk). */
.site-nav { display: none; }
.nav-list { list-style: none; margin: 0; padding: 0; }
.nav-button {
  appearance: none; -webkit-appearance: none;
  background: none; border: 0; padding: 0; margin: 0; min-height: 0; box-shadow: none;
  font: inherit; color: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: .17em;
}
.nav-count {
  display: inline-block; min-width: 1.5em; margin-left: .3em; padding: .05em .4em;
  border-radius: 999px; background: var(--brass-light); color: var(--green-dark);
  font: 700 .78rem/1.35 var(--sans); text-align: center;
}

/* Phones and small tablets: one "Menu" disclosure (works without JavaScript). */
.nav-menu { background: var(--green-dark); border-bottom: 3px solid var(--brass); color: var(--paper); }
.nav-menu > summary {
  list-style: none;
  display: flex; align-items: center; gap: .6rem;
  padding: .7rem var(--gutter);
  font: 600 1rem/1.2 var(--sans);
  cursor: pointer;
  min-height: 3rem;
}
.nav-menu > summary::-webkit-details-marker { display: none; }
.nav-menu > summary .icon { width: 1.35rem; height: 1.35rem; }
.nav-menu > summary .menu-close { display: none; }
.nav-menu[open] > summary .menu-open { display: none; }
.nav-menu[open] > summary .menu-close { display: inline; }
.nav-menu > summary .menu-where { margin-left: auto; font-weight: 400; color: var(--brass-light); font-size: .92rem; }
.nav-menu[open] > summary { border-bottom: 1px solid rgba(246, 241, 227, .18); }
.nav-menu .nav-list { padding: .35rem 0 .6rem; }
.nav-menu .nav-list + .nav-list { border-top: 1px solid rgba(246, 241, 227, .18); padding-top: .5rem; }
.nav-menu a, .nav-menu .nav-button, .nav-menu .nav-who {
  display: flex; align-items: center; gap: .5rem;
  padding: .62rem var(--gutter);
  color: var(--paper); text-decoration: none;
  font: 500 1.05rem/1.3 var(--sans);
  min-height: 2.9rem;
}
.nav-menu .nav-who { color: var(--brass-light); font-size: .95rem; min-height: 0; padding-bottom: .2rem; }
.nav-menu a:hover, .nav-menu .nav-button:hover { background: rgba(246, 241, 227, .08); }
.nav-menu a[aria-current="page"] { box-shadow: inset 4px 0 0 var(--brass-light); background: rgba(246, 241, 227, .06); }
.nav-menu form { margin: 0; }
.nav-menu .nav-button { width: 100%; text-align: left; text-decoration: none; }
.nav-menu :focus-visible, .site-nav :focus-visible { outline-color: var(--brass-light); outline-offset: -3px; }
/* Phones: a quiet "Feedback" link rides on the right of the Menu bar (and is in the menu too). */
.nav-phone { position: relative; }
.nav-menu > summary { padding-right: calc(var(--gutter) + 5.75rem); }
.nav-feedback-bar {
  position: absolute; top: 0; right: 0; z-index: 2;
  display: flex; align-items: center; min-height: 3rem;
  padding: 0 var(--gutter) 0 .95rem;
  border-left: 1px solid rgba(246, 241, 227, .2);
  color: var(--paper); font: 500 .98rem/1.2 var(--sans);
  text-decoration: underline; text-decoration-color: rgba(217, 182, 90, .75); text-underline-offset: .22em;
}
.nav-feedback-bar:hover { color: #fff; background: rgba(246, 241, 227, .08); }
.nav-feedback-bar:visited { color: var(--paper); }
.nav-feedback-bar:focus-visible { outline: 3px solid var(--brass-light); outline-offset: -4px; }

@media (min-width: 58rem) {
  .nav-menu, .nav-feedback-bar { display: none; }
  .site-nav .nav-account .nav-feedback a { font-weight: 400; color: #e8e1cc; }
  .site-nav .nav-account .nav-feedback a:hover { color: #fff; }
  .site-nav { display: block; background: var(--green-dark); border-bottom: 3px solid var(--brass); }
  .nav-inner {
    max-width: var(--wide); margin: 0 auto;
    padding: 0 calc(var(--gutter) - .7rem);
    display: flex; justify-content: space-between; align-items: stretch; flex-wrap: wrap;
  }
  .site-nav .nav-list { display: flex; flex-wrap: wrap; }
  .site-nav a {
    display: flex; align-items: center; gap: .4rem;
    padding: .78rem .7rem .7rem;
    color: var(--paper);
    font: 500 .97rem/1.2 var(--sans);
    text-decoration: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -3px;
  }
  .site-nav a:hover { color: #fff; background: rgba(246, 241, 227, .08); }
  .site-nav a[aria-current="page"] { border-bottom-color: var(--brass-light); color: #fff; }
  .site-nav .nav-account a { font-weight: 600; }
  .site-nav .nav-account .icon { width: 1.15rem; height: 1.15rem; color: var(--brass-light); }
  .user-bar {
    display: flex; justify-content: flex-end; align-items: center; gap: .9rem;
    max-width: var(--wide); margin: 0 auto; padding: .4rem var(--gutter) 0;
    font: .86rem/1.3 var(--sans); color: var(--muted);
  }
  .user-bar strong { color: var(--ink); font-weight: 600; }
  .user-bar form { display: inline; margin: 0; }
  .user-bar .nav-button { color: var(--green); font-size: .86rem; }
  .user-bar + .masthead { padding-top: .35rem; }
}

/* Just above the phone layout the bar is tight: smaller gaps keep it on one row. */
@media (min-width: 58rem) and (max-width: 70rem) {
  .site-nav a { padding-left: .42rem; padding-right: .42rem; font-size: .9rem; }
  .nav-inner { padding-left: calc(var(--gutter) - .42rem); padding-right: calc(var(--gutter) - .42rem); }
  .site-nav .nav-account .icon { display: none; }
}

/* ---------- 5. Footer ---------------------------------------------------- */
.site-footer {
  margin-top: auto;
  background: var(--green-dark);
  color: var(--paper);
  border-top: 3px solid var(--brass);
  font-family: var(--sans);
}
.footer-inner { max-width: var(--wide); margin: 0 auto; padding: 2rem var(--gutter) 2.25rem; display: grid; gap: 1rem; }
.site-footer p { margin: 0; max-width: 70ch; }
.footer-room { display: flex; gap: .75rem; align-items: center; font: 400 1.12rem/1.4 var(--serif); }
.footer-room .brand-mark { width: 2rem; height: 2rem; }
.site-footer a { color: var(--paper); text-decoration-color: rgba(217, 182, 90, .7); }
.site-footer a:hover { color: #fff; text-decoration-color: var(--brass-light); }
.footer-links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; font-size: .95rem; }
.footer-links li { margin: 0; }
.site-footer .fine { color: #d8d2bf; font-size: .86rem; line-height: 1.5; }
.site-footer :focus-visible { outline-color: var(--brass-light); }

/* ---------- 6. Buttons --------------------------------------------------- */
.button,
:where(main button:not(.leaflet-container *)),
:where(main input:is([type="submit"], [type="button"], [type="reset"]):not(.leaflet-container *)) {
  -webkit-appearance: none; appearance: none;
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  min-height: 2.75rem;
  padding: .66em 1.2em .62em;
  font: 600 1rem/1.2 var(--sans);
  text-align: center;
  text-decoration: none;
  color: #fffdf6;
  background: var(--green);
  border: 2px solid var(--green-dark);
  border-radius: var(--radius);
  box-shadow: 0 2px 0 var(--green-dark);
  cursor: pointer;
  transition: background-color .12s ease, box-shadow .12s ease, transform .12s ease;
}
.button:hover,
:where(main button:not(.leaflet-container *)):hover,
:where(main input:is([type="submit"], [type="button"]):not(.leaflet-container *)):hover { background: var(--green-dark); color: #fff; }
.button:active,
:where(main button:not(.leaflet-container *)):active { transform: translateY(1px); box-shadow: 0 1px 0 var(--green-dark); }
.button:visited { color: #fffdf6; }

.button-quiet, a.button-quiet {
  background: transparent; color: var(--green-dark); border-color: var(--green); box-shadow: none;
}
.button-quiet:hover { background: var(--green-tint); color: var(--green-dark); }
.button-quiet:visited { color: var(--green-dark); }
.button-small { min-height: 2.2rem; padding: .42em .85em .4em; font-size: .9rem; box-shadow: 0 1px 0 var(--green-dark); }
.button-small.button-quiet { box-shadow: none; }
.button-danger { background: var(--survey-red); border-color: #7a2a1d; box-shadow: 0 2px 0 #7a2a1d; color: #fffdf6; }
.button-danger:hover { background: #7a2a1d; }
.button-link {
  background: none; border: 0; box-shadow: none; padding: 0; min-height: 0;
  color: var(--green); font: inherit; text-decoration: underline; text-underline-offset: .17em;
}
.button-link:hover { background: none; color: var(--green-dark); }
:is(.button, button, input[type="submit"])[disabled],
:is(.button, button)[aria-disabled="true"] { opacity: .5; cursor: not-allowed; transform: none; }

/* ---------- 7. Forms ----------------------------------------------------- */
.form { max-width: 36rem; margin: 1rem 0 1.5rem; }
.form-wide { max-width: none; }
:where(main label:not(.leaflet-container *)) {
  display: block;
  margin: 0 0 1.05rem;
  font: 600 .95rem/1.4 var(--sans);
  color: var(--ink);
}
:where(main input:not([type="checkbox"], [type="radio"], [type="hidden"], [type="submit"], [type="button"], [type="reset"], [type="range"], [type="color"], [type="image"], [type="file"]):not(.leaflet-container *)),
:where(main select:not(.leaflet-container *)),
:where(main textarea:not(.leaflet-container *)) {
  display: block;
  width: 100%;
  margin-top: .35rem;
  padding: .6rem .75rem;
  font: 400 1.05rem/1.4 var(--sans);
  color: var(--ink);
  background: #fffefa;
  border: 1.5px solid var(--field-border);
  border-radius: var(--radius);
  box-shadow: inset 0 1px 2px rgba(31, 42, 36, .07);
}
:where(main textarea:not(.leaflet-container *)) { min-height: 6.5rem; resize: vertical; line-height: 1.5; }
:where(main select:not(.leaflet-container *)) {
  -webkit-appearance: none; appearance: none;
  padding-right: 2.4rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 6l4.5 4.5L12.5 6' fill='none' stroke='%231f4229' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 1rem;
}
:where(main :is(input, select, textarea):not(.leaflet-container *)):focus { border-color: var(--green); }
:where(main :is(input, textarea):not(.leaflet-container *))::placeholder { color: #7d857f; opacity: 1; }
:where(main input[type="file"]:not(.leaflet-container *)) { display: block; margin-top: .4rem; font: .95rem var(--sans); max-width: 100%; }
:where(main input[type="file"]:not(.leaflet-container *))::file-selector-button {
  font: 600 .9rem var(--sans); margin-right: .75rem; padding: .45rem .85rem; cursor: pointer;
  color: var(--green-dark); background: var(--card); border: 1.5px solid var(--green); border-radius: var(--radius);
}
:where(main :is(input[type="checkbox"], input[type="radio"]):not(.leaflet-container *)) {
  width: 1.15rem; height: 1.15rem; margin: .18rem 0 0; flex: none; accent-color: var(--green);
}
/* A label wrapping a checkbox or radio: box first, words beside it. */
:where(main label:has(> input[type="checkbox"], > input[type="radio"]):not(.leaflet-container *)),
.check {
  display: flex; align-items: flex-start; gap: .6rem;
  font-weight: 400; font-size: 1rem; line-height: 1.45;
}
fieldset { border: 1px solid var(--line-strong); border-radius: var(--radius-card); padding: .9rem 1.1rem .4rem; margin: 0 0 1.25rem; min-width: 0; background: rgba(255, 253, 246, .6); }
legend { font: 700 .95rem/1.3 var(--sans); padding: 0 .4rem; color: var(--ink); }
.hint, .form small, label small {
  display: block; margin-top: .3rem;
  font: 400 .86rem/1.45 var(--sans); color: var(--muted);
}
.form-row { display: grid; gap: 0 .85rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 8.5rem), 1fr)); }
.short { max-width: 9rem; }
.error, .field-error { color: var(--survey-red); font: 600 .9rem/1.4 var(--sans); }
:where(main :is(input, select, textarea)[aria-invalid="true"]) { border-color: var(--survey-red); }
.form > :is(button, .button, .actions):last-child { margin-top: .25rem; }
.inline-form { display: inline; margin: 0; }

/* ---------- 8. Stamps (small rubber-stamp labels) ------------------------ */
.stamp, .tag {
  display: inline-flex; align-items: center; gap: .3em;
  font: 700 .72rem/1.15 var(--sans);
  letter-spacing: .025em;
  padding: .28em .55em .26em;
  border: 1.5px solid currentColor;
  border-radius: 3px;
  /* A stamp moves to the next line whole; only a stamp wider than its column wraps inside. */
  white-space: normal;
  max-width: 100%;
  text-align: left;
  vertical-align: .12em;
  color: var(--ink);
  background: rgba(255, 253, 246, .7);
}
.stamp-record     { color: var(--green);        background: var(--green-tint); }
.stamp-owner      { color: var(--brass-ink);    background: var(--brass-tint); }
.stamp-background { color: var(--muted);        background: #eeebe1; }
.stamp-gap        { color: var(--survey-red);   background: var(--red-tint); }
.stamp-ai         { color: var(--ai-ink);       background: var(--ai-tint); }
.stamp-software   { color: var(--software-ink); background: var(--software-tint); }
.stamp-human      { color: var(--ink);          background: #f1eee4; }
.stamp-plain      { color: var(--ink); }
.stamp-checked {
  color: var(--green-dark); background: var(--card);
  border-width: 3px; border-style: double;
  padding: .24em .6em .22em .45em;
}
.stamp-checked::before { content: "\2713"; font-size: 1.05em; line-height: 1; }
.stamps { display: flex; flex-wrap: wrap; gap: .4rem; margin: .5rem 0; }

/* ---------- 9. Findings: catalog cards ----------------------------------- */
.finding {
  position: relative;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: .85rem 1.15rem .8rem;
  margin: 0 0 1.15rem;
  box-shadow: var(--shadow-card);
  break-inside: avoid;
}
.finding-labels {
  display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .45rem;
  margin: 0 0 .75rem;
  padding-bottom: .6rem;
  border-bottom: 2px solid #cd6a55;     /* the red header rule of an index card */
}
.finding-text { margin: 0 0 .6rem; font-size: 1.08rem; line-height: 1.58; }
.finding :is(p, li, blockquote) { max-width: none; }
.finding > :last-child { margin-bottom: 0; }
.finding-record { }
.finding-owner { background: #fffaea; border-color: #e3d3a4; }
.finding-owner .finding-labels { border-bottom-color: var(--brass); }
.finding-background { background: #faf8f1; border-style: dashed; border-color: var(--line-strong); box-shadow: none; }
.finding-background .finding-labels { border-bottom-color: var(--line-strong); }
.finding-background .finding-text { color: #39433d; }
.findings { margin: 1rem 0 1.5rem; }

/* Surveyors' own words: a ruled field-book page with a red double margin line, the words in a slanted
   serif sitting on the rules, and the source written beneath the page. */
.record-quote {
  --ruling: 1.8rem;
  --rule-top: .5rem;
  margin: .9rem 0 1rem;
  padding: var(--rule-top) 1rem 0 1.15rem;
  border: 1px solid #d3dccf;
  border-left: 4px double var(--survey-red);
  border-radius: 0 4px 4px 0;
  background-color: #fbfbf4;
  /* the rules fall just under each line's baseline */
  background-image: repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--ruling) - 1px), var(--rule) calc(var(--ruling) - 1px), var(--rule) var(--ruling));
  background-position: 0 calc(var(--rule-top) - .38rem);
  font: italic 400 1.12rem/var(--ruling) var(--serif);
  letter-spacing: .005em;
  color: #2b261d;
  max-width: none;
  overflow: hidden;
}
.record-quote p { margin: 0; max-width: none; line-height: var(--ruling); padding-bottom: .1rem; }
.record-quote footer, .record-quote cite {
  display: block;
  margin: 0 -1rem 0 -1.15rem;
  padding: .45rem 1rem .5rem 1.15rem;
  background: #f4f2e8;
  border-top: 1px solid #d3dccf;
  font: normal 500 .82rem/1.45 var(--sans);
  letter-spacing: 0;
  color: var(--muted);
}
.record-quote footer::before { content: "\2014\00a0"; }
.record-quote footer a { color: var(--green); }

/* Printed law and other printed quotations (statutes, treaties, agency pages): a printed page, not a field book. */
.record-quote:is(.quote-law, .quote-treaty-record, .quote-survey-grid, .quote-names, .quote-published-research, .quote-oral, .quote-owner-added, .quote-photo),
:is(.law-quote, .walk-school, .records-list, .school-note) .record-quote {
  padding: .15rem 0 .15rem 1.1rem;
  border: 0;
  border-left: 3px solid var(--brass);
  border-radius: 0;
  background: none;
  font: 400 1rem/1.6 var(--serif);
  color: var(--ink);
  overflow: visible;
}
.record-quote:is(.quote-law, .quote-treaty-record, .quote-survey-grid, .quote-names, .quote-published-research, .quote-oral, .quote-owner-added, .quote-photo) p,
:is(.law-quote, .walk-school, .records-list, .school-note) .record-quote p { line-height: 1.6; padding: 0; }
.record-quote:is(.quote-law, .quote-treaty-record, .quote-survey-grid, .quote-names, .quote-published-research, .quote-oral, .quote-owner-added, .quote-photo) footer,
:is(.law-quote, .walk-school, .records-list, .school-note) .record-quote footer {
  margin: .45rem 0 0; padding: 0; background: none; border: 0; font-size: .84rem;
}
/* Dr. Zybach's published words: the same green-ruled quotation as on How we research. */
.record-quote.quote-published-research {
  padding: .55rem .9rem .6rem 1rem; border-left: 4px solid var(--green);
  background: var(--card); border-radius: 0 var(--radius) var(--radius) 0; font-size: 1.04rem;
}
/* Spoken or the owner's own words: italic, with a dashed brass rule. */
.record-quote:is(.quote-oral, .quote-owner-added, .quote-photo) { font-style: italic; border-left-style: dashed; }

.source { margin: .8rem 0 0; font: .86rem/1.5 var(--sans); color: var(--muted); max-width: none; }
.source a { color: var(--green); word-break: break-word; }
.source-detail { color: var(--muted); }
p.source-detail { font: .86rem/1.5 var(--sans); color: var(--muted); }

/* "Report an error": a quiet fold-out under every finding. */
.report-error { margin-top: .45rem; font: .86rem/1.45 var(--sans); }
.report-error > summary {
  display: inline-flex; align-items: center; gap: .35rem;
  list-style: none; cursor: pointer;
  color: var(--muted); text-decoration: underline dotted; text-underline-offset: .2em;
  padding: .2rem 0;
}
.report-error > summary::-webkit-details-marker { display: none; }
.report-error > summary::before {
  content: ""; width: .5rem; height: .5rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: rotate(-45deg); transition: transform .12s ease; margin-right: .1rem;
}
.report-error[open] > summary::before { transform: rotate(45deg); }
.report-error > summary:hover { color: var(--survey-red); }
.report-error form {
  margin: .5rem 0 .25rem; padding: .85rem .9rem .3rem;
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
}
.report-error label { font-size: .86rem; margin-bottom: .75rem; }
.report-error textarea { min-height: 4.5rem; font-size: .98rem; }
.report-error input { font-size: .98rem; }
.report-error :is(button, input[type="submit"]) { min-height: 2.3rem; padding: .45em .9em; font-size: .9rem; margin-bottom: .6rem; }

/* ---------- 10. Gaps and next steps -------------------------------------- */
/* What the record can't say: one sheet in the gap colour, each gap marked with a dashed line,
   the way a surveyor marks a line nobody has run yet. Different, but not alarming. */
.gaps, :where(ul, ol):has(> .gap) {
  list-style: none;
  margin: .6rem 0 1.5rem;
  padding: .2rem 1.15rem;
  background: var(--gap);
  border: 1.5px dashed rgba(162, 59, 42, .32);
  border-radius: var(--radius-card);
  display: block;
  max-width: none;
}
.gap {
  position: relative;
  list-style: none;
  margin: 0;
  padding: .72rem 0 .74rem 2.1rem;
  line-height: 1.55;
  max-width: none;
}
.gap::before {
  content: "";
  position: absolute; left: .1rem; top: 1.48rem;
  width: 1.25rem; height: 0;
  border-top: 2px dashed rgba(162, 59, 42, .75);
}
.gap + .gap { margin-top: 0; border-top: 1px dashed rgba(162, 59, 42, .25); }
/* The heading already says these are gaps, so the per-line stamp is kept for screen readers only. */
.gap .stamp-gap {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}

/* What to look up next: a numbered checklist. */
.next-steps, :where(ul, ol):has(> .next-step) { list-style: none; padding: 0; margin: .6rem 0 1.5rem; display: grid; gap: .85rem; counter-reset: nextstep; }
.next-step {
  position: relative;
  list-style: none;
  margin: 0;
  padding: .95rem 1.15rem 1rem 3.65rem;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  max-width: none;
  break-inside: avoid;
  counter-increment: nextstep;
}
.next-step::before {
  content: "";
  position: absolute; left: 1.1rem; top: 1rem;
  width: 1.7rem; height: 1.7rem;
  display: grid; place-items: center;
  font: 700 .92rem/1 var(--sans);
  font-variant-numeric: lining-nums;
  color: var(--green-dark);
  background: #fffefa;
  border: 2px solid var(--green);
  border-radius: 3px;
  box-shadow: 2px 2px 0 var(--green-tint);
}
ol > .next-step::before { content: counter(nextstep); }
.next-step + .next-step { margin-top: 0; }
.next-step h4 { margin: 0 0 .35rem; font-size: 1.12rem; line-height: 1.3; padding-top: .1rem; }
.next-step p { margin: 0 0 .55rem; max-width: none; }
.next-step > :last-child { margin-bottom: 0; }
@media (max-width: 30rem) {
  .next-step { padding-left: 3.1rem; }
  .next-step::before { left: .8rem; }
}
.bring-back {
  background: var(--brass-tint);
  border-radius: 3px;
  padding: .45rem .7rem;
  font-size: 1rem;
}
.bring-back strong { font: 700 .8rem/1 var(--sans); color: var(--brass-ink); letter-spacing: .02em; margin-right: .2rem; }
.step-links { font: .88rem/1.55 var(--sans); color: var(--muted); }
.step-links a { color: var(--green); }
.cost { font: 600 .8rem var(--sans); color: var(--muted); white-space: nowrap; }

/* ---------- 11. Reading-level switch ------------------------------------ */
.level-switch {
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem;
  margin: 0 0 1.4rem;
  font: .9rem/1.3 var(--sans);
}
.level-label { font-weight: 700; color: var(--ink); }
.level-options { display: inline-flex; border: 1.5px solid var(--green); border-radius: 999px; background: var(--card); overflow: hidden; }
.level-switch a {
  display: inline-flex; align-items: center; min-height: 2.3rem;
  padding: .3rem .95rem;
  color: var(--green-dark); font-weight: 600; text-decoration: none;
  border-left: 1.5px solid var(--green);
}
.level-options a:first-child { border-left: 0; }
.level-switch > a { border: 1.5px solid var(--green); border-radius: 999px; }
.level-switch a:hover { background: var(--green-tint); }
.level-switch a[aria-current] { background: var(--green); color: #fffdf6; }
.level-switch a:focus-visible { outline-offset: -4px; outline-color: var(--brass-light); }
.level-note { color: var(--muted); font-style: italic; font-family: var(--serif); font-size: .98rem; }

/* ---------- 12. Cards and grids ------------------------------------------ */
.cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 16.5rem), 1fr));
  gap: 1.15rem;
  margin: 1.25rem 0 2rem;
  padding: 0;
  list-style: none;
}
.cards > li { margin: 0; max-width: none; }
.card {
  position: relative;
  display: block;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  padding: 1.1rem 1.2rem 1.2rem;
  box-shadow: var(--shadow-card);
  color: var(--ink);
  --hole: var(--card);
}
.card > :first-child { margin-top: 0; }
.card > :last-child { margin-bottom: 0; }
.card h2, .card h3 { margin: 0 0 .45rem; font-size: 1.22rem; line-height: 1.2; }
.card h4 { margin: .75rem 0 .3rem; }
.card p { max-width: none; }
a.card { text-decoration: none; }
a.card:hover, .card:has(.card-link:hover) { border-color: var(--green); }
/* Make a whole card clickable from its heading link: <h3><a class="card-link" href>…</a></h3> */
.card-link { color: var(--green-dark); text-decoration: none; }
.card-link::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.card-link:hover { text-decoration: underline; }
.card .card-foot { margin-top: .85rem; font: .86rem/1.4 var(--sans); color: var(--muted); }
.card :is(a, button, form, details):not(.card-link) { position: relative; z-index: 1; }

/* Cards sitting on a white sheet use buff stock so they still read as cards. */
:is(.brief, .walk-card, .card, .desk-answer, .placeholder-page) .finding { background: var(--stock); --hole: var(--card); box-shadow: none; }
:is(.brief, .walk-card, .card, .desk-answer, .placeholder-page) .finding-owner { background: #fdf5dc; }
:is(.brief, .walk-card) .next-step { background: var(--stock); }

/* ---------- 13. Tables ---------------------------------------------------- */
.table, :where(main table:not(.leaflet-container *)) {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0 1.6rem;
  background: var(--card);
  font: .95rem/1.45 var(--sans);
  font-variant-numeric: lining-nums tabular-nums;
}
:where(main) :where(th, td) { padding: .55rem .75rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
:where(main) thead :where(th, td) { border-bottom: 2px solid var(--ink); font-weight: 700; background: var(--paper-deep); white-space: nowrap; }
:where(main) tbody tr:nth-child(even) { background: #fbf8ee; }
:where(main) tbody th { font-weight: 600; }
caption { caption-side: top; text-align: left; padding: 0 0 .45rem; font: 600 .9rem var(--sans); color: var(--muted); }
.num, td.num, th.num { text-align: right; }
.table-wrap { overflow-x: auto; margin: 1rem 0 1.6rem; -webkit-overflow-scrolling: touch; }
.table-wrap > table { margin: 0; }
@media (max-width: 40rem) {
  .table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ---------- 14. Notices, tabs ------------------------------------------- */
/* A quiet inline note. Not a banner. */
.notice {
  margin: 1rem 0 1.4rem;
  padding: .75rem 1rem;
  background: var(--brass-tint);
  border-left: 4px solid var(--brass);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-size: 1rem;
  max-width: none;
}
.notice > :last-child { margin-bottom: 0; }
.notice > :first-child { margin-top: 0; }
.notice-good { background: var(--green-tint); border-left-color: var(--green); }
.notice-problem { background: var(--red-tint); border-left-color: var(--survey-red); }
.notice-plain { background: var(--card); border-left-color: var(--line-strong); }

/* Index-card divider tabs. .anchor-nav sticks to the top of the screen on long pages. */
.anchor-nav, .tabs {
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: .3rem;
  margin: 0 0 1.5rem;
  padding: 0;
  list-style: none;
  border-bottom: 2px solid var(--green-dark);
  font: 600 .95rem/1.2 var(--sans);
  color: var(--muted);
}
.anchor-nav { position: sticky; top: 0; z-index: 25; background: var(--paper); padding-top: .55rem; }
:is(.anchor-nav, .tabs) :is(ul, ol) { display: flex; flex-wrap: wrap; gap: .3rem; list-style: none; margin: 0; padding: 0; }
:is(.anchor-nav, .tabs) li { margin: 0; }
:is(.anchor-nav, .tabs) a {
  display: block;
  padding: .55rem 1rem .48rem;
  color: var(--green-dark);
  text-decoration: none;
  background: var(--paper-deep);
  border: 1px solid var(--line-strong);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}
:is(.anchor-nav, .tabs) a:hover { background: var(--school); }
:is(.anchor-nav, .tabs) a:is([aria-current], [aria-selected="true"], .active) { background: var(--green-dark); border-color: var(--green-dark); color: var(--paper); }

/* ---------- 15. Surveyor's Walk card ------------------------------------- */
.walk-card {
  position: relative;
  background: var(--card);
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  padding: clamp(1.05rem, 3.4vw, 2.1rem);
  margin: 1.25rem auto 2rem;
  max-width: var(--sheet);
  /* a printed card: a thin frame line just inside the edge */
  box-shadow: var(--shadow-card), inset 0 0 0 6px var(--card), inset 0 0 0 7px rgba(185, 173, 140, .55);
  --hole: var(--card);
}
.walk-card :is(p, li, dd, figcaption) { max-width: none; }
.walk-card > :first-child { margin-top: 0; }
.walk-card > :last-child { margin-bottom: 0; }
.walk-card > header, .walk-head { margin: 0 0 1.25rem; }
.walk-card > header::after, .walk-head::after {
  content: ""; display: block; height: 9px; margin-top: .8rem; opacity: .75;
  background:
    linear-gradient(var(--survey-red), var(--survey-red)) 0 50% / 100% 1.5px no-repeat,
    repeating-linear-gradient(to right, var(--survey-red) 0 2px, transparent 2px 26px) 0 0 / 100% 100% no-repeat;
}
.walk-card :is(h1, h2).walk-title, .walk-title { margin: 0; font-size: clamp(1.75rem, 1.4rem + 1.5vw, 2.35rem); font-weight: 400; }
.walk-where { margin: .35rem 0 0; font: 600 1rem/1.45 var(--sans); color: var(--ink); max-width: none; }
.walk-card h2 { font-size: 1.4rem; margin: 2rem 0 .6rem; }
.walk-card h3 { font-size: 1.15rem; margin: 1.5rem 0 .5rem; }
.walk-panels, .walk-card .panels, .two-panel {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.1rem;
  margin: 1rem 0 1.5rem;
  align-items: start;
}
@media (min-width: 48rem) {
  .walk-panels, .walk-card .panels, .two-panel { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
.walk-panel, .walk-card .panel {
  display: flex; flex-direction: column;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  padding: .8rem .85rem .85rem;
  min-width: 0;
}
.walk-panel > :is(h2, h3, h4), .walk-card .panel > :is(h2, h3, h4) {
  margin: 0 0 .6rem; font: 700 .8rem/1.3 var(--sans); letter-spacing: .07em; text-transform: uppercase; color: var(--brass-ink);
}
.walk-panel figure, .walk-card .panel figure { margin: 0; }
.walk-panel :is(img, svg):not(.leaflet-container *), .walk-card .panel :is(img, svg):not(.leaflet-container *) { display: block; width: 100%; height: auto; border-radius: 3px; }
.walk-panel img:not(.leaflet-container *) { border: 1px solid var(--line-strong); background: #fff; }
/* the two pictures are the same size: both square, framed alike */
.walk-panel .walk-plat img { aspect-ratio: 1 / 1; object-fit: cover; }
.walk-panel > .township-figure { margin: 0; }
.walk-panel > .township-figure svg {
  aspect-ratio: 1 / 1; max-width: none; padding: 4%;
  background: #fffefa; border: 1px solid var(--line-strong); border-radius: 3px;
}
.walk-panel figcaption, .walk-panel .walk-map-note { font: .82rem/1.45 var(--sans); color: var(--muted); margin-top: .55rem; }
.walk-section { margin: 1.75rem 0 0; }
.walk-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin: 1.5rem 0 .5rem; }
.walk-labels { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1.25rem; }
.permalink { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; font: .92rem/1.4 var(--sans); }
.permalink code, .permalink input { font: .88rem var(--mono); background: var(--paper-deep); padding: .35rem .55rem; border-radius: 3px; word-break: break-all; }
.township { display: block; width: 100%; height: auto; }
.school-note { background: var(--school); border-radius: var(--radius); padding: .8rem 1rem; border-left: 4px solid var(--brass); }
.school-note > :last-child { margin-bottom: 0; }
.claims { list-style: none; padding: 0; }
.claims li { padding: .4rem 0; border-bottom: 1px dotted var(--line-strong); }

/* Maps (Leaflet). Give the map element one of these classes; it needs a height. */
.map, .walk-map, .find-map {
  height: clamp(320px, 58vh, 540px);
  width: 100%;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-card);
  background: #e7e2d1;
}
.walk-map, .map-small { height: 300px; }
.walk-panel .walk-map, .walk-panel .map { height: auto; aspect-ratio: 1 / 1; min-height: 260px; border-radius: 3px; }
.leaflet-container { isolation: isolate; font: .8rem/1.4 var(--sans); z-index: 0; }
.leaflet-container :focus-visible { outline: 3px solid var(--focus); }
.map-tools { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: .75rem 0; }
.map-note, .map-status { font: .9rem/1.45 var(--sans); color: var(--muted); margin: .5rem 0; }
.grid-says, .locate-result {
  margin: 1rem 0; padding: .8rem 1rem;
  background: var(--card); border: 1px solid var(--line); border-left: 4px solid var(--survey-red);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-size: 1.05rem;
}
.grid-says strong, .locate-result strong { font-weight: 700; }

/* ---------- 16. The one-page brief -------------------------------------- */
.brief {
  position: relative;
  background: var(--card);
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  padding: clamp(1.05rem, 3.4vw, 2.1rem);
  margin: 1.25rem auto 2rem;
  max-width: var(--sheet);
  box-shadow: var(--shadow-card);
  --hole: var(--card);
  counter-reset: briefpart;
}
.brief :is(p, li, dd, blockquote, figcaption) { max-width: none; }
.brief > :first-child { margin-top: 0; }
.brief > header, .brief-head { margin: 0 0 1.25rem; padding-bottom: 1.1rem; border-bottom: 1px solid var(--line); }
.brief-question, .brief .question {
  margin: .4rem 0 0;
  font: italic 400 clamp(1.2rem, 1.1rem + .6vw, 1.45rem)/1.4 var(--serif);
  color: var(--ink);
  max-width: none;
}
.brief h2 { font-size: clamp(1.4rem, 1.2rem + .8vw, 1.7rem); margin: 0 0 .3rem; }
.brief h3 {
  font-size: 1.28rem;
  margin: 2.1rem 0 .85rem;
  padding-bottom: .35rem;
  border-bottom: 1px solid var(--line);
}
.brief-part { margin: 0; }
/* The three parts, numbered on brass survey caps like "How it works" on the home page. */
.brief :is(.brief-shows, .brief-gaps, .brief-next, .brief-part) { margin: 2.4rem 0 0; }
.brief :is(.brief-shows, .brief-gaps, .brief-next, .brief-part) > :is(h2, h3):first-child {
  counter-increment: briefpart;
  display: flex; align-items: center; gap: .7rem;
  margin: 0 0 1rem; padding: 0 0 .55rem;
  font-size: clamp(1.3rem, 1.18rem + .5vw, 1.5rem); font-weight: 700;
  border-bottom: 2px solid var(--ink);
}
.brief :is(.brief-shows, .brief-gaps, .brief-next, .brief-part) > :is(h2, h3):first-child::before {
  content: counter(briefpart);
  flex: none;
  width: 2.1rem; height: 2.1rem;
  display: grid; place-items: center;
  font: 700 1.02rem/1 var(--serif);
  font-variant-numeric: lining-nums;
  color: var(--green-dark);
  background: radial-gradient(circle at 35% 30%, #f3e2a6, var(--brass-light) 45%, var(--brass) 100%);
  border: 1.5px solid var(--brass-ink);
  border-radius: 50%;
  box-shadow: inset 0 0 0 3px rgba(255, 253, 246, .35);
}
.brief-gaps > :is(h2, h3):first-child, .brief-part#cant-say > h2:first-child { border-bottom-style: dashed; }
.brief > footer, .brief-foot {
  margin-top: 2rem; padding-top: 1rem;
  border-top: 1px dashed var(--line-strong);
  font: .88rem/1.5 var(--sans); color: var(--muted);
}
.brief > footer p, .brief-foot p { max-width: none; }

/* ---------- 17. Ask the Reference Desk ----------------------------------- */
.ask-box {
  background: var(--card);
  border: 1px solid var(--line);
  border-top: 4px solid var(--brass);
  border-radius: var(--radius-card);
  padding: 1.15rem 1.25rem 1.25rem;
  margin: 1.25rem 0 1.75rem;
  box-shadow: var(--shadow-card);
}
.ask-box > :first-child { margin-top: 0; }
.ask-box > :last-child { margin-bottom: 0; }
.ask-box textarea { min-height: 7rem; font: 400 1.12rem/1.5 var(--serif); }
.ask-box h2, .ask-box h3 { margin: 0 0 .5rem; }
.chips, .suggestions { display: flex; flex-wrap: wrap; gap: .45rem; margin: .5rem 0 1rem; padding: 0; list-style: none; }
.chips li, .suggestions li { margin: 0; }
.chip, :where(main) [data-fill] {
  -webkit-appearance: none; appearance: none;
  display: inline-flex; align-items: center;
  min-height: 2.25rem;
  padding: .38rem .85rem;
  font: 500 .9rem/1.25 var(--sans);
  text-align: left;
  color: var(--ink);
  background: var(--paper);
  border: 1.5px solid var(--line-strong);
  border-radius: 999px;
  box-shadow: none;
  cursor: pointer;
  text-decoration: none;
  transform: none;
}
.chip:hover, :where(main) [data-fill]:hover { border-color: var(--green); background: var(--green-tint); color: var(--green-dark); }

.desk-answer {
  position: relative;
  background: var(--card);
  border: 1px solid var(--line);
  border-left: 4px solid var(--ai-ink);
  border-radius: 0 var(--radius-card) var(--radius-card) 0;
  padding: 1.1rem 1.3rem 1.15rem;
  margin: 1.25rem 0 1.75rem;
  box-shadow: var(--shadow-card);
}
.desk-answer > :first-child { margin-top: 0; }
.desk-answer > :last-child { margin-bottom: 0; }
.desk-answer :is(.question, .desk-question) { font-style: italic; color: var(--muted); }
.desk-answer :is(.citations, .sources, .desk-sources) {
  margin: 1rem 0 0; padding: .75rem 0 0 1.2rem;
  border-top: 1px solid var(--line);
  font: .88rem/1.5 var(--sans); color: var(--muted);
}
.desk-answer :is(.citations, .sources, .desk-sources) li + li { margin-top: .25rem; }
.desk-answer > footer, .desk-answer .desk-foot { margin-top: 1rem; font: .85rem/1.45 var(--sans); color: var(--muted); }
.record-silent { font-weight: 700; color: var(--survey-red); }

/* ---------- 18. Booklet pieces: video slot, placeholder page ------------- */
/* A clip that hasn't been filmed yet: a strip of film with sprocket holes. */
.video-slot {
  position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  aspect-ratio: 16 / 9;
  width: 100%;
  max-width: 34rem;
  margin: 1.25rem 0 1.5rem;
  padding: 2rem 1.5rem;
  background: #29322c;
  color: #eee8d6;
  border-radius: var(--radius-card);
  text-align: center;
  font: .95rem/1.45 var(--sans);
  overflow: hidden;
}
.video-slot::before, .video-slot::after {
  content: ""; position: absolute; left: 0; right: 0; height: 16px;
  background: #1c231e repeating-linear-gradient(to right, transparent 0 7px, rgba(238, 232, 214, .78) 7px 17px, transparent 17px 24px) 0 50% / 100% 7px no-repeat;
}
.video-slot::before { top: 0; }
.video-slot::after { bottom: 0; }
.video-slot > :first-child::before {
  content: ""; display: block; width: 2.6rem; height: 2.6rem; margin: 0 auto .7rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='18' fill='none' stroke='%23d9b65a' stroke-width='2'/%3E%3Cpath d='M16 12.5l12 7.5-12 7.5z' fill='%23d9b65a'/%3E%3C/svg%3E") center / contain no-repeat;
}
.video-slot :is(h3, h4, strong, b) { color: #fff; font-family: var(--sans); }
.video-slot :is(h3, h4) { margin: 0 0 .3rem; font-size: 1.02rem; }
.video-slot p { margin: 0 0 .3rem; max-width: 30rem; }
.video-slot > :last-child { margin-bottom: 0; }
.video-slot a { color: var(--brass-light); }

/* A page whose text isn't written yet, shown honestly as a galley sheet. */
.placeholder-page {
  position: relative;
  margin: 1.25rem 0 2rem;
  padding: clamp(1.15rem, 4vw, 2.4rem);
  background-color: var(--card);
  background-image: repeating-linear-gradient(-45deg, transparent 0 16px, rgba(168, 132, 44, .055) 16px 17px);
  border: 2px dashed var(--line-strong);
  border-radius: 8px;
  --hole: var(--card);
}
.placeholder-page > :first-child { margin-top: 0; }
.placeholder-page > :last-child { margin-bottom: 0; }
.placeholder-note, .placeholder-page > .stamp:first-child {
  display: inline-block; margin: 0 0 1rem;
  font: 700 .8rem/1.2 var(--sans); letter-spacing: .03em;
  color: var(--brass-ink); border: 1.5px dashed var(--brass); border-radius: 3px; padding: .35em .65em;
  background: var(--card);
}

/* ---------- 19. Plans and prices ---------------------------------------- */
.price {
  display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem;
  margin: .3rem 0 .8rem;
  font: 700 1.8rem/1.15 var(--serif);
  font-variant-numeric: lining-nums;
  color: var(--ink);
}
.price :is(small, .per, .unit) { font: 400 .95rem/1.3 var(--sans); color: var(--muted); }
/* If .price is used as a whole card instead of the price line, it behaves like a card. */
.price:has(> :is(h2, h3, h4, p, div, ul, ol, form, section, details)), .price-card {
  display: block;
  font: inherit;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  padding: 1.15rem 1.25rem 1.25rem;
  box-shadow: var(--shadow-card);
}
.price-card .price { margin-top: .1rem; }
.price-free { color: var(--green); }
.price-test {
  display: inline-flex; align-items: center; gap: .4em;
  padding: .3em .7em .28em .55em;
  font: 700 .72rem/1.1 var(--sans);
  letter-spacing: .03em;
  color: var(--survey-red);
  background: #fbefe9;
  border: 1.5px solid var(--survey-red);
  border-radius: 1em .3em .3em 1em;          /* a shipping tag */
  white-space: nowrap;
  vertical-align: .2em;
}
.price-test::before { content: ""; width: .48em; height: .48em; border-radius: 50%; border: 1.5px solid currentColor; background: var(--card); flex: none; }
.vote { margin-top: 1rem; padding-top: .85rem; border-top: 1px dashed var(--line-strong); }
.vote-options { display: flex; flex-wrap: wrap; gap: .5rem; }

/* ---------- 20. Small things that recur ---------------------------------- */
.not-title {
  margin: 1.75rem 0 0;
  padding-top: .8rem;
  border-top: 1px solid var(--line);
  font: italic 400 .98rem/1.45 var(--serif);
  color: var(--muted);
  max-width: none;
}
.label-line, .made-by { font: .86rem/1.5 var(--sans); color: var(--muted); }
.thanks { font-size: 1.15rem; }
.pagination { display: flex; gap: .75rem; justify-content: space-between; flex-wrap: wrap; margin: 2rem 0 0; font-family: var(--sans); }
details.plain > summary, .faq > summary { cursor: pointer; font: 600 1rem/1.4 var(--sans); color: var(--green-dark); padding: .45rem 0; }
.toc { list-style: none; padding: 0; margin: 1rem 0 1.5rem; counter-reset: toc; }
.toc li { margin: 0; padding: .55rem 0; border-bottom: 1px dotted var(--line-strong); display: flex; gap: .75rem; align-items: baseline; max-width: none; }
.toc li::before { counter-increment: toc; content: counter(toc); font: 700 .85rem var(--sans); color: var(--brass-ink); min-width: 1.2rem; }

/* ---------- 21. Home page ------------------------------------------------ */
.home > section + section { margin-top: clamp(2.75rem, 7vw, 4.5rem); }
.hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.75rem;
  align-items: center;
}
.hero h1 { font-size: clamp(2.35rem, 1.5rem + 3.9vw, 3.9rem); line-height: 1.04; margin: .1em 0 .1em; letter-spacing: -.02em; }
.hero .survey-line { margin: 1rem 0 1.35rem; max-width: 24rem; }
.hero .lede { max-width: 33rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1.5rem 0 0; }
.hero-actions .button { font-size: 1.05rem; padding: .78em 1.35em .74em; flex: 1 1 auto; }
@media (min-width: 30rem) { .hero-actions .button { flex: 0 0 auto; } }
/* The one thing to do first: big, green, with a pin, impossible to miss on a phone in a pasture. */
.hero-actions .button.hero-go {
  font-size: 1.18rem; min-height: 3.5rem; padding: .8em 1.55em .76em;
  box-shadow: 0 3px 0 var(--green-dark), 0 12px 22px -14px rgba(31, 66, 41, .8);
}
.hero-go .icon { width: 1.35em; height: 1.35em; stroke-width: 1.9; }
.hero-note { margin: .75rem 0 0; font: .98rem/1.4 var(--sans); color: var(--muted); max-width: none; }
@media (max-width: 30rem) {
  .hero-actions { gap: .6rem; margin-top: 1.25rem; }
  .hero-actions .button.hero-go { flex: 1 1 100%; font-size: 1.28rem; min-height: 3.85rem; }
  .hero-actions .button.button-quiet { flex: 1 1 100%; font-size: 1rem; min-height: 2.9rem; }
  .hero-note { text-align: center; }
}
.hero-plat { margin: 0 auto; width: 100%; max-width: 21rem; }
.hero-plat figcaption { margin-top: .6rem; }
@media (min-width: 52rem) {
  .hero { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 3rem; }
  .hero-plat { max-width: 25rem; margin-right: 0; }
}

.section-intro { color: var(--muted); margin-top: -.2rem; }

/* The four corners of the reference room, drawn as a floor plan. */
.room {
  position: relative;
  margin: 1.25rem 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  border: 5px double var(--ink);
  background: var(--card);
}
.room > li { margin: 0; max-width: none; }
.corner {
  position: relative;
  height: 100%;
  padding: 1.2rem 1.25rem 1.3rem;
  border-bottom: 1px solid var(--line);
}
.room > li:last-child .corner { border-bottom: 0; }
.corner h3 { display: flex; align-items: center; gap: .6rem; margin: 0 0 .35rem; font-size: 1.32rem; }
.corner h3 a { color: var(--green-dark); text-decoration: none; }
.corner h3 a::after { content: ""; position: absolute; inset: 0; }
.corner h3 a:hover { text-decoration: underline; text-decoration-thickness: 1px; }
.corner:hover { background: #fffaea; }
.corner .icon { width: 2.1rem; height: 2.1rem; color: var(--brass-ink); stroke-width: 1.35; }
.corner-what { margin: 0 0 .35rem; font: 600 .86rem/1.3 var(--sans); color: var(--brass-ink); }
.corner p:last-child { margin-bottom: 0; }
.corner .also { position: relative; z-index: 1; font: .9rem/1.4 var(--sans); }
.room-door { margin: .6rem 0 0; max-width: none; font: italic .95rem/1.4 var(--serif); color: var(--muted); text-align: center; }
@media (min-width: 46rem) {
  .room { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .corner { padding: 1.5rem 1.6rem 1.6rem; border-bottom: 0; }
  .room > li:nth-child(odd) .corner { border-right: 1px solid var(--line); }
  .room > li:nth-child(-n+2) .corner { border-bottom: 1px solid var(--line); }
  /* a door in the south wall, drawn the way a floor plan draws one: the opening, the open leaf, its swing */
  .room::before {
    content: ""; position: absolute; left: 50%; bottom: -5px; width: 3.25rem; height: 5px; margin-left: -1.625rem;
    background: var(--paper);
  }
  .room::after {
    content: ""; position: absolute; left: 50%; bottom: 0; width: 3.25rem; height: 3.25rem; margin-left: -1.625rem;
    border-left: 2px solid var(--ink);
    border-top: 1px dashed var(--ink); border-right: 1px dashed var(--ink);
    border-top-right-radius: 100%;
    opacity: .5;
    pointer-events: none;
  }
}

/* How it works: three numbered steps, numbers on brass survey caps. */
.steps { list-style: none; padding: 0; margin: 1.25rem 0 0; display: grid; gap: 1.25rem; counter-reset: step; }
.steps > li { position: relative; margin: 0; padding-left: 3.6rem; max-width: none; counter-increment: step; }
.steps > li::before {
  content: counter(step);
  position: absolute; left: 0; top: -.15rem;
  width: 2.6rem; height: 2.6rem;
  display: grid; place-items: center;
  font: 700 1.15rem/1 var(--serif);
  font-variant-numeric: lining-nums;
  color: var(--green-dark);
  background: radial-gradient(circle at 35% 30%, #f3e2a6, var(--brass-light) 45%, var(--brass) 100%);
  border: 1.5px solid var(--brass-ink);
  border-radius: 50%;
  box-shadow: inset 0 0 0 3px rgba(255, 253, 246, .35);
}
.steps h3 { margin: 0 0 .25rem; font-size: 1.25rem; }
.steps p { margin: 0; }
@media (min-width: 52rem) {
  .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; }
  .steps > li { padding-left: 0; padding-top: 3.4rem; }
  .steps > li::after {
    content: ""; position: absolute; top: 1.15rem; left: 3.3rem; right: -1.5rem; height: 9px; opacity: .55;
    background:
      linear-gradient(var(--survey-red), var(--survey-red)) 0 50% / 100% 1.5px no-repeat,
      repeating-linear-gradient(to right, var(--survey-red) 0 2px, transparent 2px 26px) 0 0 / 100% 100% no-repeat;
  }
  .steps > li:last-child::after { display: none; }
}

.example-card .meta { margin: 0 0 .5rem; }
.example-card img { display: block; width: calc(100% + 2.4rem); max-width: none; margin: -1.1rem -1.2rem .9rem; height: 10.5rem; object-fit: cover; border-radius: var(--radius-card) var(--radius-card) 0 0; border-bottom: 1px solid var(--line); }

.plans-line { display: grid; gap: .25rem 1.25rem; align-items: center; padding: 1.15rem 1.25rem; background: var(--brass-tint); border-radius: var(--radius-card); border: 1px solid #e6d7a8; }
.plans-line p { margin: 0; max-width: none; }
@media (min-width: 46rem) { .plans-line { grid-template-columns: 1fr auto; } }

.signoff {
  margin: clamp(2.5rem, 7vw, 4rem) 0 0;
  text-align: center;
  font: italic 400 clamp(1.35rem, 1.2rem + .8vw, 1.75rem)/1.3 var(--serif);
  color: var(--green-dark);
}
.signoff .icon { display: block; margin: 0 auto .4rem; width: 3.2rem; height: 3.2rem; color: var(--green-dark); stroke-width: 1.15; }
.signoff .icon circle { fill: rgba(31, 42, 36, .14); }

/* ---------- 22. About and other plain pages ----------------------------- */
.page-head { margin-bottom: 1.5rem; }
.page-head h1 { margin-bottom: .35rem; }
.people { display: grid; gap: 1rem; grid-template-columns: minmax(0, 1fr); margin: 1.25rem 0 1.5rem; }
.person { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-card); padding: 1.15rem 1.25rem; }
.person h3 { margin: 0 0 .5rem; }
.person p:last-child { margin-bottom: 0; }
.pullout { margin: 1.75rem 0; padding: 1.1rem 1.3rem; background: var(--card); border: 1px solid var(--line); border-left: 4px solid var(--survey-red); border-radius: 0 var(--radius-card) var(--radius-card) 0; }
.pullout > :last-child { margin-bottom: 0; }
.pullout h2, .pullout h3 { margin-top: 0; }
.keeps { display: grid; gap: .6rem; padding: 0; list-style: none; }
.keeps li { margin: 0; padding: .65rem .9rem; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); max-width: none; }
.keeps strong { font-family: var(--sans); font-size: .95rem; }

/* ---------- 23. The style page (/style) --------------------------------- */
.style-page > section { margin: 2.5rem 0 0; padding-top: 1rem; border-top: 1px solid var(--line); }
.style-page > section > h2 { margin-top: 0; }
.style-toc { display: flex; flex-wrap: wrap; gap: .35rem .9rem; padding: 0; list-style: none; font: .92rem/1.4 var(--sans); }
.style-toc li { margin: 0; }
.swatches { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); padding: 0; list-style: none; }
.swatches li { margin: 0; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--card); font: .8rem/1.35 var(--sans); }
.swatch-chip { height: 3.2rem; border-bottom: 1px solid var(--line); }
.swatches span { display: block; padding: .4rem .55rem .45rem; }
.swatches code { background: none; padding: 0; font-size: .78rem; }
.icon-row { display: flex; flex-wrap: wrap; gap: 1.25rem; padding: 0; list-style: none; font: .82rem var(--sans); color: var(--muted); }
.icon-row li { margin: 0; display: flex; flex-direction: column; align-items: center; gap: .3rem; }
.icon-row .icon { width: 2.4rem; height: 2.4rem; color: var(--green-dark); }
.specimen { margin: .25rem 0 1rem; }
.specimen-row { display: grid; gap: .25rem 1rem; grid-template-columns: 7rem minmax(0, 1fr); align-items: baseline; border-bottom: 1px dotted var(--line); padding: .35rem 0; }
.specimen-row > span:first-child { font: .8rem var(--sans); color: var(--muted); }

/* ---------- 24. Area pages: the class names each builder uses ------------- */
/* Aliases and small extras */
.notice-ok { background: var(--green-tint); border-left-color: var(--green); }
.notice-error { background: var(--red-tint); border-left-color: var(--survey-red); }
.choice { display: flex; align-items: flex-start; gap: .55rem; font: 400 1rem/1.45 var(--sans); margin: 0 0 .6rem; }
.crumbs { font: .88rem/1.4 var(--sans); color: var(--muted); margin: 0 0 .75rem; }
.crumbs a { color: var(--green); }
.empty-state { color: var(--muted); font-style: italic; padding: 1rem 1.15rem; border: 1.5px dashed var(--line-strong); border-radius: var(--radius-card); background: rgba(255, 253, 246, .5); max-width: none; }
.empty-state > :last-child { margin-bottom: 0; }
div.empty-state, section.empty-state { font-style: normal; }
.credit { font: .82rem/1.4 var(--sans); color: var(--muted); }
.labels { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.count { color: var(--muted); font: .88rem var(--sans); }
details.danger, section.danger, .danger-zone {
  margin: 2rem 0 1rem; padding: .9rem 1.1rem;
  border: 1.5px solid rgba(162, 59, 42, .45); border-radius: var(--radius-card); background: #fcf3ef;
}
details.danger > summary { cursor: pointer; font: 600 1rem/1.4 var(--sans); color: var(--survey-red); }
.danger h2, .danger h3 { color: var(--survey-red); margin-top: 0; }
.reset-link { font-family: var(--mono) !important; font-size: .9rem !important; }

/* Find your land (Land) */
.find-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem 2rem; margin: 1.25rem 0 2rem; }
@media (min-width: 60rem) { .find-layout { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); align-items: start; } }
.find-map-col, .find-form-col { min-width: 0; }
.find-form-col .form { max-width: none; }
.find-search { margin: 0 0 .75rem; }
.find-search label { margin-bottom: .3rem; }
.find-search-row { display: flex; gap: .5rem; align-items: stretch; }
.find-search-row input { margin-top: 0 !important; flex: 1 1 auto; min-width: 0; }
.find-search-row button { flex: none; }
.find-search-status { font: .88rem/1.4 var(--sans); color: var(--muted); margin: .35rem 0 0; min-height: 1.2em; }
.find-tools { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .6rem; margin: .5rem 0 .75rem; }
.find-tools[hidden], .find-outline-tools[hidden] { display: none; }
.find-modes, .find-layers, .find-outline-tools { display: inline-flex; flex-wrap: wrap; gap: .4rem; }
.find-layers { margin-left: auto; }
.find-map { position: relative; }
.find-map-fallback, .walk-map-fallback { margin: 0; padding: 2rem 1rem; text-align: center; font: .95rem/1.4 var(--sans); color: var(--muted); }
.find-hint { font: .9rem/1.45 var(--sans); color: var(--muted); margin: .6rem 0 0; }
.find-result { margin: .85rem 0 0; }
.find-result:empty { display: none; }
.find-result:not(:empty), .find-result-ok {
  padding: .8rem 1rem; background: var(--card);
  border: 1px solid var(--line); border-left: 4px solid var(--survey-red);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-size: 1.05rem; line-height: 1.45;
}
.chips-label { flex-basis: 100%; font: 600 .86rem/1.3 var(--sans); color: var(--muted); }
.chips[hidden] { display: none; }
.find-coords { margin-top: .5rem; }
.find-coords label { display: inline-block; width: calc(50% - .4rem); vertical-align: top; }
.find-coords label + label { margin-left: .5rem; }
.find-manual { margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid var(--line); }
.manual-form { max-width: 44rem; }
.manual-row { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 0 .75rem; }
.manual-row > label { flex: 1 1 7.5rem; min-width: 0; }
.manual-row > :is(button, .button) { margin: 1.7rem 0 1.05rem; }
.bell-list { padding-left: 1.4em; }

/* Toggle buttons: pressed = filled, not pressed = outlined. */
:where(main) button[aria-pressed="false"] { background: transparent; color: var(--green-dark); border-color: var(--green); box-shadow: none; }
:where(main) button[aria-pressed="false"]:hover { background: var(--green-tint); color: var(--green-dark); }
:where(main) button[aria-pressed="true"] { background: var(--green-dark); color: #fffdf6; box-shadow: inset 0 2px 0 rgba(0, 0, 0, .2); }

/* The Surveyor's Walk card, as Land writes it */
.walk-page { margin: 0; }
.walk-page > .walk-card { margin-left: auto; margin-right: auto; }
/* Title block: the name of the card, then where it is, then a surveyor's chain. */
.walk-head :is(h1, h2) { margin: 0; font-size: clamp(2rem, 1.45rem + 2.2vw, 2.75rem); font-weight: 400; letter-spacing: -.012em; line-height: 1.05; }
p.walk-title { margin: .45rem 0 0; font: 600 1rem/1.45 var(--sans); color: var(--ink); max-width: none; letter-spacing: .005em; }
.walk-card-compact { padding: clamp(1rem, 2.8vw, 1.75rem); }
.walk-card-compact .walk-head :is(h1, h2, h3) { font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.1rem); }
.walk-card > section > :is(h2, h3):first-child { margin-top: 0; }
.walk-words, .walk-school, .walk-claims, .walk-sources, .walk-ask { margin-top: 2rem; }
.walk-words > p:first-of-type { font-size: 1.08rem; }
.walk-ways { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; margin: 1rem 0 0; }
@media (min-width: 40rem) { .walk-ways { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.walk-way { display: flex; flex-direction: column; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-card); padding: .9rem 1.05rem 1rem; min-width: 0; }
.walk-way h4 { margin: 0 0 .45rem; font-size: 1.12rem; }
.walk-way p { font-size: 1rem; }
.walk-way .step-links { padding-left: 1.1rem; }
.walk-way .step-links li + li { margin-top: .45rem; }
.walk-way .form { margin-bottom: 0; margin-top: auto; }
.walk-way .form label { font-size: .88rem; }
/* School land: a tidy note in the school colour. */
.walk-school {
  padding: 1.05rem 1.2rem 1.1rem;
  background: #f8f1d9;
  border: 1px solid #e6d6a2;
  border-left: 4px solid var(--brass);
  border-radius: 0 var(--radius-card) var(--radius-card) 0;
}
.walk-school > :is(h2, h3):first-child { margin: 0 0 .45rem; font-size: 1.2rem; }
.walk-school p { margin-bottom: .6rem; }
.walk-school > :last-child { margin-bottom: 0; }
.walk-school .source-detail { font-size: .84rem; }
.walk-school .record-quote { margin: .75rem 0 .85rem; font-size: .98rem; }
/* Claims: survey-grid facts, in two columns on wide screens. */
.walk-claims ul { list-style: none; padding: 0; margin: .5rem 0 .6rem; display: grid; gap: 0 1.5rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 24rem), 1fr)); font: 1rem/1.45 var(--sans); }
.walk-claims li { margin: 0; padding: .45rem 0 .45rem 1.3rem; border-bottom: 1px dotted var(--line-strong); position: relative; }
.walk-claims li::before { content: ""; position: absolute; left: .1rem; top: .95rem; width: .62rem; height: .62rem; border: 1.5px solid var(--survey-red); transform: rotate(45deg) scale(.8); }
.walk-claims li + li { margin-top: 0; }
/* Sources: small print, numbered, the way a card lists them. */
.walk-sources ul { counter-reset: src; list-style: none; padding: 0; margin: .5rem 0 1rem; font: .86rem/1.45 var(--sans); color: var(--muted); columns: 2 19rem; column-gap: 2rem; }
.walk-sources li { counter-increment: src; position: relative; padding-left: 1.6rem; margin: 0 0 .4rem; break-inside: avoid; }
.walk-sources li::before { content: counter(src) "."; position: absolute; left: 0; width: 1.2rem; text-align: right; font-weight: 600; color: var(--brass-ink); font-variant-numeric: lining-nums; }
.walk-sources li + li { margin-top: 0; }
.walk-sources > :is(h2, h3):first-child { margin-bottom: .5rem; }
.walk-plat, .walk-figure, .township-figure { margin: 0 0 .5rem; }
.walk-plat img, .walk-figure img { display: block; width: 100%; height: auto; border: 1px solid var(--line); border-radius: 3px; background: #fff; }
.walk-figure { margin-top: 1rem; }
.walk-drawing { margin-top: .6rem; font: .9rem/1.4 var(--sans); }
.walk-drawing > summary { cursor: pointer; color: var(--green-dark); font-weight: 600; }
.township-svg { display: block; width: 100%; height: auto; max-width: 30rem; }
.walk-map-note { font: .84rem/1.45 var(--sans); color: var(--muted); margin: .5rem 0 0; max-width: none; }
/* The permanent link: a slip with the address and two small buttons. */
.walk-permalink {
  display: flex; flex-wrap: wrap; align-items: center; gap: .45rem .75rem;
  margin: 1rem 0 0; padding: .6rem .85rem;
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
  font: .9rem/1.45 var(--sans); color: var(--muted); max-width: none;
}
.walk-permalink a { word-break: break-all; font-family: var(--mono); font-size: .86rem; color: var(--green-dark); }
.walk-permalink .button-small { min-height: 2rem; padding: .3em .75em; font-size: .85rem; }
.walk-ask { display: flex; flex-wrap: wrap; align-items: flex-start; gap: .75rem; }
.walk-ask > p { margin: 0; }
.story-lead { flex: 1 1 18rem; }
.story-lead > summary { list-style: none; }
.story-lead > summary::-webkit-details-marker { display: none; }
.story-lead[open] { flex-basis: 100%; }
.story-lead[open] > summary { margin-bottom: .75rem; }
.story-lead .form { max-width: 36rem; padding: 1rem 1.1rem .4rem; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-card); }
/* The short card on the place page: one line about the surveyor's words, and the way to the full card. */
.walk-words-line { margin: 1.1rem 0 .75rem; font-size: 1.05rem; }
.walk-full-link { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin: 0; }
.walk-full-link .hint { display: inline; margin: 0; }
.brief-ai-note { margin: -.35rem 0 1rem; font: .88rem/1.5 var(--sans); color: var(--muted); }
.walk-foot { margin-top: 1.75rem; padding-top: .9rem; border-top: 1px dashed var(--line-strong); }
.walk-foot p { max-width: none; }
.walk-foot > p:first-child { display: flex; flex-wrap: wrap; gap: .4rem; }
.walk-foot .stamp { white-space: normal; text-align: left; }
.bell-form { margin-top: .5rem; }
.bell-count { font: 600 .9rem/1.4 var(--sans); color: var(--brass-ink); }

/* The brief, as Land writes it */
.brief-kicker { margin: 0 0 .35rem; font: 700 .76rem/1.3 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--brass-ink); }
/* The owner's question is the headline. */
.brief .brief-question, .brief .question {
  margin: .15rem 0 .5rem;
  font: italic 400 clamp(1.55rem, 1.2rem + 1.4vw, 2.15rem)/1.22 var(--serif);
  color: var(--ink); letter-spacing: -.005em;
  text-wrap: balance;
}
.brief-topic { margin: 0; font: .88rem/1.45 var(--sans); color: var(--muted); max-width: none; }
.brief .notice { font-size: .98rem; }
/* Old maps and links that belong to the finding above: a drawer slip tucked under the card. */
.finding:has(+ .finding-extras) { margin-bottom: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.finding-extras {
  margin: 0 0 1.15rem; padding: .7rem 1.15rem .55rem;
  background: var(--paper); border: 1px solid var(--line); border-top: 1px dashed var(--line-strong);
  border-radius: 0 0 5px 5px;
}
.finding-extras > :last-child { margin-bottom: .2rem; }
.finding-extras .step-links { margin: .2rem 0 .3rem; }
.map-strip { list-style: none; padding: 0 !important; margin: 0 0 .5rem !important; display: grid !important; grid-template-columns: repeat(auto-fill, minmax(min(100%, 10.5rem), 1fr)); gap: .5rem !important; }
.map-strip li { margin: 0 !important; width: auto !important; max-width: none; font: .78rem/1.3 var(--sans) !important; }
.map-strip a { display: flex !important; gap: .55rem; align-items: center; height: 100%; padding: .35rem .5rem .35rem .35rem; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); color: var(--green-dark); text-decoration: none; }
.map-strip a:hover { border-color: var(--green); background: #fffefa; }
.map-strip img { width: 2.4rem !important; height: 3rem !important; margin: 0 !important; border: 1px solid var(--line-strong) !important; flex: none; }
.brief-page { max-width: var(--sheet); }
.brief-page .brief { max-width: none; }

/* The place page and the folder (Accounts & folder) */
.place-page { margin: 0; }
.place-head { margin: 0 0 1.25rem; }
.place-head h1 { margin-bottom: .3rem; }
.place-question { font: italic 400 clamp(1.2rem, 1.1rem + .6vw, 1.45rem)/1.4 var(--serif); margin: .2rem 0 .5rem; max-width: 46rem; }
.place-meta, .place-where, .folder-who { font: .9rem/1.5 var(--sans); color: var(--muted); max-width: none; }
.place-meta .stamp { margin-left: .25rem; }
.place-section { margin: 2.25rem 0 0; }
.place-section > h2:first-child { margin-top: 0; }
.place-edit { margin: .5rem 0 0; font-family: var(--sans); }
.place-edit > summary { cursor: pointer; color: var(--green); font-size: .92rem; }
.card-public-link { font: .9rem/1.45 var(--sans); color: var(--muted); }
.sharing-box { margin-top: 1.5rem; }
.topic-chip { white-space: normal; }
.items { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); margin: 1rem 0 1.5rem; }
.item h3 { font-size: 1.12rem; }
.item-meta { font: .86rem/1.45 var(--sans); color: var(--muted); margin: 0 0 .5rem; }
.item-photo { margin: .5rem 0; }
.item-photo img { display: block; width: 100%; height: auto; max-height: 16rem; object-fit: cover; border-radius: 3px; border: 1px solid var(--line); }
.item-file { font: .9rem/1.45 var(--sans); }
.item-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; margin-top: .75rem; padding-top: .65rem; border-top: 1px dotted var(--line-strong); font: .9rem var(--sans); }
.item-delete > summary { cursor: pointer; color: var(--survey-red); font-size: .88rem; }
.item-delete[open] { flex-basis: 100%; }
.place-card .place-where { margin: 0 0 .4rem; }
.gift-statement { padding: .9rem 1.1rem; background: var(--card); border: 1px solid var(--line); border-left: 4px solid var(--brass); border-radius: 0 var(--radius) var(--radius) 0; }

/* A published history (/history/:slug) and the collection */
.history-where { margin: 1rem 0 1.5rem; }
.history-map { border: 1px solid var(--line-strong); border-radius: var(--radius-card); margin: .75rem 0; }
.history-story { margin: 1.5rem 0; }
.history-items { margin: 1.5rem 0; }
.history-item { padding: 1rem 0; border-top: 1px solid var(--line); }
.history-photo img { display: block; max-width: 100%; height: auto; border: 1px solid var(--line); border-radius: 3px; }

/* Plans and practice checkout (Feedback & admin) */
.plan h3 { margin-bottom: .2rem; }
.vote-form { margin-top: .85rem; padding-top: .75rem; border-top: 1px dashed var(--line-strong); max-width: none; }
.vote-form .choice { display: inline-flex; margin: 0 1rem .5rem 0; }
.vote-form fieldset { border: 0; padding: 0; margin: 0 0 .5rem; background: none; }
.vote-form legend { padding: 0; margin-bottom: .4rem; }

/* The inbox and Bob's office (staff pages) */
.inbox-filter { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0 .75rem; max-width: none; }
.inbox-filter > label { flex: 0 1 14rem; }
.inbox-filter > :is(button, .button) { margin-bottom: 1.05rem; }
.inbox-counts { display: flex; flex-wrap: wrap; gap: .4rem .9rem; font: .9rem/1.4 var(--sans); padding: 0; list-style: none; }
.inbox-row { margin: 0 0 .9rem; }
.inbox-new { border-left: 4px solid var(--brass); }
.inbox-done { opacity: .78; }
.inbox-head { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .6rem; margin: 0 0 .35rem; font: 600 .92rem/1.4 var(--sans); max-width: none; }
.inbox-meta, .inbox-from, .inbox-where { font: .86rem/1.45 var(--sans); color: var(--muted); margin: 0 0 .3rem; max-width: none; }
.inbox-message { margin: .5rem 0; white-space: pre-wrap; }
.inbox-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-top: .6rem; }
.pager { display: flex; justify-content: space-between; gap: 1rem; font-family: var(--sans); }
.gift { margin: .6rem 0; padding: .6rem .8rem; background: var(--brass-tint); border-radius: var(--radius); }
.office-welcome { font-size: 1.15rem; }
.office-guide { margin: 1rem 0; padding: .75rem 1rem; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-card); }
.office-guide > summary { cursor: pointer; font: 600 1rem var(--sans); color: var(--green-dark); }
.office-item { margin: 0 0 1rem; }
.office-field { margin: 0 0 1rem; }
.office-hint { font: .86rem/1.45 var(--sans); color: var(--muted); margin: .2rem 0 .6rem; }
.office-current { font: .9rem/1.45 var(--sans); }
.office-list { padding-left: 1.2rem; }
.office-list-detail { font: .86rem/1.45 var(--sans); color: var(--muted); }
.office-note { font-style: italic; }

/* The ask box as Desk writes it: suggestion questions as pills */
.desk-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin: .75rem 0 0; }
.desk-status { font: .9rem/1.4 var(--sans); color: var(--muted); }
.desk-chips { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; margin: 1.1rem 0 0; }
.desk-chips-label { flex-basis: 100%; font: 600 .86rem/1.3 var(--sans); color: var(--muted); }
.desk-chips .desk-chip {
  min-height: 2.25rem; padding: .38rem .85rem;
  font: 500 .9rem/1.25 var(--sans); text-align: left;
  color: var(--ink); background: var(--paper);
  border: 1.5px solid var(--line-strong); border-radius: 999px; box-shadow: none;
}
.desk-chips .desk-chip:hover { border-color: var(--green); background: var(--green-tint); color: var(--green-dark); }

/* The desk's answer text (Desk) */
.desk-answer-text > :last-child { margin-bottom: 0; }
.desk-refusal { color: var(--survey-red); font-weight: 700; }
.desk-cite { font: 700 .7rem/1 var(--sans); margin-left: .1em; }
.desk-cite a { text-decoration: none; padding: 0 .15em; border-radius: 2px; background: var(--ai-tint); color: var(--ai-ink); }
.desk-cite a::before { content: "["; } .desk-cite a::after { content: "]"; }
.desk-list { padding-left: 1.3em; }
.desk-sources-title { margin: 1.1rem 0 .3rem; padding-top: .75rem; border-top: 1px solid var(--line); font: 700 .9rem/1.3 var(--sans); color: var(--ink); }
.desk-sources-title + .desk-sources, .desk-answer .desk-sources-title + .desk-sources { border-top: 0; margin-top: 0; padding-top: 0; }
.desk-sources { font: .88rem/1.5 var(--sans); color: var(--muted); padding-left: 1.4em; }
.desk-src-kind { font-weight: 600; color: var(--ink); }

/* ---------- 24b. Polish: one sheet, and the classes each area invented ---- */

/* Hidden robot traps (the "website" box): people never see them. */
.hp, .hp-field { position: absolute !important; left: -10000px !important; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* Lead paragraphs and small kicker lines, under whatever name each area used. */
.lead { font-size: clamp(1.12rem, 1.06rem + .3vw, 1.24rem); line-height: 1.58; }
.eyebrow, .page-kicker {
  margin: 0 0 .4rem; font: 700 .76rem/1.3 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--brass-ink);
}
.breadcrumb { font: .88rem/1.4 var(--sans); color: var(--muted); margin: 0 0 .75rem; }
.page-label { font: .9rem/1.5 var(--sans); color: var(--muted); }
.page-label .stamp { margin-right: .3rem; }
.dek { font-size: 1.15rem; color: var(--muted); margin-top: -.2rem; }
.dek em { font-style: italic; }

/* The place page: one column the width of a sheet, so the card, the brief, the folder and the
   desk all share the same left edge and measure. */
.place-page { max-width: var(--sheet); margin-left: auto; margin-right: auto; }
.place-page :is(.walk-card, .brief, .ask-box, .sharing-box, .danger) { max-width: none; margin-left: 0; margin-right: 0; }
.place-page :is(p, li) { max-width: none; }
.place-head h1 { margin-top: .1em; }
.place-section > h2:first-child { font-size: clamp(1.45rem, 1.25rem + .8vw, 1.75rem); margin: 0 0 .75rem; }
.place-section > .walk-card, .place-section > .brief { margin-top: .75rem; }
.place-page .anchor-nav { margin-top: 1.5rem; }
.place-page .level-switch { margin-bottom: .9rem; }
.place-page .card-public-link { margin-top: -1rem; }
.sharing-box h2, .sharing-box h3 { margin-top: 0; }

/* Ask the Reference Desk (Desk) */
.desk-page { max-width: var(--measure); }
.desk-ai-line {
  margin: .25rem 0 1.25rem; padding: .55rem .9rem;
  font-size: 1.02rem; color: var(--ink);
  background: var(--ai-tint); border-left: 4px solid var(--ai-ink); border-radius: 0 var(--radius) var(--radius) 0;
}
.desk-intro { color: var(--ink); }
.desk-more { font: .95rem/1.5 var(--sans); color: var(--muted); margin-top: 1.5rem; }
.desk-place { font: .95rem/1.5 var(--sans); color: var(--muted); }
.desk-form { max-width: none; margin: 0; }
.desk-answer-area:empty { display: none; }
.ask-box .desk-answer { margin: 1.5rem 0 0; box-shadow: none; }
.desk-answer-title { margin: 0 0 .25rem; font-size: clamp(1.3rem, 1.2rem + .5vw, 1.5rem); }
.desk-answer-title:focus { outline: none; }
.desk-question { margin: 0 0 .75rem; }
.desk-answer .finding-labels { border-bottom-color: var(--line); }
.desk-guide-line, .desk-cap-line, .desk-replaced-line { font-size: .95rem; }
.desk-made-by { margin: 1rem 0 0; font: .86rem/1.5 var(--sans); color: var(--muted); }
.desk-answer .not-title { margin-top: 1rem; }
.desk-flag { margin-top: .6rem; }
.ask-box-compact { padding-top: 1.05rem; }
.ask-box-title { margin: 0 0 .5rem; font-size: 1.25rem; }
.ask-box-compact .desk-ai-line { font-size: .96rem; }

/* Example histories (Content-places) */
.examples-index .lead { max-width: 46rem; }
.example-card .dek { font-size: 1.02rem; margin: 0 0 .5rem; }
.example-card .source-detail { font: .82rem/1.45 var(--sans); }
.example-card { display: flex; flex-direction: column; }
.example-card > :last-child { margin-top: auto; padding-top: .35rem; }
.nudge { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; margin: 2rem 0 0; font-style: italic; color: var(--muted); }
.nudge .button { font-style: normal; }
.example h1 { margin-bottom: .15em; }
.example .dek { margin: 0 0 .5rem; }
.place-label { font: .9rem/1.5 var(--sans); color: var(--muted); }
.owner-question {
  margin: 1.25rem 0 1.25rem; padding: .5rem 0 .55rem 1.15rem;
  border-left: 3px solid var(--brass);
  font: italic 400 clamp(1.2rem, 1.1rem + .5vw, 1.4rem)/1.4 var(--serif);
}
.owner-question p { margin: 0; }
.owner-question footer { margin-top: .5rem; font: normal .84rem/1.4 var(--sans); color: var(--muted); }
.example-intro { margin: 1.25rem 0 0; }
.example-intro .finding-labels { border-bottom-color: var(--line); }
.example-pictures { display: grid; gap: 1.25rem; margin: 1.75rem 0 0; }
.shelf-figure, .plss-drawing, .township-grid { margin: 1.5rem 0; }
.shelf-figure img, .plss-drawing svg, .township-grid svg {
  display: block; max-width: 100%; height: auto;
  padding: .35rem; background: #fff; border: 1px solid var(--line-strong); border-radius: 3px;
  box-shadow: 0 6px 14px -12px rgba(31, 42, 36, .6);
}
.shelf-figure a { display: block; }
.shelf-figure figcaption, .plss-drawing figcaption, .township-grid figcaption { font-size: .84rem; margin-top: .6rem; }
.township-grid svg { max-width: 22rem; }
.example-credits { margin-top: 2.25rem; padding-top: 1rem; border-top: 1px dashed var(--line-strong); font: .88rem/1.5 var(--sans); color: var(--muted); }
.example-credits .stamp { margin-right: .3rem; }
.example .nudge { margin-top: 1.5rem; }

/* Home: example cards without a picture get our own township drawing, cut to the same band. */
.example-card-art {
  display: block; height: 10.5rem; overflow: hidden;
  margin: -1.1rem -1.2rem .9rem; border-bottom: 1px solid var(--line);
  border-radius: var(--radius-card) var(--radius-card) 0 0;
  background: #fffdf6;
}
.example-card-art svg { display: block; width: 100%; height: auto; margin-top: -18%; opacity: .9; }
.cards .example-card > :is(img, .example-card-art):first-child { margin-top: -1.1rem; }

/* How we research (Content-methods). Stronger than the page's own small style block, which can go. */
main .hwr .ai-text, main .booklet .ai-text { color: #4f5952; font-style: italic; }
main .hwr .bob-quote, main .booklet .bob-quote, .bob-quote {
  margin: .9rem 0; padding: .65rem 1rem .7rem 1.1rem;
  background: var(--card); border: 1px solid var(--line); border-left: 4px solid var(--green);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-size: 1.06rem; max-width: none;
}
main .hwr .bob-quote p, main .booklet .bob-quote p { margin: 0 0 .35rem; }
main .hwr .bob-quote footer, main .booklet .bob-quote footer { font: .84rem/1.45 var(--sans); color: var(--muted); margin: .4rem 0 0; }
main .hwr .method { margin-top: 3rem; padding-top: 1.5rem; border-top: 0; position: relative; }
main .hwr .method::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 9px; opacity: .6;
  background:
    linear-gradient(var(--survey-red), var(--survey-red)) 0 50% / 100% 1.5px no-repeat,
    repeating-linear-gradient(to right, var(--survey-red) 0 2px, transparent 2px 26px) 0 0 / 100% 100% no-repeat;
}
.method > h2:first-of-type { margin-top: .4rem; }
.method-source { font: .9rem/1.5 var(--sans); color: var(--muted); }
.method-labels { display: flex; flex-wrap: wrap; gap: .4rem; }
main .hwr .points { padding-left: 1.4rem; }
main .hwr .points > li { margin-bottom: 1rem; }
main .hwr .gloss { margin: .2rem 0 1.1rem; }
.method-cards { grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); margin: 1.5rem 0; }
.method-cards .card h3 { font-size: 1.12rem; }
.good-for { border-top: 4px solid var(--green); }
.cant-tell { border-top: 4px solid #d9a58f; background: #fffaf6; }
.try-it { list-style: none; padding: 0 !important; font: .95rem/1.5 var(--sans); }
.try-it li { padding: .45rem 0 .45rem 1.3rem; border-bottom: 1px dotted var(--line-strong); position: relative; }
.try-it li::before { content: "\2192"; position: absolute; left: 0; color: var(--brass-ink); }
.try-it li + li { margin-top: 0; }
main .hwr .evidence-types > li { padding-bottom: .9rem; margin-bottom: .9rem; }
main .hwr .where, .where { font: .9rem/1.55 var(--sans); color: var(--muted); }
.documents { padding-left: 1.4rem; }
.documents > li { margin-bottom: 1rem; }
.documents cite { font-style: italic; }
.t7 { margin: 1.25rem 0; padding: .65rem 1rem; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-card); }
.t7 > summary { cursor: pointer; font: 600 1rem/1.4 var(--sans); color: var(--green-dark); }
.t7[open] > summary { margin-bottom: .6rem; }
/* The how-we-research tab row is written with "·" between the links: show the tabs, not the dots. */
.anchor-nav { font-size: 0; }
.anchor-nav > *, .anchor-nav :is(a, li, span) { font-size: .95rem; }

/* Booklet (Content-methods) */
.working-titles { font: .9rem/1.5 var(--sans); color: var(--muted); }
.booklet-toc { list-style: none; counter-reset: toc; padding: 0 !important; margin: 1rem 0 1.75rem; }
.booklet-toc > li {
  counter-increment: toc; display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem .6rem;
  margin: 0; padding: .65rem 0; border-bottom: 1px dotted var(--line-strong);
}
.booklet-toc > li::before { content: counter(toc); min-width: 1.5rem; font: 700 .95rem var(--serif); color: var(--brass-ink); font-variant-numeric: lining-nums; }
.booklet-toc > li > a { flex: 1 1 auto; font-size: 1.08rem; }
.booklet-toc > li + li { margin-top: 0; }
.booklet-toc .stamp { margin-left: auto; }
.print-offer { margin: 1.5rem 0; max-width: 26rem; border-top: 4px solid var(--brass); }
.print-offer .price { margin-bottom: .5rem; }
.print-line { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .75rem; font-family: var(--sans); }
.print-line .price { font-size: 1.3rem; margin: 0; }
.placeholder-label { margin: 0 0 1.25rem; }
.placeholder-label strong {
  display: inline-block; font: 700 .82rem/1.3 var(--sans); letter-spacing: .03em; color: var(--brass-ink);
  border: 1.5px dashed var(--brass); border-radius: 3px; padding: .35em .65em; background: var(--card);
}
.will-cover li { margin-bottom: .2rem; }
.booklet-evidence { margin-top: 2rem; }
.booklet-nav { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: space-between; margin-top: 2.5rem; padding-top: 1rem; border-top: 1px solid var(--line); font-family: var(--sans); }
.placeholder-page.booklet { max-width: var(--sheet); margin-left: auto; margin-right: auto; }

/* School lands (Content-places) */
.law-quote { margin: 1rem 0 1.75rem; }
.law-quote .record-quote { margin: 0; }
.law-quote figcaption.source { margin-top: .55rem; padding-left: 1.25rem; }
.records-list { padding-left: 1.2rem; }
.records-list > li { margin-bottom: 1rem; }
.state-table { font-size: .9rem; }
.state-table td, .state-table th { min-width: 7.5rem; }
.state-table td:first-child, .state-table th:first-child { min-width: 6rem; }
.table-wrap { position: relative; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); }
.table-wrap > table { background: transparent; }

/* Where records live (Content-places) */
.records-directory .anchor-nav { margin-top: 1.5rem; }
.township-form { margin: 1.5rem 0 2rem; padding: 1.1rem 1.25rem .5rem; background: var(--card); border: 1px solid var(--line); border-top: 4px solid var(--survey-red); border-radius: var(--radius-card); }
.township-form > :is(h2, h3):first-child { margin-top: 0; }
.form-inline { max-width: none; display: grid; gap: 0 .85rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr)); align-items: end; }
.form-inline > :is(button, .button) { margin-bottom: 1.05rem; justify-self: start; }
.recent-changes { margin: 1.5rem 0; padding: .85rem 1.1rem; background: var(--paper-deep); border-radius: var(--radius-card); font-size: .98rem; }
.recent-changes > :is(h2, h3):first-child { margin-top: 0; font-size: 1.15rem; }
.recent-changes > :last-child { margin-bottom: 0; }
.evidence-group { margin-top: 2.75rem; }
.evidence-group > h2:first-child { padding-bottom: .4rem; border-bottom: 2px solid var(--ink); }
.evidence-type { margin-top: 1.75rem; }
.evidence-type > h3:first-child { font-size: 1.22rem; margin-bottom: .6rem; }
.link-entry { margin: 0 0 .75rem; padding: .85rem 1rem .9rem; box-shadow: none; }
.link-entry h4 { margin: 0 0 .25rem; font-size: 1.05rem; line-height: 1.3; }
.link-entry p { margin: 0 0 .35rem; font-size: 1rem; }
.link-entry > :last-child { margin-bottom: 0; }
.link-entry .source-detail { font: .82rem/1.45 var(--sans); }
.see-also { font: .88rem/1.55 var(--sans); color: var(--muted); margin: .5rem 0 0; }

/* Find, the /walk list, plans, folder, collection, report card: small gaps */
.find .lede { max-width: 44rem; }
.find-form .chips { margin-top: .25rem; }
.walk-index .cards { margin-top: 1rem; }
.plans .cards, .collection .cards { margin-top: 1rem; }
.folder .cards { margin-top: 1.25rem; }
.auth .form, .account .form { max-width: 28rem; }
.report-card h2 { margin-top: 2rem; }

/* Error pages: one corner post, standing alone in the blackberries. */
.error-page { padding: clamp(1rem, 5vw, 3rem) 0 1rem; }
.error-mark { margin: 0 0 .5rem; }
.error-mark .icon { width: 3.6rem; height: 3.6rem; color: var(--brass-ink); stroke-width: 1.2; }

/* Round two: pieces the Integrator added tonight. */
/* Find: place-name matches, a short list of buttons under the address box. */
.find-matches { display: flex; flex-direction: column; align-items: stretch; gap: .35rem; margin: .45rem 0 .35rem; }
.find-matches[hidden] { display: none; }
.find-matches .find-match { justify-content: flex-start; width: 100%; text-align: left; white-space: normal; font-weight: 500; background: var(--card); }
.find-matches .find-match:hover { background: var(--green-tint); }
.find-coords-result { margin-top: .75rem; }
/* A button that is working: it keeps its colour, and a survey chain runs along its foot. */
:is(.button, button)[aria-busy="true"], :is(.button, button)[aria-busy="true"][disabled] {
  opacity: 1; cursor: progress;
  background-image: repeating-linear-gradient(to right, var(--brass-light) 0 10px, transparent 10px 18px);
  background-size: 36px 3px; background-repeat: repeat-x; background-position: 0 100%;
  animation: chain-pull .9s linear infinite;
}
@keyframes chain-pull { to { background-position: 36px 100%; } }
/* Walk card: where the surveyor's own plat is kept, under our drawing. */
.walk-panel .walk-plat-home { margin: .6rem 0 0; padding-top: .5rem; border-top: 1px dotted var(--line-strong); font: .82rem/1.45 var(--sans); color: var(--muted); max-width: none; }
/* Brief: a group of findings from one file (a claim's own survey file). */
.brief .brief-group { margin: 1.6rem 0 .65rem; padding: .7rem 0 0; border-top: 1px dashed var(--line-strong); border-bottom: 0; font: 700 .98rem/1.4 var(--sans); color: var(--ink); text-wrap: wrap; }
.brief .brief-group a { font-weight: 600; }

/* How we research: a short note on where a quotation sits, read with the quote above it. */
main .hwr .quote-context { margin: -.35rem 0 1rem; font-size: .96rem; }

/* Back to top, on the longest pages. */
.back-to-top { max-width: var(--wide); margin: 2.5rem 0 0; text-align: right; font: .92rem/1.4 var(--sans); }
.back-to-top a { display: inline-flex; align-items: center; gap: .35rem; padding: .35rem .2rem; color: var(--green-dark); }
.back-to-top a::before { content: "\2191"; text-decoration: none; display: inline-block; }

/* ---------- 25. Print ------------------------------------------------------ */
/* Paper: white, no nav, no forms or buttons. The masthead stays, so the motto prints on every page.
   The Walk card fits one Letter page for ordinary ground and two for prepared ground. */
@media print {
  @page { size: letter; margin: 11mm 11mm 12mm; }
  html, body { background: #fff !important; color: #000 !important; }
  /* Everything sized in rem shrinks with the page: 1rem is 9pt on paper. */
  html { font-size: 9pt; }
  body { display: block; min-height: 0; font-size: 10pt; line-height: 1.4; }
  .site-nav, .nav-menu, .nav-phone, .nav-feedback-bar, .user-bar, .site-footer, .skip, .back-to-top,
  form, button, .button, input, select, textarea,
  .report-error, .level-switch, .anchor-nav, .tabs, .ask-box, .chips, .suggestions, .crumbs, .breadcrumb,
  [data-print], [data-print-page], [data-copy], [data-copy-link], .no-print, .walk-actions, .hero-actions, .vote, .nudge,
  .walk-ask, .card-public-link, .leaflet-control-container { display: none !important; }
  .masthead { padding: 0 0 3pt; margin: 0 0 5pt; border-bottom: .75pt solid #000; grid-template-columns: auto 1fr auto; grid-template-areas: "brand motto stamp"; max-width: none; gap: 0 10pt; }
  .brand-mark { width: 22pt; height: 22pt; }
  .brand-name { font-size: 13pt; }
  .brand-desk { font-size: 9pt; }
  .motto { justify-self: end; color: #000; font-size: 9.5pt; }
  .proto-label { transform: none; outline: 0; font-size: 6.5pt; padding: 2pt 4pt; width: auto; white-space: nowrap; }
  main { max-width: none; padding: 0; }
  .narrow, .place-page, .brief-page { max-width: none; }
  h1 { font-size: 19pt; } h2 { font-size: 14pt; } h3 { font-size: 12pt; } h4 { font-size: 10.5pt; }
  h1, h2, h3, h4 { break-after: avoid; page-break-after: avoid; }
  a { color: #000; }
  :where(main) a:not([class]):visited { color: #000; }
  .card, .finding, .brief, .walk-card, .gap, .next-step, .notice, .desk-answer, .walk-panel, .placeholder-page, .price-card,
  .walk-way, .walk-school, .finding-extras, .gaps, .walk-permalink, .bring-back, .map-strip a {
    background: #fff !important; box-shadow: none !important;
  }
  .brief, .walk-card { border: 0; border-radius: 0; padding: 0; margin: 0; max-width: none; }
  .finding, .next-step, .gap, .walk-panel, .walk-way, .walk-school, .walk-figure, .law-quote { break-inside: avoid; page-break-inside: avoid; }
  .finding { padding: 4pt 7pt 5pt; margin-bottom: 5pt; border: .75pt solid #999; border-radius: 3pt; }
  .finding-labels { margin-bottom: 3pt; padding-bottom: 2pt; border-bottom-width: .75pt; }
  .finding-text { font-size: 10pt; line-height: 1.38; margin-bottom: 3pt; }
  .record-quote { margin: 3pt 0; padding: 2pt 7pt 0 8pt; border: .5pt solid #bbb; border-left: 2.5pt double #a23b2a; font-size: 10pt; line-height: 1.35; background: none !important; }
  .record-quote p { line-height: 1.35; padding-bottom: 2pt; }
  .record-quote footer { margin: 0 -7pt 0 -8pt; padding: 2pt 7pt 2pt 8pt; background: none; border-top: .5pt solid #bbb; font-size: 7.5pt; line-height: 1.3; }
  .record-quote:is(.quote-law, .quote-treaty-record, .quote-survey-grid, .quote-names, .quote-published-research, .quote-oral, .quote-owner-added, .quote-photo),
  :is(.law-quote, .walk-school, .records-list, .school-note) .record-quote { border: 0; border-left: 1.5pt solid #a8842c; padding: 0 0 0 7pt; font-size: 9pt; line-height: 1.35; }
  .record-quote:is(.quote-law, .quote-treaty-record, .quote-survey-grid, .quote-names, .quote-published-research, .quote-oral, .quote-owner-added, .quote-photo) footer,
  :is(.law-quote, .walk-school, .records-list, .school-note) .record-quote footer { margin: 2pt 0 0; padding: 0; border: 0; }
  .source { font-size: 7.5pt; margin-top: 2pt; line-height: 1.3; }
  .stamp { background: #fff !important; font-size: 6.5pt; padding: 1pt 3pt; }
  .not-title { color: #000; margin-top: 5pt; padding-top: 3pt; font-size: 8.5pt; }
  /* Show where sources live. */
  .source a[href^="http"]::after, .step-links a[href^="http"]::after, .desk-answer a[href^="http"]::after,
  .print-urls a[href^="http"]::after, .walk-sources a[href^="http"]::after, .walk-way a[href^="http"]::after {
    content: " <" attr(href) ">"; font: 7pt/1.25 var(--sans); color: #333; word-break: break-all;
  }
  /* Closed fold-outs are controls, not content. */
  details:not([open]) { display: none !important; }
  /* Pictures stay a sensible size on paper. */
  .walk-figure img, .history-photo img, .item-photo img, .example-card img, .shelf-figure img { max-height: 3.1in; width: auto !important; max-width: 100%; }

  /* ---- the Surveyor's Walk card ---- */
  .walk-head { margin-bottom: 6pt; }
  .walk-head :is(h1, h2) { font-size: 21pt; }
  p.walk-title { font-size: 9.5pt; margin-top: 2pt; }
  .walk-head { padding-bottom: 3pt; border-bottom: .75pt solid #a23b2a; }
  .walk-card > header::after, .walk-head::after { display: none; }
  .walk-panels, .walk-card .panels, .two-panel { grid-template-columns: 1fr 1fr; gap: 8pt; margin: 6pt 0 4pt; }
  .walk-panel { padding: 4pt 5pt 5pt; border: .75pt solid #999; border-radius: 3pt; }
  .walk-card .walk-panel > :is(h2, h3, h4) { font-size: 7pt; margin: 0 0 3pt; color: #000; letter-spacing: .06em; }
  .walk-panel .walk-plat img, .walk-panel > .township-figure svg { width: 2.35in !important; max-width: 100%; height: 2.35in !important; margin: 0 auto; }
  .walk-panel .walk-map { width: 2.35in !important; max-width: 100%; height: 2.35in !important; min-height: 0; aspect-ratio: auto; margin: 0 auto; }
  .walk-panel figcaption, .walk-panel .walk-map-note, .walk-panel .notice, .walk-panel .credit { font-size: 7pt; line-height: 1.28; margin-top: 3pt; }
  .walk-figure .credit, .walk-school .source-detail { font-size: 7pt; }
  .walk-panel .walk-plat-home { font-size: 7pt; line-height: 1.28; margin-top: 3pt; padding-top: 2pt; }
  .brief .brief-group { font-size: 9pt; margin: 6pt 0 3pt; padding-top: 3pt; }
  .walk-school p:last-child:has(> a[href="/school-lands"]:only-child) { display: none; }
  .walk-card h2 { font-size: 11.5pt; margin: 7pt 0 2pt; padding-bottom: 0; }
  .walk-card > section > :is(h2, h3):first-child { margin-top: 0; }
  .walk-words, .walk-school, .walk-claims, .walk-sources { margin-top: 8pt; }
  .walk-words > p:first-of-type { font-size: 9.5pt; margin-bottom: 4pt; }
  .walk-figure { margin: 5pt 0 0; }
  .walk-figure img { max-height: 1.8in; }
  /* The Sources block lists every address once; the cards above don't repeat them. */
  .walk-card .finding .source a[href^="http"]::after { content: none; }
  .walk-figure figcaption { font-size: 7pt; line-height: 1.28; }
  .walk-ways { display: block; margin-top: 4pt; }
  .walk-way { padding: 3pt 7pt 4pt; border: .75pt solid #999; margin-bottom: 4pt; }
  .walk-way h4 { font-size: 10pt; margin-bottom: 2pt; }
  .walk-way p, .walk-way li { font-size: 9pt; line-height: 1.35; margin-bottom: 2pt; }
  .walk-way:has(form) { display: none; }
  .walk-school { padding: 4pt 8pt 5pt; border: .75pt solid #b9a76c; border-left: 2.5pt solid #a8842c; }
  .walk-school > :is(h2, h3):first-child { font-size: 10.5pt; margin-bottom: 2pt; }
  .walk-school p { font-size: 9pt; line-height: 1.35; margin-bottom: 3pt; }
  .walk-school .record-quote { margin: 3pt 0; font-size: 8pt; line-height: 1.3; }
  .walk-claims ul { font-size: 9pt; columns: 2; display: block; margin: 2pt 0; }
  .walk-claims li { padding: 1pt 0 1pt 10pt; border: 0; }
  .walk-claims li::before { top: 4.5pt; width: 4pt; height: 4pt; }
  .walk-claims .source-detail { font-size: 7.5pt; margin: 0; }
  .walk-sources ul { columns: 2; column-gap: 14pt; font-size: 7pt; line-height: 1.25; margin: 2pt 0 4pt; color: #000; }
  .walk-sources li { margin-bottom: 2pt; padding-left: 12pt; }
  .walk-sources li::before { width: 9pt; }
  .walk-permalink { margin: 3pt 0 0; padding: 0; border: 0; font-size: 8pt; color: #000; }
  .walk-permalink a { font-size: 8.5pt; color: #000; text-decoration: none; }
  .walk-foot { margin-top: 6pt; padding-top: 3pt; }
  .walk-foot > p:first-child { gap: 3pt; margin-bottom: 2pt; }
  .walk-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 3pt 10pt; }
  .walk-foot > p { margin: 0; }
  .walk-foot .not-title { margin: 0; padding: 0; border: 0; }
  /* Ordinary ground (nothing copied out yet): keep it to one sheet. */
  .walk-card:has(.walk-ways) .walk-panel .walk-plat img,
  .walk-card:has(.walk-ways) .walk-panel > .township-figure svg,
  .walk-card:has(.walk-ways) .walk-panel .walk-map { width: 1.35in !important; height: 1.35in !important; }
  .walk-card:has(.walk-ways) .walk-school .record-quote { font-size: 7.5pt; line-height: 1.28; }
  .walk-card:has(.walk-ways) .walk-way p, .walk-card:has(.walk-ways) .walk-way li { font-size: 8.5pt; line-height: 1.3; }
  .walk-card:has(.walk-ways) .walk-words > p:first-of-type { font-size: 9pt; line-height: 1.3; margin-bottom: 3pt; }
  .walk-card:has(.walk-ways) h2 { margin-top: 4pt; margin-bottom: 1pt; }
  .walk-card:has(.walk-ways) .walk-sources ul { margin-bottom: 2pt; }
  .walk-card:has(.walk-ways) .walk-foot { margin-top: 2pt; padding-top: 2pt; }
  .walk-card:has(.walk-ways) .walk-school { padding: 3pt 7pt 4pt; }
  .walk-card:has(.walk-ways) .walk-foot { margin-top: 4pt; }
  .walk-card:has(.walk-ways) .walk-head :is(h1, h2) { font-size: 18pt; }
  .walk-card:has(.walk-ways) :is(.walk-words, .walk-school, .walk-claims, .walk-sources) { margin-top: 5pt; }
  .walk-card:has(.walk-ways) .walk-panels { margin: 4pt 0 2pt; }
  .walk-card:has(.walk-ways) .walk-way > p:last-child { display: none; }
  .walk-card:has(.walk-ways) .walk-school .record-quote { font-size: 8pt; line-height: 1.3; }
  .walk-card:has(.walk-ways) .walk-school p { font-size: 8.5pt; line-height: 1.3; }
  .walk-card:has(.walk-ways) .walk-sources ul { columns: 3; column-gap: 10pt; font-size: 6.5pt; }

  /* ---- the one-page brief ---- */
  .brief-head { margin-bottom: 6pt; padding-bottom: 5pt; }
  .brief .brief-question, .brief .question { font-size: 15pt; line-height: 1.25; }
  .brief-kicker { font-size: 7.5pt; }
  .brief-topic { font-size: 8pt; }
  .brief :is(.brief-shows, .brief-gaps, .brief-next, .brief-part) { margin-top: 9pt; }
  .brief :is(.brief-shows, .brief-gaps, .brief-next, .brief-part) > :is(h2, h3):first-child { font-size: 12pt; margin-bottom: 5pt; padding-bottom: 2pt; border-bottom-width: 1pt; gap: 5pt; }
  .brief :is(.brief-shows, .brief-gaps, .brief-next, .brief-part) > :is(h2, h3):first-child::before { width: 15pt; height: 15pt; font-size: 8.5pt; background: #fff; border: 1pt solid #7a5f1c; box-shadow: none; }
  .finding:has(+ .finding-extras) { margin-bottom: 0; }
  .finding-extras { margin: 0 0 5pt; padding: 3pt 7pt; border: .75pt solid #999; border-top: .5pt dashed #999; }
  .map-strip { gap: 3pt !important; grid-template-columns: repeat(4, 1fr); }
  .map-strip a { padding: 1pt 2pt; border: .5pt solid #bbb; }
  .map-strip img { width: 18pt !important; height: 22pt !important; }
  .map-strip li { font-size: 6.5pt !important; }
  .gaps { padding: 0 7pt; border: .75pt dashed #999; }
  .gap { padding: 3pt 0 3pt 16pt; font-size: 9.5pt; line-height: 1.35; }
  .gap::before { top: 9pt; width: 10pt; border-top-width: 1.25pt; }
  .next-steps { gap: 4pt; }
  .next-step { padding: 4pt 7pt 4pt 24pt; border: .75pt solid #999; }
  .next-step::before { left: 6pt; top: 5pt; width: 12pt; height: 12pt; font-size: 7.5pt; border-width: 1pt; box-shadow: none; background: #fff; }
  .next-step h4 { font-size: 10pt; margin-bottom: 1pt; }
  .next-step p { font-size: 9pt; line-height: 1.35; margin-bottom: 2pt; }
  .bring-back { padding: 0; font-size: 9pt; }
  .step-links { font-size: 7.5pt; line-height: 1.3; }
  .walk-foot, .brief-foot { margin-top: 6pt; padding-top: 3pt; font-size: 8pt; }
  /* A part's heading and its note stay with the first item under them. */
  .brief-ai-note, .brief .notice:first-child { break-after: avoid; page-break-after: avoid; }
  .brief-next > .next-steps > .next-step:first-child, .brief-gaps > .gaps { break-before: avoid; page-break-before: avoid; }
}

/* ---------- 26. Motion preferences --------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* ---- The brief keeps to about a page: the findings that answer the question lead; the rest is one tap away. ---- */
.brief-more { margin: 1rem 0 1.25rem; border: 1px dashed var(--line); border-radius: 6px; background: rgba(255, 253, 246, .6); }
.brief-more > summary { cursor: pointer; padding: .7rem 1rem; font: 600 1rem/1.4 var(--sans, system-ui, sans-serif); color: var(--green-dark); }
.brief-more > summary:hover { text-decoration: underline; }
.brief-more[open] > summary { border-bottom: 1px dashed var(--line); margin-bottom: 1rem; }
.brief-more > :not(summary) { margin-left: 1rem; margin-right: 1rem; }
@media print {
  details.brief-more:not([open]) { display: block !important; border: 0; background: none; }
  details.brief-more:not([open]) > summary { list-style: none; padding: .2rem 0; font-style: italic; font-weight: 400; }
  details.brief-more:not([open]) > summary::after { content: " (open them on screen)"; }
}

/* ---------- Booklet draft pages (words from content-src/booklet_draft.md) ---------- */
/* The same quiet label line as How we research: it says who wrote the page, not "beware". */
.draft-label { margin: .3rem 0 1.6rem; max-width: 40rem; }
.draft-label .stamp-checked { margin-left: .2rem; }
.booklet-page > h2 { margin-top: 2.4rem; }
.booklet-section { margin-top: 3rem; padding-top: 1.25rem; border-top: 1px solid var(--line); }
.booklet-section > h3 { margin-top: 2rem; }
/* A citation: quiet until you want it. It opens the document at the cited page. */
.cite-ref { font: .82em/1.3 var(--sans); color: var(--muted); text-decoration: none; }
.cite-ref:hover, .cite-ref:focus-visible { color: var(--green); text-decoration: underline; }
.check-note {
  font: .88em/1.45 var(--sans); background: #fdf5dc; border: 1px dashed var(--brass); border-radius: 3px;
  padding: .08em .4em; -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
.photo-slot {
  margin: 1.6rem 0; padding: .95rem 1.1rem; max-width: 34rem;
  background: var(--card); border: 2px dashed var(--line-strong); border-radius: 8px;
  font: .93rem/1.5 var(--sans); color: var(--muted);
}
.photo-slot p { margin: 0 0 .3rem; }
.photo-slot .photo-slot-head { font-weight: 700; color: var(--brass-ink); }
.photo-slot figcaption { font-size: .86rem; }
.open-slot {
  margin: 1.4rem 0; padding: .7rem .9rem; background: var(--card);
  border: 2px dashed var(--line-strong); border-radius: 8px; font: .95rem/1.5 var(--sans);
}
.open-slot-tag {
  display: inline-block; margin-right: .4rem; padding: .25em .5em; background: #fff;
  font: 700 .76rem/1.2 var(--sans); letter-spacing: .03em; color: var(--brass-ink);
  border: 1.5px dashed var(--brass); border-radius: 3px;
}
.booklet-list { padding-left: 1.6rem; }
.booklet-list > li { margin-bottom: .55rem; }
.booklet-more { display: flex; flex-wrap: wrap; gap: .6rem; margin: 0 0 1rem; }
.booklet-after { margin-top: 2.75rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.booklet-after > h2 { margin-top: .5rem; font-size: 1.15rem; }
.booklet .plain-link { overflow-wrap: anywhere; }
.cover-draft { padding: 1rem 1.2rem; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-card); }
.booklet-notes .booklet-list strong { font-weight: 700; }
@media print {
  .booklet .cite-ref { color: #333; }
  .booklet-after, .booklet-more, .booklet-nav { display: none; }
  .photo-slot, .open-slot, .bob-quote { break-inside: avoid; }
  .booklet-section { border-top: 0; }
}

/* ---------- Live fixes, October 2026: steady layout on Find your land, past questions on a place ---------- */
/* Find your land: nothing above the map or above the question box changes height while someone works. */
.find-search-status { min-height: 2.8em; }
.find-mode-tools { display: inline-grid; }
.find-mode-tools > * { grid-area: 1 / 1; display: inline-flex; flex-wrap: wrap; gap: .4rem; align-content: flex-start; }
.find-mode-tools > [data-off] { visibility: hidden; }
.find-hint { min-height: 2.9em; }
@media (max-width: 40rem) { .find-hint { min-height: 4.35em; } }
/* Room for the longest usual survey-grid line: 3 lines beside the form, 4 lines on a phone (where the form is below). */
.find-result.find-result-reserved { display: block; min-height: 6.4rem; }
@media (max-width: 40rem) { .find-result.find-result-reserved { min-height: 8rem; } }
#find-result.find-result-reserved:empty {
  padding: .8rem 1rem; background: transparent; border: 1px dashed var(--line); border-radius: var(--radius);
  font: .95rem/1.45 var(--sans); color: var(--muted);
}
#find-result.find-result-reserved:empty::before { content: "The survey-grid line shows here after you drop a pin or finish an outline."; }
.find-coords-result.find-result-reserved:empty { display: block; visibility: hidden; padding: .8rem 1rem; border: 1px solid transparent; }

/* Past questions kept with a place. */
.place-qa { margin: 2rem 0 0; }
.place-qa-title { margin-bottom: .6rem; }
.place-qa-empty { color: var(--muted); font: .95rem/1.45 var(--sans); }
.place-qa-item {
  background: var(--card); border: 1px solid var(--line); border-left: 4px solid var(--ai-ink);
  border-radius: 0 var(--radius-card) var(--radius-card) 0; margin: 0 0 .8rem; padding: .7rem 1.1rem;
}
.place-qa-item > summary { cursor: pointer; font: 600 1rem/1.45 var(--sans); }
.place-qa-q { font-style: italic; }
.place-qa-date { font-weight: 400; color: var(--muted); font-size: .88rem; margin-left: .35rem; white-space: nowrap; }
.place-qa-body { margin-top: .6rem; }
.place-qa-body .desk-sources { margin: 1rem 0 0; padding: .75rem 0 0 1.2rem; border-top: 1px solid var(--line); font: .88rem/1.5 var(--sans); color: var(--muted); }
.place-qa-body .desk-sources-title { font-size: .95rem; margin: 1rem 0 0; }
.place-qa-body .desk-made-by { font: .85rem/1.45 var(--sans); color: var(--muted); margin-bottom: 0; }
.desk-saved-note { font: .88rem/1.45 var(--sans); color: var(--green-dark, #2f5d3a); }
@media print {
  .place-qa { margin-top: 10pt; break-before: auto; }
  .place-qa-item { background: #fff !important; border: .75pt solid #999; border-left-width: 2.5pt; padding: 4pt 7pt; break-inside: avoid; }
  .place-qa-item > summary { list-style: none; }
  .place-qa-item > summary::-webkit-details-marker { display: none; }
  details.place-qa-item:not([open]) > .place-qa-body { display: block; }
}