/*
 * Block & Lot — styles.
 *
 * A graphite "file" in dark, warm drafting paper in light, brass section
 * numbers, letterspaced mono labels, serif titles, hairline fact grids and
 * Sanborn-style colored left edges per evidence family. No webfonts are loaded — the stacks fall back to
 * system fonts, so nothing is fetched from a CDN.
 */

:root,
:root[data-theme='dark'] {
  color-scheme: dark;
  --ground: 20 22 27;        /* #14161B dossier-ground */
  --sunken: 14 16 20;
  --raised: 27 30 37;
  --slip: 38 43 53;          /* #262B35 card "paper on a desk" */
  --slip-edge: 51 58 70;
  --ink: 226 231 240;
  --ink-muted: 151 160 175;
  --ink-faint: 148 157 173;
  --rule: 46 52 63;
  --rule-hair: 36 41 50;
  --brass: 197 160 92;
  --brass-lit: 221 188 124;
  --brass-text: 197 160 92;  /* brass used as TEXT (round 4: own token for contrast) */
  --drafting: 106 154 228;
  --stamp: 222 124 100;      /* round 4: was 196 96 76 (3.5:1 on cards) */
  --focus: 221 188 124;
  --success: 74 176 128;
  --warning: 214 168 74;
  --danger: 238 124 124;     /* round 4: was 222 96 96 (4.0:1 on cards) */

  --fam-ownership: 123 156 188;
  --fam-building: 106 154 228;
  --fam-permits: 192 128 120;
  --fam-violations: 196 96 76;
  --fam-tax: 130 160 138;
  --fam-neighborhood: 201 162 39;
  --fam-other: 151 160 175;
  --fam-intelligence: 197 160 92;
}

:root[data-theme='light'] {
  color-scheme: light;
  --ground: 228 227 220;     /* #E4E3DC warm drafting paper */
  --sunken: 218 217 209;
  --raised: 237 236 230;
  --slip: 239 238 231;
  --slip-edge: 198 197 187;
  --ink: 27 29 34;
  --ink-muted: 85 88 95;
  --ink-faint: 88 91 98;
  --rule: 185 184 174;
  --rule-hair: 203 202 193;
  --brass: 154 122 56;
  --brass-lit: 197 160 92;
  --brass-text: 118 90 30;   /* round 4: 5:1 on paper (brass itself is 3.1:1) */
  --drafting: 36 86 176;     /* round 4: was 42 96 190 */
  --stamp: 142 58 44;
  --focus: 150 118 47;
  --success: 28 108 72;      /* round 4: was 40 130 90 (3.7:1) */
  --warning: 124 84 16;      /* round 4: was 150 105 30 (3.8:1) */
  --danger: 160 44 44;       /* round 4: was 176 56 56 */

  --fam-ownership: 69 97 124;
  --fam-building: 42 96 190;
  --fam-permits: 154 84 75;
  --fam-violations: 142 58 44;
  --fam-tax: 78 101 85;
  --fam-neighborhood: 154 122 24;
  --fam-other: 85 88 95;
  --fam-intelligence: 154 122 56;
}

/* ---- type: self-hosted (SIL OFL 1.1; licences beside the files in /static/fonts). Geist for the page and its UI, Geist
   Mono only where digits and IDs must line up, Newsreader for building names and section titles. Latin subsets;
   file names carry the weight, and the whole /static/fonts/ folder is served as immutable (app/assets.py). */
@font-face { font-family: "Geist"; font-style: normal; font-weight: 400; font-display: swap; src: url("/static/fonts/geist-400.woff2") format("woff2"); }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 500; font-display: swap; src: url("/static/fonts/geist-500.woff2") format("woff2"); }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 600; font-display: swap; src: url("/static/fonts/geist-600.woff2") format("woff2"); }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/static/fonts/geist-mono-400.woff2") format("woff2"); }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("/static/fonts/geist-mono-500.woff2") format("woff2"); }
@font-face { font-family: "Newsreader"; font-style: normal; font-weight: 500 600; font-display: swap; src: url("/static/fonts/newsreader-500-600.woff2") format("woff2"); }

:root {
  --sans: "Geist", "Segoe UI", system-ui, -apple-system, sans-serif;
  --mono: "Geist Mono", "Cascadia Mono", Consolas, ui-monospace, monospace;
  --serif: "Newsreader", "Iowan Old Style", Georgia, serif;
  --radius: 0.625rem;
  --maxw: 1240px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: rgb(var(--ground));
  color: rgb(var(--ink));
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
a { color: rgb(var(--drafting)); text-underline-offset: 2px; }
a:hover { color: rgb(var(--brass-lit)); }
:focus-visible { outline: 2px solid rgb(var(--focus)); outline-offset: 2px; }
.mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }

/* ------------------------------------------------------------ top bar */
.topbar {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; gap: 1rem;
  padding: 0.6rem clamp(1rem, 3vw, 2rem);
  background: rgb(var(--sunken) / 0.92);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid rgb(var(--rule));
}
.brand {
  display: inline-flex; align-items: center; gap: 0.55rem;
  font-family: var(--serif); font-size: 1.12rem; font-weight: 600;
  letter-spacing: 0; text-transform: none;
  color: rgb(var(--ink)); text-decoration: none; white-space: nowrap;
}
.brand-dot { width: 0.6rem; height: 0.6rem; background: rgb(var(--brass)); transform: rotate(45deg); }
.topbar-search { display: flex; gap: 0.4rem; flex: 1; min-width: 0; max-width: 30rem; margin-left: auto; }
.topbar-search input { flex: 1; min-width: 0; width: 100%; }
/* hosted (team) mode: who is signed in, and a way out */
.topbar-user {
  font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.72rem; color: rgb(var(--ink-muted));
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 16rem; flex: none;
}
.topbar-signout { font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.72rem; white-space: nowrap; flex: none; }
.page-search .topbar-user { margin-left: auto; }
/* own sign-in (DOSSIER_AUTH=email): the top bar's Sign out is a one-button form that reads like the old link */
.topbar-signout-form { margin: 0; flex: none; display: inline-flex; }
.topbar-signout-form button.topbar-signout {
  background: none; border: 0; padding: 0; color: rgb(var(--drafting)); font-weight: 400; letter-spacing: 0;
  text-decoration: underline; text-underline-offset: 2px;
}
.topbar-signout-form button.topbar-signout:hover { background: none; color: rgb(var(--brass-lit)); }
.theme-toggle {
  background: none; border: 1px solid rgb(var(--rule)); color: rgb(var(--ink-muted));
  border-radius: 999px; width: 2rem; height: 2rem; cursor: pointer; font-size: 1rem; flex: none;
}

input[type="search"], input[type="text"], input[type="email"] {
  font: inherit; color: rgb(var(--ink));
  background: rgb(var(--slip)); border: 1px solid rgb(var(--slip-edge));
  border-radius: 0.4rem; padding: 0.5rem 0.75rem;
}
input::placeholder { color: rgb(var(--ink-faint)); }
button, .btn {
  font: inherit; font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none;
  border-radius: 0.4rem; padding: 0.5rem 0.9rem; cursor: pointer;
  border: 1px solid rgb(var(--brass)); background: rgb(var(--brass)); color: rgb(20 22 27);
  text-decoration: none; display: inline-flex; align-items: center; gap: 0.4rem; white-space: nowrap; font-weight: 500;
}
button:hover, .btn:hover { background: rgb(var(--brass-lit)); color: rgb(20 22 27); }
.btn-quiet { background: transparent; color: rgb(var(--ink-muted)); border-color: rgb(var(--rule)); }
.btn-quiet:hover { background: rgb(var(--raised)); color: rgb(var(--ink)); }
.btn-primary { font-weight: 600; }

.page { max-width: var(--maxw); margin: 0 auto; padding: clamp(1rem, 3vw, 2.25rem) clamp(1rem, 3vw, 2rem) 4rem; }

/* ------------------------------------------------------------ type */
.caseline {
  font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none;
  color: rgb(var(--ink-faint)); margin: 0 0 0.75rem; font-weight: 500;
}
.caseline a { color: rgb(var(--ink-muted)); }
.display {
  font-family: var(--serif); font-weight: 500; letter-spacing: -0.01em; line-height: 1.12;
  font-size: clamp(1.9rem, 4.2vw, 3rem); margin: 0; text-wrap: balance; overflow-wrap: anywhere;
}
.subtitle { color: rgb(var(--ink-muted)); font-size: 1.05rem; max-width: 40rem; }
.fine { color: rgb(var(--ink-faint)); font-size: 0.8rem; }
.label { font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); font-weight: 500;
}

.group-head {
  display: flex; align-items: baseline; gap: 0.75rem;
  font-family: var(--serif); font-size: 1.2rem; font-weight: 600; letter-spacing: 0; text-transform: none;
  border-bottom: 1px solid rgb(var(--rule-hair)); padding-bottom: 0.7rem; margin: 2.75rem 0 1.25rem;
}

/* ------------------------------------------------------------ search */
.search-hero { max-width: 46rem; margin: clamp(2rem, 10vh, 6rem) auto 2rem; }
.search-hero.compact { margin-top: 1.5rem; }
.search-form { display: flex; gap: 0.5rem; margin: 1.75rem 0 1rem; }
.search-form input { flex: 1; min-width: 0; font-size: 1.1rem; padding: 0.8rem 1rem; }
.search-form button { padding: 0.8rem 1.2rem; }
.examples { list-style: none; padding: 0; margin: 0 0 1.5rem; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.examples a, .chip {
  display: inline-block; font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.75rem; letter-spacing: 0.04em;
  padding: 0.25rem 0.6rem; border: 1px solid rgb(var(--rule)); border-radius: 999px;
  color: rgb(var(--ink-muted)); text-decoration: none; background: rgb(var(--raised));
}
.examples a:hover { border-color: rgb(var(--brass)); color: rgb(var(--ink)); }

/* ------------------------------------------------------------ own sign-in pages (/signin) */
.signin { max-width: 26rem; margin: clamp(1.5rem, 8vh, 5rem) auto 2rem; }
.signin .display { font-size: clamp(1.7rem, 7vw, 2.4rem); }
.signin-form { display: grid; gap: 0.5rem; margin: 1.5rem 0 0.75rem; }
.signin-form input { width: 100%; min-width: 0; font-size: 1.1rem; padding: 0.8rem 1rem; }
.signin-form input.signin-code { text-align: center; font-family: var(--mono); font-size: 1.75rem; letter-spacing: 0.35em; padding: 0.7rem 0.5rem 0.7rem 0.85rem; }
.signin-form button { justify-content: center; padding: 0.8rem 1.2rem; font-size: 0.95rem; }
.signin-form-again { margin: 0.25rem 0 0; }
.signin-form-again button { width: 100%; justify-content: center; padding: 0.7rem 1.2rem; font-size: 0.9rem; }
.signin .notice { color: rgb(var(--ink-muted)); margin: 0.4rem 0; }
.signin .fine { margin: 1rem 0 0; }

/* ------------------------------------------------------------ match page */
.match-head { margin-bottom: 0.5rem; }
.match-message { font-family: var(--sans); font-size: 1.2rem; margin: 0.9rem 0 0.4rem; }
.match-none .match-message, .match-message.match-none, .match-message.match-unavailable { color: rgb(var(--danger)); }
.suggestions { color: rgb(var(--ink-muted)); padding-left: 1.2rem; margin: 0.4rem 0 0; }
.candidates .group-head { margin-top: 2rem; }
.candidate {
  display: grid; grid-template-columns: minmax(220px, 300px) 1fr; gap: 1.25rem;
  background: rgb(var(--slip)); border: 1px solid rgb(var(--slip-edge));
  border-left: 4px solid rgb(var(--rule)); border-radius: var(--radius);
  padding: 1rem; margin-bottom: 1rem;
}
.candidate.is-best { border-left-color: rgb(var(--brass)); }
.candidates-other .candidate { opacity: 0.92; }
.candidate-map { min-height: 170px; border-radius: 0.4rem; overflow: hidden; background: rgb(var(--sunken)); }
.candidate-map iframe { width: 100%; height: 100%; min-height: 190px; border: 0; display: block; }
.candidate-title { font-family: var(--serif); font-weight: 500; font-size: 1.55rem; margin: 0 0 0.6rem; line-height: 1.2; }
.candidate-facts {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 0 1.5rem;
  border-top: 1px solid rgb(var(--rule-hair)); margin: 0 0 0.75rem;
}
.candidate-facts div { border-bottom: 1px solid rgb(var(--rule-hair)); padding: 0.45rem 0; }
.candidate-facts .wide { grid-column: 1 / -1; }
.candidate-facts dt, .facts-strip dt, .numbers dt {
  font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); font-weight: 500;
}
.candidate-facts dd { margin: 0.15rem 0 0; font-size: 0.95rem; }
.candidate-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; margin-top: 0.5rem; }
.match-notes { margin: 0 0 0.5rem; display: flex; gap: 0.35rem; flex-wrap: wrap; }
.resolved-via { font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-faint)); margin: 0.6rem 0 0; font-weight: 500;
}
.map-missing {
  display: flex; align-items: center; justify-content: center; text-align: center; height: 100%; min-height: 170px;
  color: rgb(var(--ink-faint)); font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.75rem; letter-spacing: 0.08em; padding: 1rem;
  background: repeating-linear-gradient(45deg, rgb(var(--sunken)), rgb(var(--sunken)) 8px, rgb(var(--raised)) 8px, rgb(var(--raised)) 16px);
}

/* ------------------------------------------------------------ hero */
.hero { border-bottom: 1px solid rgb(var(--rule)); padding-bottom: 1.75rem; }
.hero-caseline { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.25rem 1.5rem; margin-bottom: 1.75rem; }
.hero-caseline span:first-child { color: rgb(var(--ink-muted)); }
.hero-row { display: flex; gap: 2rem; justify-content: space-between; align-items: flex-start; }
.hero-id { min-width: 0; }
.breadcrumb {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.6rem; margin: 0.9rem 0 0;
  font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); font-weight: 500;
}
.breadcrumb .sep { color: rgb(var(--ink-faint)); }
.not-right { margin: 0.8rem 0 0; font-size: 0.9rem; }
.resolution { color: rgb(var(--ink-muted)); font-size: 0.85rem; margin: 0.8rem 0 0; }

/* Key-facts strip: IT FactsGrid — hairlines, no boxes. */
.facts-strip {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 2rem; grid-auto-flow: dense;
  margin: 1.75rem 0 0; border-top: 1px solid rgb(var(--rule-hair));
}
.fact { border-bottom: 1px solid rgb(var(--rule-hair)); padding: 0.65rem 0; min-width: 0; }
.fact.wide { grid-column: span 2; }
.fact dd { margin: 0.25rem 0 0; font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.95rem;  overflow-wrap: anywhere; }
.fact.wide dd { font-family: var(--sans); font-size: 1.05rem; }
.pending {
  display: inline-block; width: 6rem; height: 0.85rem; border-radius: 3px; color: transparent;
  background: linear-gradient(90deg, rgb(var(--raised)), rgb(var(--slip-edge)), rgb(var(--raised)));
  background-size: 200% 100%; animation: shimmer 1.4s linear infinite;
}
.unknown { color: rgb(var(--ink-faint)); font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.8rem; }
.just-filled { animation: flash 900ms ease-out; }

/* ------------------------------------------------------------ maps */
.maps { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 1.75rem 0 0; }
.map-frame { margin: 0; background: rgb(var(--slip)); border: 1px solid rgb(var(--slip-edge)); border-radius: var(--radius); overflow: hidden; }
.map-frame iframe { display: block; width: 100%; height: clamp(240px, 32vw, 380px); border: 0; }
.map-frame figcaption {
  display: flex; flex-wrap: wrap; gap: 0.25rem 0.75rem; align-items: baseline; justify-content: space-between;
  padding: 0.55rem 0.8rem; font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); font-weight: 500;
}
.map-hint { text-transform: none; letter-spacing: 0; color: rgb(var(--ink-faint)); flex: 1; }
.map-wait .map-missing { min-height: clamp(240px, 32vw, 380px); }

/* ------------------------------------------------------------ signals */
.signals-panel { margin: 1.5rem 0 0; }
.signals-head { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; align-items: baseline; margin-bottom: 0.6rem; }
.signal-strip { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.5rem; }
.signal-badge {
  border: 1px solid rgb(var(--rule)); border-left: 4px solid rgb(var(--rule)); border-radius: 0.4rem;
  background: rgb(var(--raised)); min-width: 0;
}
.signal-badge > a, .signal-badge:not(:has(a)) { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; padding: 0.45rem 0.6rem; text-decoration: none; color: inherit; }
.signal-name { font-size: 0.82rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.signal-conf { font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.66rem; letter-spacing: 0.12em; font-weight: 600; }
.conf-high { border-left-color: rgb(var(--stamp)); }
.conf-high .signal-conf { color: rgb(var(--stamp)); }
.conf-medium { border-left-color: rgb(var(--warning)); }
.conf-medium .signal-conf { color: rgb(var(--warning)); }
.conf-low { border-left-color: rgb(var(--ink-faint)); }
.conf-low .signal-conf { color: rgb(var(--ink-muted)); }
.conf-pending .signal-name { color: rgb(var(--ink-faint)); }

/* ------------------------------------------------------------ toolbar */
.toolbar {
  position: sticky; top: var(--topbar-h, 3.1rem); z-index: 10;
  margin: 1.75rem calc(-1 * clamp(1rem, 3vw, 2rem)) 0; padding: 0.7rem clamp(1rem, 3vw, 2rem) 0.6rem;
  background: rgb(var(--ground) / 0.94); backdrop-filter: blur(6px);
  border-bottom: 1px solid rgb(var(--rule-hair));
  display: grid; grid-template-columns: 1fr auto; gap: 0.4rem 1rem; align-items: center;
}
.toolbar-actions { display: flex; gap: 0.4rem; flex-wrap: wrap; justify-content: flex-end; }
.toolbar-actions .btn { padding: 0.35rem 0.6rem; font-size: 0.68rem; }
.toc { grid-column: 1 / -1; list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; }
.toc a { font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); text-decoration: none; white-space: nowrap; font-weight: 500;
}
.toc a:hover { color: rgb(var(--ink)); }
.group { scroll-margin-top: 9rem; }

/* ------------------------------------------------------------ cards */
.cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: start; }
.card-wide { grid-column: 1 / -1; }
.card {
  background: rgb(var(--slip)); border: 1px solid rgb(var(--slip-edge)); border-left: 4px solid rgb(var(--fam-other));
  border-radius: var(--radius); padding: 1rem 1.15rem 0.85rem; min-width: 0; scroll-margin-top: 9rem;
}
.card.fam-ownership { border-left-color: rgb(var(--fam-ownership)); }
.card.fam-building { border-left-color: rgb(var(--fam-building)); }
.card.fam-permits { border-left-color: rgb(var(--fam-permits)); }
.card.fam-violations { border-left-color: rgb(var(--fam-violations)); }
.card.fam-tax { border-left-color: rgb(var(--fam-tax)); }
.card.fam-neighborhood { border-left-color: rgb(var(--fam-neighborhood)); }
.card.fam-intelligence { border-left-color: rgb(var(--fam-intelligence)); }
.card-head { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.55rem; }
.card-title {
  margin: 0; flex: 1; min-width: 0;
  font-family: var(--serif); font-size: 1.12rem; font-weight: 600; letter-spacing: 0; text-transform: none;
}
.status-pill {
  font-family: var(--sans); font-size: 0.74rem; letter-spacing: 0.03em; text-transform: none;
  padding: 0.15rem 0.5rem; border-radius: 999px; border: 1px solid rgb(var(--rule)); color: rgb(var(--ink-faint)); white-space: nowrap; font-weight: 500;
}
.card[data-status="loading"] .status-pill { color: rgb(var(--drafting)); border-color: rgb(var(--drafting) / 0.6); }
.card[data-status="loading"] .status-pill::before { content: ""; display: inline-block; width: 0.45rem; height: 0.45rem; margin-right: 0.35rem; border-radius: 50%; background: currentColor; animation: pulse 1s ease-in-out infinite; vertical-align: 0.05rem; }
.card[data-status="loaded"] .status-pill { color: rgb(var(--success)); border-color: rgb(var(--success) / 0.5); }
.card[data-status="empty"] .status-pill { color: rgb(var(--ink-muted)); }
.card[data-status="partial"] .status-pill,
.card[data-status="unavailable"] .status-pill,
.card[data-status="timeout"] .status-pill { color: rgb(var(--warning)); border-color: rgb(var(--warning) / 0.6); }
.card[data-status="error"] .status-pill { color: rgb(var(--danger)); border-color: rgb(var(--danger) / 0.6); }
.card[data-status="empty"] { background: rgb(var(--raised)); }
.retry { padding: 0.2rem 0.6rem; font-size: 0.64rem; }

.skeleton span {
  display: block; height: 0.8rem; margin: 0.45rem 0; border-radius: 3px;
  background: linear-gradient(90deg, rgb(var(--raised)), rgb(var(--slip-edge)), rgb(var(--raised)));
  background-size: 200% 100%; animation: shimmer 1.4s linear infinite;
}
.skeleton span.short { width: 55%; }
.card[data-status="queued"] .skeleton span { animation: none; opacity: 0.6; }

.lede { font-family: var(--sans); font-size: 1.08rem; line-height: 1.45; margin: 0 0 0.6rem; }
.lede.tone-alert { color: rgb(var(--ink)); }
.card[data-status="loaded"] .lede.tone-alert::before { content: "\25CF"; color: rgb(var(--stamp)); font-size: 0.7em; margin-right: 0.45rem; vertical-align: 0.15em; }
.lede.tone-calm::before { content: "\25CF"; color: rgb(var(--success)); font-size: 0.7em; margin-right: 0.45rem; vertical-align: 0.15em; }
.numbers { display: flex; flex-wrap: wrap; gap: 0.4rem 1.5rem; margin: 0 0 0.6rem; }
.numbers dd { margin: 0.1rem 0 0; font-family: var(--mono); font-size: 1rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.note { font-size: 0.86rem; color: rgb(var(--ink-muted)); border-left: 2px solid rgb(var(--rule)); padding-left: 0.6rem; margin: 0.4rem 0 0.6rem; }
.note-warn { border-left-color: rgb(var(--warning)); }
.fail-banner { color: rgb(var(--danger)); font-weight: 600; margin: 0.4rem 0; }
.empty { color: rgb(var(--ink-muted)); font-style: italic; margin: 0.3rem 0; }
.caption-inline { font-style: normal; font-weight: 600; }

details.records { border-top: 1px solid rgb(var(--rule-hair)); margin-top: 0.4rem; }
details.records > summary {
  list-style: none; cursor: pointer; padding: 0.55rem 0; display: flex; align-items: center; gap: 0.45rem;
  font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); font-weight: 500;
}
details.records > summary::-webkit-details-marker { display: none; }
details.records > summary:hover { color: rgb(var(--ink)); }
.chev { color: rgb(var(--brass-text)); display: inline-block; transition: transform 150ms; }
details[open] > summary .chev { transform: rotate(90deg); }
.records-body { padding-bottom: 0.5rem; }

.prov {
  margin: 0.4rem 0 0.75rem; border-left: 2px solid rgb(var(--rule)); padding-left: 0.55rem;
  font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.7rem; line-height: 1.55; color: rgb(var(--ink-faint));
  overflow-wrap: anywhere;
}
.summary-tag { margin-left: auto; }
.summary-tag .tag { margin: 0; }
.signal-list { list-style: none; margin: 0.25rem 0 0.5rem; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.6rem 1.5rem; }
.signal-list li { border-left: 3px solid rgb(var(--rule)); padding: 0.15rem 0 0.15rem 0.7rem; }
.signal-list li.conf-high { border-left-color: rgb(var(--stamp)); }
.signal-list li.conf-medium { border-left-color: rgb(var(--warning)); }
.signal-list li.conf-low { border-left-color: rgb(var(--ink-faint)); }
.signal-line { margin: 0; display: flex; gap: 0.6rem; align-items: baseline; justify-content: space-between; }
.signal-line a { color: rgb(var(--ink)); text-decoration: none; font-weight: 600; }
.signal-list .conf-high .signal-conf { color: rgb(var(--stamp)); }
.signal-list .conf-medium .signal-conf { color: rgb(var(--warning)); }
.signal-list .conf-low .signal-conf { color: rgb(var(--ink-muted)); }
.signal-list .signal-summary { margin: 0.15rem 0 0; font-size: 0.86rem; color: rgb(var(--ink-muted)); }
.tag {
  display: inline-block; padding: 0.05rem 0.4rem; border-radius: 3px; border: 1px solid currentColor;
  font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.64rem; font-weight: 600; letter-spacing: 0.08em; margin-right: 0.3rem;
}
.tag-real { color: rgb(var(--success)); }
.tag-extrapolated { color: rgb(var(--warning)); }
.tag-fail { color: rgb(var(--danger)); }
.tag.confidence-high { color: rgb(var(--stamp)); }
.tag.confidence-medium { color: rgb(var(--warning)); }
.tag.confidence-low { color: rgb(var(--ink-muted)); }
.sensitive-badge {
  display: inline-block; color: rgb(var(--danger)); border: 1px solid rgb(var(--danger)); border-radius: 3px;
  padding: 0.02rem 0.35rem; font-size: 0.66rem; margin-left: 0.35rem; text-transform: none; letter-spacing: 0;
}

.table-wrap { overflow-x: auto; margin: 0 0 0.85rem; -webkit-overflow-scrolling: touch; }
table { border-collapse: collapse; width: 100%; font-size: 0.8rem; }
caption { text-align: left; font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); padding: 0.3rem 0; font-weight: 500;
}
caption .count { color: rgb(var(--ink-faint)); }
th, td { border-bottom: 1px solid rgb(var(--rule-hair)); padding: 0.35rem 0.55rem 0.35rem 0; text-align: left; vertical-align: top; }
thead th { font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); white-space: nowrap; border-bottom-color: rgb(var(--rule)); font-weight: 500;
}
td { font-family: var(--sans); font-variant-numeric: tabular-nums;  overflow-wrap: anywhere; min-width: 5rem; }
table.kv th { width: 34%; font-weight: 500; color: rgb(var(--ink-muted)); font-size: 0.78rem; }
.method { color: rgb(var(--ink-muted)); font-size: 0.82rem; margin: 0.25rem 0; }
.method .label { margin-right: 0.4rem; }
.orientation-headline { font-family: var(--serif); font-size: 1.1rem; }
.sun-exposure { margin-top: 0.75rem; border-top: 1px dashed rgb(var(--rule)); padding-top: 0.5rem; }
.signal-detail { border-top: 1px solid rgb(var(--rule-hair)); padding: 0.75rem 0 0.25rem; }
.signal-detail h4 { margin: 0 0 0.35rem; font-family: var(--serif); font-weight: 500; font-size: 1.1rem; }
.signal-summary { margin: 0 0 0.35rem; }
.card .signal-strip { margin: 0.25rem 0 0.75rem; }
.link-out a { font-weight: 600; }

/* ------------------------------------------------------------ report page */
.page-report .cards-report { grid-template-columns: 1fr; margin-top: 1.5rem; }
.page-report .facts-strip .fact:not(.wide) dd { font-size: 0.95rem; }

/* ------------------------------------------------------------ motion */
@keyframes shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@keyframes pulse { 0%, 100% { opacity: 0.35; } 50% { opacity: 1; } }
@keyframes flash { from { background: rgb(var(--brass) / 0.28); } to { background: transparent; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ------------------------------------------------------------ narrow */
@media (max-width: 900px) {
  .cards { grid-template-columns: 1fr; }
  .facts-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1.25rem; }
  .signal-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .maps { grid-template-columns: 1fr; }
  .signal-list { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  body { font-size: 14.5px; }
  .topbar { gap: 0.6rem; }
  .brand { font-size: 1.12rem; gap: 0; font-family: var(--serif); font-weight: 600;
}
  .brand-dot { width: 0.8rem; height: 0.8rem; }
  .topbar-search button { padding: 0.45rem 0.6rem; }
  .topbar-user { display: none; }
  .hero-row { flex-direction: column; gap: 1.25rem; }
  .candidate { grid-template-columns: 1fr; }
  .candidate-map iframe { min-height: 160px; }
  .search-form { flex-direction: column; }
  .toolbar { top: var(--topbar-h, 3rem); grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .toolbar-actions { justify-content: flex-start; }
  .fact.wide { grid-column: 1 / -1; }
  .map-frame iframe { height: 240px; }
  .card { padding: 0.85rem 0.85rem 0.7rem; }
}

/* ------------------------------------------------------------ print */
@media print {
  :root, :root[data-theme='dark'], :root[data-theme='light'] {
    color-scheme: light;
    --ground: 255 255 255; --sunken: 255 255 255; --raised: 255 255 255;
    --slip: 255 255 255; --slip-edge: 198 197 187;
    --ink: 27 29 34; --ink-muted: 85 88 95; --ink-faint: 88 91 98;
    --rule: 185 184 174; --rule-hair: 210 209 200;
    --brass: 154 122 56; --brass-lit: 154 122 56; --brass-text: 118 90 30; --drafting: 36 86 176; --stamp: 142 58 44;
    --success: 40 130 90; --warning: 150 105 30; --danger: 176 56 56;
  }
  body { font-size: 11pt; background: #fff; }
  [data-chrome], .theme-toggle, .retry, .not-right, .print-hide, .skeleton, .maps iframe { display: none !important; }
  .page { max-width: none; padding: 0; }
  .maps { grid-template-columns: 1fr 1fr; }
  .map-frame { border-style: dashed; }
  .map-frame figcaption a::after { content: " (" attr(href) ")"; text-transform: none; letter-spacing: 0; font-size: 7pt; overflow-wrap: anywhere; }
  .cards { display: block; }
  .card { break-inside: avoid; margin-bottom: 0.5rem; border-left-width: 3px; }
  .card-wide, .page-report .card { break-inside: auto; }
  .group-head { break-after: avoid; margin-top: 1.25rem; font-family: var(--serif); font-weight: 600; font-size: 1.2rem;
}
  .card[data-status="queued"], .card[data-status="loading"] { display: none; }
  details.records:not([open]) { display: none; }
  details.records > summary { display: none; font-family: var(--sans); font-weight: 500; font-size: 0.78rem;
}
  a { color: inherit; }
  .table-wrap { overflow: visible; }
  td, th { font-size: 8pt; }
}
.match-message.match-near { color: rgb(var(--warning)); }
.facts-source { font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.68rem; letter-spacing: 0.08em; color: rgb(var(--ink-faint)); margin: 0.5rem 0 0; }
.candidate.is-compact { grid-template-columns: 1fr; padding: 0.8rem 1rem; }
.candidate.is-compact .candidate-title { font-size: 1.25rem; margin-bottom: 0.4rem; }
.candidate.is-compact .candidate-facts { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }

/* ======================================================= polish round 2 */

/* ---- At a glance (IT lead-summary style) */
.glance {
  margin: 1.5rem 0 0; padding: 1rem 1.25rem 0.6rem;
  background: rgb(var(--slip)); border: 1px solid rgb(var(--slip-edge)); border-left: 4px solid rgb(var(--brass));
  border-radius: var(--radius);
}
.glance-head {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.3rem 0.75rem; margin: 0 0 0.4rem;
  font-family: var(--serif); font-size: 1.08rem; font-weight: 600; letter-spacing: 0; text-transform: none;
}
.glance-head .fine { font-family: var(--sans); letter-spacing: 0; text-transform: none; font-weight: 400; }
.glance-list { list-style: none; margin: 0; padding: 0; }
.glance-item {
  display: grid; grid-template-columns: 12.5rem 1fr; gap: 0.2rem 1rem; align-items: baseline;
  padding: 0.55rem 0; border-top: 1px solid rgb(var(--rule-hair));
}
.glance-item:first-child { border-top: 0; }
.glance-label {
  font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted));
  position: relative; padding-left: 0.95rem; font-weight: 500;
}
.glance-label::before {
  content: ""; position: absolute; left: 0; top: 0.32em; width: 0.45rem; height: 0.45rem; border-radius: 50%;
  background: rgb(var(--rule));
}
.glance-item.tone-alert .glance-label::before { background: rgb(var(--stamp)); }
.glance-item.tone-calm .glance-label::before { background: rgb(var(--success)); }
.glance-item.tone-neutral .glance-label::before { background: rgb(var(--drafting)); }
.glance-text { font-family: var(--sans); font-size: 1.06rem; line-height: 1.4; overflow-wrap: anywhere; }
.glance-item.is-missing .glance-text { color: rgb(var(--ink-faint)); font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.8rem; }
.glance-more { font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; margin-left: 0.25rem; font-weight: 500;
}

/* ---- strip headings (Then / Now) */
.strip-head {
  grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.3rem 0.75rem; margin: 0 0 0.75rem;
  font-family: var(--serif); font-size: 1.08rem; font-weight: 600; letter-spacing: 0; text-transform: none;
}
.strip-head .fine { font-family: var(--sans); letter-spacing: 0; text-transform: none; font-weight: 400; }
.maps .strip-head { margin-bottom: 0; }

/* ---- Then: tax photos + aerial viewer */
.then-now { margin: 1.75rem 0 0; }
.then-strip { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.55fr); gap: 1rem; align-items: stretch; }
.then-photo, .aerial {
  margin: 0; background: rgb(var(--slip)); border: 1px solid rgb(var(--slip-edge)); border-radius: var(--radius);
  overflow: hidden; display: flex; flex-direction: column; min-width: 0;
}
.then-open {
  all: unset; cursor: zoom-in; display: block; position: relative; flex: 1 0 auto;
  background: rgb(var(--sunken));
}
.then-open:disabled { cursor: default; }
.then-open:focus-visible { outline: 2px solid rgb(var(--focus)); outline-offset: -2px; }
.then-img { display: block; position: relative; height: clamp(220px, 24vw, 320px); overflow: hidden; }
.then-img img { width: 100%; height: 100%; object-fit: cover; display: block; filter: grayscale(0.15) contrast(1.02); transition: transform 300ms ease; }
.then-open:not(:disabled):hover .then-img img { transform: scale(1.03); }
.then-img.is-loading {
  background: linear-gradient(90deg, rgb(var(--raised)), rgb(var(--slip-edge)), rgb(var(--raised)));
  background-size: 200% 100%; animation: shimmer 1.4s linear infinite;
}
.then-img.is-empty {
  display: flex; align-items: center; justify-content: center;
  background: repeating-linear-gradient(45deg, rgb(var(--sunken)), rgb(var(--sunken)) 8px, rgb(var(--raised)) 8px, rgb(var(--raised)) 16px);
  color: rgb(var(--ink-faint)); font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.75rem; letter-spacing: 0.08em; text-align: center; padding: 1rem;
}
.then-year {
  position: absolute; left: 0.6rem; top: 0.55rem; z-index: 1;
  font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.72rem; font-weight: 600; letter-spacing: 0.16em;
  color: #fff; background: rgb(20 22 27 / 0.72); padding: 0.15rem 0.45rem; border-radius: 3px;
}
.then-photo figcaption, .aerial-controls {
  padding: 0.55rem 0.8rem; font-size: 0.82rem; color: rgb(var(--ink-muted)); border-top: 1px solid rgb(var(--rule-hair));
}
.then-photo .era {
  display: block; font-family: var(--sans); font-size: 0.74rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-faint)); font-weight: 500;
}
.then-photo[data-match="exact"] .then-label { color: rgb(var(--ink)); }
.then-photo[data-match="nearest"] .then-label { color: rgb(var(--warning)); }
.then-credit { font-size: 0.78rem; color: rgb(var(--ink-faint)); margin: 0.6rem 0 0; }

.aerial-stage {
  position: relative; height: clamp(220px, 24vw, 320px); overflow: hidden; background: rgb(var(--sunken));
  touch-action: none; cursor: grab; user-select: none; flex: 1 0 auto;
}
.aerial-stage:active { cursor: grabbing; }
.aerial-layer { position: absolute; inset: 0; }
.aerial-layer[hidden] { display: none; }
.aerial-layer img { position: absolute; width: 256px; height: 256px; max-width: none; pointer-events: none; }
.aerial-layer img.missing { visibility: hidden; }
.aerial-overlay { position: absolute; left: 0; top: 0; pointer-events: none; }
.aerial-lot { fill: rgb(221 188 124 / 0.12); stroke: #f5c451; stroke-width: 2.5; stroke-linejoin: round; filter: drop-shadow(0 0 2px rgb(0 0 0 / 0.8)); }
.aerial-swipe-line { position: absolute; top: 0; bottom: 0; width: 2px; margin-left: -1px; background: #fff; box-shadow: 0 0 4px rgb(0 0 0 / 0.7); pointer-events: none; }
.aerial-swipe-line[hidden] { display: none; }
.aerial-msg {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center; padding: 1rem;
  color: rgb(var(--ink-faint)); font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.75rem; letter-spacing: 0.08em;
  background: rgb(var(--sunken) / 0.6);
}
.aerial-msg[hidden] { display: none; }
.aerial-year {
  position: absolute; left: 0.6rem; top: 0.55rem; white-space: pre;
  font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.78rem; font-weight: 600; letter-spacing: 0.12em;
  color: #fff; background: rgb(20 22 27 / 0.72); padding: 0.15rem 0.5rem; border-radius: 3px;
}
.aerial-year:empty { display: none; }
.aerial-zoom { position: absolute; right: 0.5rem; top: 0.5rem; display: flex; flex-direction: column; gap: 0.25rem; }
.aerial-zoom button { width: 1.9rem; height: 1.9rem; padding: 0; justify-content: center; font-size: 1rem; letter-spacing: 0; background: rgb(20 22 27 / 0.75); color: #fff; border-color: rgb(255 255 255 / 0.35); }
.aerial-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 1rem; }
.aerial-ctl { display: flex; align-items: center; gap: 0.5rem; flex: 1 1 12rem; }
.aerial-ctl input[type="range"] { flex: 1; min-width: 6rem; accent-color: rgb(var(--brass)); }
.aerial-cmp { flex: 0 1 auto; font-size: 0.8rem; }
.aerial-cmp input { accent-color: rgb(var(--brass)); }
.aerial-swipe { flex: 1 1 100%; accent-color: rgb(var(--brass)); }
.aerial-swipe[hidden] { display: none; }
.aerial-attr { flex: 1 1 100%; font-size: 0.68rem; color: rgb(var(--ink-faint)); }

/* ---- lightbox */
.lightbox {
  border: 1px solid rgb(var(--slip-edge)); border-radius: var(--radius); padding: 0.75rem; background: rgb(var(--slip)); color: rgb(var(--ink));
  max-width: min(96vw, 1400px); max-height: 94vh;
}
.lightbox::backdrop { background: rgb(0 0 0 / 0.8); }
.lightbox img { display: block; max-width: 100%; max-height: calc(94vh - 5rem); margin: 0 auto; }
.lightbox-close { position: absolute; right: 0.6rem; top: 0.5rem; padding: 0.1rem 0.55rem; font-size: 1.2rem; }
.lightbox-cap { margin: 0.5rem 0 0; font-size: 0.85rem; color: rgb(var(--ink-muted)); }

/* ---- Now: maps sit under their own heading */
.maps { margin-top: 1.75rem; }

/* ---- cards: summary first, provenance as a small footer */
.lede { font-size: 1.16rem; line-height: 1.42; margin-bottom: 0.7rem; }
.card-title { font-size: 1.12rem; color: rgb(var(--ink-muted)); font-family: var(--serif); font-weight: 600;
}
.numbers dd { font-size: 0.95rem; }
.card-sources {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.2rem 0.45rem;
  margin: 0.55rem 0 0; padding: 0.45rem 0 0; border-left: 0; border-top: 1px dashed rgb(var(--rule-hair));
  font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.64rem; line-height: 1.5; color: rgb(var(--ink-faint));
}
.card-sources .tag { font-size: 0.58rem; margin: 0; }
.sources-label { letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); font-family: var(--sans); font-weight: 500; font-size: 0.78rem;
}
.sources-text { flex: 1 1 14rem; min-width: 0; overflow-wrap: anywhere; }

/* ---- "Nothing on file": empty cards collapse to one line each */
.empties { margin-top: 0.9rem; }
.empties[hidden] { display: none; }
.empties-head { margin: 0 0 0.35rem; }
.empties-list { border-top: 1px solid rgb(var(--rule-hair)); }
.card.card-compact {
  display: grid; grid-template-columns: minmax(9rem, 14rem) 1fr; gap: 0.1rem 1rem; align-items: baseline;
  background: none; border: 0; border-bottom: 1px solid rgb(var(--rule-hair)); border-radius: 0; padding: 0.45rem 0;
}
.card.card-compact .card-head { margin: 0; }
.card.card-compact .status-pill, .card.card-compact .card-sources, .card.card-compact .numbers, .card.card-compact .note { display: none; }
.card.card-compact .lede { font-family: var(--sans); font-size: 0.86rem; color: rgb(var(--ink-muted)); margin: 0; }
.card.card-compact .lede::before { display: none; }

/* ---- match page: collapsed "Not it?" list */
.others-toggle { margin-top: 1rem; }
.others-toggle > summary {
  list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.5rem 0;
  font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); font-weight: 500;
}
.others-toggle > summary::-webkit-details-marker { display: none; }
.others-toggle > summary:hover { color: rgb(var(--ink)); }
.others-toggle[open] > summary { margin-bottom: 0.5rem; }

@media (max-width: 900px) {
  .then-strip { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .then-strip .aerial { grid-column: 1 / -1; }
  .glance-item { grid-template-columns: 8.5rem 1fr; }
}
@media (max-width: 640px) {
  .glance { padding: 0.85rem 0.85rem 0.4rem; }
  .glance-item { grid-template-columns: 1fr; gap: 0.15rem; }
  .then-img { height: 180px; }
  .aerial-stage { height: 260px; }
  .card.card-compact { grid-template-columns: 1fr; }
}
@media print {
  .then-open, .aerial-zoom, .aerial-controls input, .aerial-cmp, .lightbox { display: none !important; }
  .then-strip { grid-template-columns: 1fr 1fr; }
  .card-sources { font-size: 6.5pt; }
}

/* ---- polish round 3: deep links to every source ----------------------- */
/* Links read as links but stay quiet: drafting-blue, hairline underline. */
.fact-src, .val-link, .glance-src { color: inherit; text-decoration: underline; text-decoration-color: rgb(var(--drafting) / 0.55); text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
.fact-src:hover, .val-link:hover, .glance-src:hover { color: rgb(var(--drafting)); text-decoration-color: rgb(var(--drafting)); }
.fact-src:not([href]) { text-decoration: none; }
a.fact-src[href]::after { content: "\00a0\2197"; font-size: 0.72em; color: rgb(var(--drafting)); text-decoration: none; display: inline-block; }
/* At a glance reads as prose: a quiet dotted underline, no arrows. */
/* Fact and value links (At a glance values, The building in brief values, the header BBL / BIN) deep-link to the city's own
   record. They read as text in the normal colour with a thin, faint SOLID underline at rest (so a phone, which has no hover,
   still shows what is tappable, and At a glance does not look like a wall of links); the underline goes full strength on
   hover and a keyboard focus shows a ring. The small arrow after a value in The building in brief and after the BBL / BIN
   stays; At a glance has none. The dotted underline is reserved for explanations. A same-page jump link (the Strongest signal
   line) is plain text until hovered. Other links (the titled source links under each card, "Back to the matches", the record
   tables' links) keep their current solid underline. */
.fact-src, .fact-src:hover, .glance-src, .glance-src:hover { color: inherit; }
.fact-src[href], .glance-src[href] {
  text-decoration-line: underline; text-decoration-style: solid; text-decoration-thickness: 1px; text-underline-offset: 3px;
  text-decoration-color: rgb(var(--ink-faint));
  text-decoration-color: color-mix(in srgb, currentColor 38%, transparent);
}
.fact-src[href]:hover, .glance-src[href]:hover { text-decoration-color: currentColor; }
.glance-src[href^="#"] { text-decoration: none; }
@media (hover: hover) { .glance-src[href^="#"]:hover { text-decoration: underline; text-decoration-color: currentColor; text-underline-offset: 3px; text-decoration-thickness: 1px; } }
.fact-src:focus-visible, .glance-src:focus-visible { outline: 2px solid rgb(var(--brass)); outline-offset: 2px; border-radius: 2px; }
.glance-src[href^="#"]:focus-visible { text-decoration: underline; }
.val-link { color: rgb(var(--drafting)); }
th.src-col { width: 1%; }
td.src-cell { white-space: normal; min-width: 9.5rem; }
.src-cell, .sources-links { display: flex; flex-wrap: wrap; gap: 0.2rem 0.35rem; align-items: baseline; }
.src-link {
  display: inline-block; font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.66rem; line-height: 1.35; letter-spacing: 0.02em;
  color: rgb(var(--drafting)); text-decoration: none; border: 1px solid rgb(var(--drafting) / 0.35); border-radius: 3px; padding: 0.02rem 0.3rem;
  white-space: nowrap;
}
.src-link::after { content: "\00a0\2197"; font-size: 0.85em; }
.src-link:hover { background: rgb(var(--drafting) / 0.12); border-color: rgb(var(--drafting)); }
.src-link.src-agency { border-color: rgb(var(--brass) / 0.55); color: rgb(var(--brass-lit)); }
:root[data-theme='light'] .src-link.src-agency { color: rgb(var(--brass-text)); }
.src-link.src-portal { border-style: dashed; }
.src-internal { font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.64rem; color: rgb(var(--ink-faint)); font-style: italic; }
.copy-wrap { display: inline-flex; align-items: baseline; gap: 0.2rem; }
.copy-id { font-family: var(--mono); font-size: 0.66rem; color: rgb(var(--ink)); background: rgb(var(--sunken)); padding: 0 0.25rem; border-radius: 2px; }
.copy-btn { font-family: var(--sans); font-size: 0.74rem; padding: 0.02rem 0.35rem; letter-spacing: 0.03em; text-transform: none; cursor: pointer; font-weight: 500;
}
.card-sources .sources-links { flex: 1 1 100%; }
.card-sources .src-link { font-size: 0.62rem; }
tr.src-row th, tr.src-row td { border-top: 1px dashed rgb(var(--rule-hair)); }
/* Aerial: the outline is today's footprint on years before the building. */
.aerial-lot.is-today { stroke-dasharray: 6 4; fill: none; }
.aerial-fp {
  position: absolute; left: 0.6rem; bottom: 0.55rem; max-width: calc(100% - 1.2rem);
  font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.68rem; letter-spacing: 0.04em;
  color: #fff; background: rgb(20 22 27 / 0.72); padding: 0.12rem 0.45rem; border-radius: 3px; pointer-events: none;
}
.aerial-fp[hidden] { display: none; }
@media print {
  .src-link::after, a.fact-src[href]::after { content: ""; }
  .copy-btn { display: none; font-family: var(--sans); font-weight: 500; font-size: 0.74rem;
}
}

/* ======================================================= polish round 4 */

.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: absolute; left: 0.75rem; top: -3rem; z-index: 50; background: rgb(var(--brass)); color: rgb(20 22 27);
  padding: 0.4rem 0.8rem; border-radius: 0.4rem; font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.78rem;
}
.skip-link:focus { top: 0.6rem; }

/* Anchors land below the sticky bars (dossier.js keeps --sticky-h exact). */
.group, .card, .signal-detail, .glance, .then-now, .maps { scroll-margin-top: calc(var(--sticky-h, 9rem) + 0.75rem); }

/* ---- record cells */
.v-empty { color: rgb(var(--ink-faint)); }
.v-long { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.records-table td { min-width: 4.5rem; }
.records-loading { font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.75rem; letter-spacing: 0.08em; color: rgb(var(--ink-faint)); margin: 0.4rem 0; }
.records-error { color: rgb(var(--danger)); font-size: 0.86rem; display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.table-more { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.8rem; margin: -0.4rem 0 1rem; }
.table-more .btn { padding: 0.3rem 0.7rem; font-size: 0.68rem; }

/* ---- one "Source" per row, the rest behind a small menu */
th.src-col { width: 1%; }
td.src-cell { white-space: nowrap; min-width: 0; width: 1%; }
.src-compact { display: inline-flex; align-items: center; gap: 0.3rem; position: relative; }
.src-primary {
  font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.68rem; letter-spacing: 0.04em; text-decoration: none; white-space: nowrap;
  color: rgb(var(--drafting)); border-bottom: 1px solid rgb(var(--drafting) / 0.45); padding: 0.05rem 0;
}
.src-primary::after { content: "\00a0\2197"; font-size: 0.85em; }
.src-primary:hover { color: rgb(var(--brass-lit)); border-bottom-color: currentColor; }
.src-more { position: relative; display: inline-block; }
.src-more > summary {
  list-style: none; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
  min-width: 1.6rem; height: 1.3rem; padding: 0 0.3rem; border: 1px solid rgb(var(--rule)); border-radius: 3px;
  font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.7rem; line-height: 1; color: rgb(var(--ink-muted)); letter-spacing: 0.05em;
}
.src-more > summary::-webkit-details-marker { display: none; }
.src-more > summary:hover, .src-more[open] > summary { color: rgb(var(--ink)); border-color: rgb(var(--brass)); }
.src-menu {
  position: absolute; right: 0; top: calc(100% + 0.3rem); z-index: 15; min-width: 15rem; max-width: min(22rem, 80vw);
  display: flex; flex-direction: column; gap: 0.15rem; padding: 0.45rem;
  background: rgb(var(--raised)); border: 1px solid rgb(var(--slip-edge)); border-radius: 0.4rem;
  box-shadow: 0 8px 24px rgb(0 0 0 / 0.35); white-space: normal;
}
.src-menu-link {
  display: block; font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.7rem; line-height: 1.35; padding: 0.3rem 0.4rem; border-radius: 3px;
  color: rgb(var(--drafting)); text-decoration: none;
}
.src-menu-link::after { content: "\00a0\2197"; font-size: 0.85em; }
.src-menu-link:hover, .src-menu-link:focus-visible { background: rgb(var(--drafting) / 0.12); }
.src-menu .copy-wrap {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.3rem; padding: 0.3rem 0.4rem 0.1rem;
  border-top: 1px dashed rgb(var(--rule-hair)); margin-top: 0.15rem;
}
.copy-label { font-family: var(--sans); font-size: 0.74rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); font-weight: 500;
}
tr.src-row td.src-cell { width: auto; }

/* ---- search page: how to use it */
.how-to {
  margin: 0 0 1rem; padding: 0.65rem 0.85rem; font-size: 0.9rem; line-height: 1.55; color: rgb(var(--ink-muted));
  background: rgb(var(--slip)); border: 1px solid rgb(var(--slip-edge)); border-left: 3px solid rgb(var(--brass)); border-radius: 0.45rem;
}
.how-to strong {
  font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none;
  color: rgb(var(--ink)); margin-right: 0.4rem; font-weight: 500;
}
.how-to code { font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.82rem; color: rgb(var(--ink)); white-space: nowrap; }

/* ---- footer: data sources + privacy */
.site-footer {
  max-width: var(--maxw); margin: 0 auto; padding: 1.25rem clamp(1rem, 3vw, 2rem) 2.5rem;
  border-top: 1px solid rgb(var(--rule-hair)); color: rgb(var(--ink-muted)); font-size: 0.8rem; line-height: 1.55;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.5rem 2rem;
}
.site-footer p { margin: 0; }
.site-footer strong {
  font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none;
  color: rgb(var(--ink)); font-weight: 500; margin-right: 0.35rem;
}

/* ---- keyboard: focus is always visible, including inside the aerial */
.aerial-stage:focus-visible { outline: 2px solid rgb(var(--focus)); outline-offset: -2px; }
details > summary:focus-visible { outline: 2px solid rgb(var(--focus)); outline-offset: 2px; border-radius: 3px; }
.signal-badge > a:focus-visible { outline-offset: -2px; }

@media (max-width: 900px) {
  .site-footer { grid-template-columns: 1fr; }
}

/* ---- phones: report bar is one line; record tables become stacked cards */
@media (max-width: 640px) {
  .toolbar { padding-top: 0.45rem; padding-bottom: 0.45rem; gap: 0.35rem; }
  .toc { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; gap: 0 1rem; padding-bottom: 0.1rem; -webkit-overflow-scrolling: touch; }
  .toc::-webkit-scrollbar { display: none; }
  .toc a { display: inline-block; padding: 0.25rem 0; font-family: var(--sans); font-weight: 500; font-size: 0.78rem;
}

  .records-table, .records-table tbody, .records-table tr, .records-table td, .records-table caption { display: block; width: 100%; }
  .records-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .records-table tr {
    border: 1px solid rgb(var(--rule-hair)); border-radius: 0.45rem; background: rgb(var(--raised));
    padding: 0.4rem 0.65rem 0.45rem; margin: 0 0 0.55rem;
  }
  /* A stacked cell is ONE block (label floated into the left padding), so a value with decoded terms
     (SWARMP, Cycle 9A ...) flows as a single left-aligned paragraph instead of one grid item per piece. */
  .records-table td {
    display: flow-root; padding: 0.2rem 0 0.2rem 7.2rem; border: 0; min-width: 0; width: 100%;
  }
  .records-table td::before {
    content: attr(data-label); float: left; width: 6.6rem; margin-left: -7.2rem; font-family: var(--sans); font-size: 0.74rem;
    letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); overflow-wrap: break-word; line-height: 1.6; font-weight: 500;
}
  .records-table td.src-cell { white-space: normal; border-top: 1px dashed rgb(var(--rule-hair)); margin-top: 0.2rem; padding-top: 0.4rem; }
  /* The source menu spans the record card instead of running off-screen. */
  .records-table tr { position: relative; }
  .records-table .src-compact, .records-table .src-more { position: static; }
  .records-table .src-menu { left: 0.5rem; right: 0.5rem; top: calc(100% - 0.6rem); min-width: 0; max-width: none; }
  .table-wrap { overflow-x: visible; }
  table.kv th { width: 40%; }
  .lightbox { padding: 0.5rem; max-width: 100vw; max-height: 100vh; width: 100vw; margin: 0; border-radius: 0; }
  .lightbox img { max-height: calc(100vh - 6rem); }
  .lightbox-close { top: 0.4rem; right: 0.4rem; min-width: 2.5rem; min-height: 2.5rem; justify-content: center; }
  .aerial-zoom button { width: 2.4rem; height: 2.4rem; }
  .aerial-ctl input[type="range"] { min-height: 2rem; }
}

/* ---- print: a clean report; every link shows where it goes */
@media print {
  .skip-link, .table-more, .src-more, .records-loading { display: none !important; }
  .src-primary { border: 0; color: inherit; }
  .src-primary::after { content: " " attr(href); font-size: 6.5pt; color: rgb(var(--ink-muted)); overflow-wrap: anywhere; word-break: break-all; }
  td.src-cell { white-space: normal; width: 22%; }
  .src-compact { display: inline; }
  a.fact-src[href]::after, .card-sources a.src-link::after, .link-out a::after, .then-credit a::after {
    content: " (" attr(href) ")"; font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 6.5pt; color: rgb(var(--ink-muted));
    overflow-wrap: anywhere; word-break: break-all; text-decoration: none;
  }
  .card-sources .sources-links { display: block; }
  .card-sources a.src-link { display: block; border: 0; padding: 0; white-space: normal; }
  .v-long { display: block; -webkit-line-clamp: unset; overflow: visible; }
  .records-table tr { break-inside: avoid; }
  .site-footer { border-top: 1px solid #999; padding: 0.5rem 0 0; }
  /* URLs are case-sensitive: never shown in the label's capitals/spacing. */
  a[href]::after { text-transform: none !important; letter-spacing: 0 !important; font-weight: 400; }
}
.print-now { padding: 0.25rem 0.6rem; font-size: 0.66rem; margin-left: 0.25rem; }

/* ---- light theme: link hover stays readable on paper (round 4) */
:root[data-theme='light'] a:hover,
:root[data-theme='light'] .src-primary:hover { color: rgb(var(--brass-text)); }

/* ======================================================= polish round 5 */

/* Open violations: one count per agency, each linked to its own records. */
.viol-fact dd { white-space: normal; }
.viol-fact .fact-sep { color: rgb(var(--ink-faint)); }

/* Printed report: At a glance links become numbered footnotes. */
.print-only { display: none; }
@media print {
  .print-only { display: revert; }
  /* The printed report footnotes its header links instead (round 5). */
  .page-report .hero a.fact-src[href]::after { content: ""; }
  sup.fn-ref { display: inline; font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 6.5pt; color: rgb(var(--ink-muted)); margin-left: 0.1em; }
  .report-notes { display: block; margin-top: 1rem; padding-top: 0.5rem; border-top: 1px solid #999; break-inside: auto; }
  .report-notes-list { margin: 0.3rem 0 0; padding-left: 1.6rem; font-size: 7.5pt; line-height: 1.45; }
  .report-notes-list li { padding: 0.05rem 0; }
  .note-url { font-family: var(--sans); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; word-break: break-all; }
}

/* ======================================== source-record page (/source/...) */
.page-source .page { max-width: 62rem; }
.source-head { margin-bottom: 1.1rem; }
.source-title { font-size: clamp(1.5rem, 3.4vw, 2.2rem); }
.source-filter { margin: 0.5rem 0 0; font-size: 0.95rem; overflow-wrap: anywhere; }
.source-filter strong { font-family: var(--sans); font-variant-numeric: tabular-nums; font-weight: 500; color: rgb(var(--ink)); }
.official-source { margin-bottom: 1.1rem; }
.official-list { margin: 0; display: grid; gap: 0.55rem; }
.official-row { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); gap: 0.2rem 0.9rem; align-items: baseline; }
.official-row dt { font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); font-weight: 500;
}
.official-row dd { margin: 0; display: flex; flex-wrap: wrap; gap: 0.35rem 0.5rem; align-items: baseline; min-width: 0; }
.official-source .src-link { font-size: 0.78rem; padding: 0.1rem 0.45rem; white-space: normal; }
.official-ids { display: inline-flex; flex-wrap: wrap; gap: 0.3rem 0.7rem; }
.official-ids .copy-id { font-size: 0.78rem; }
.source-count { margin: 0 0 0.9rem; }
.source-empty { margin: 1rem 0; }
.record-card { margin-bottom: 1rem; }
.record-card .card-head { flex-wrap: wrap; }
.record-headline { font-size: 0.85rem; color: rgb(var(--ink-muted)); }
.record-headline strong { font-family: var(--sans); font-variant-numeric: tabular-nums; font-weight: 600; color: rgb(var(--ink)); }
table.source-fields th { width: 38%; font-size: 0.8rem; }
table.source-fields td { font-size: 0.84rem; min-width: 0; }
table.source-fields td.v-empty { color: rgb(var(--ink-faint)); }
details.all-fields { margin-top: 0.4rem; }
details.all-fields > summary {
  cursor: pointer; list-style: none; font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em;
  text-transform: none; color: rgb(var(--ink-muted)); padding: 0.35rem 0; font-weight: 500;
}
details.all-fields > summary::-webkit-details-marker { display: none; }
details.all-fields > summary::before { content: "\25B8"; display: inline-block; margin-right: 0.45rem; transition: transform 0.12s; }
details.all-fields[open] > summary::before { transform: rotate(90deg); }
details.all-fields > summary:hover { color: rgb(var(--ink)); }
@media (max-width: 640px) {
  .official-row { grid-template-columns: 1fr; }
  table.source-fields th { width: 42%; }
}
@media print {
  details.all-fields { display: none; }
}


/* ============================================ audience views (2026-10-05) */
/* A second row in the top bar: multi-select chips (plain links) that choose
   which sections show. A focus tool, not a lock: switching is one click. */
.topbar.has-viewbar { flex-wrap: wrap; row-gap: 0.4rem; }
.view-bar {
  position: relative;   /* contains anything absolutely positioned inside the (scrolling) bar */
  flex: 1 1 100%; order: 99; min-width: 0;
  display: flex; align-items: center; flex-wrap: wrap; gap: 0.35rem 0.75rem;
}
.view-bar-label {
  font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none;
  color: rgb(var(--ink-muted)); flex: none; font-weight: 500;
}
.view-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center; flex: 0 1 auto; min-width: 0; }
.view-chip {
  display: inline-block; font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.72rem; letter-spacing: 0.04em;
  padding: 0.22rem 0.65rem; border: 1px solid rgb(var(--rule)); border-radius: 999px;
  color: rgb(var(--ink-muted)); background: rgb(var(--raised)); text-decoration: none; white-space: nowrap;
}
.view-chip:hover { border-color: rgb(var(--brass)); color: rgb(var(--ink)); }
.view-chip.is-on {
  border-color: rgb(var(--brass)); color: rgb(var(--ink)); background: rgb(var(--brass) / 0.18);
  font-weight: 600;
}
/* A check mark, not just colour, says which are on (decorative: aria-pressed says it). */
.view-chip.is-on::before { content: "\2713\00a0"; content: "\2713\00a0" / ""; color: rgb(var(--brass-text)); }
/* On, but adding nothing because another selected view already includes it: quieter tick, dashed edge. */
.view-chip.is-covered { color: rgb(var(--ink-muted)); background: rgb(var(--brass) / 0.07); border-style: dashed; font-weight: 500; }
.view-chip.is-covered::before { opacity: 0.45; }
.view-hidden-hero { display: none; margin: 0.35rem 0 0; }
.view-hidden { margin: 0 0 0 auto; font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.7rem; color: rgb(var(--ink-muted)); flex: none; }
.view-print-note { font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.78rem; color: rgb(var(--ink-muted)); margin: 0.4rem 0 0; }
.fact[hidden], .viol-fact [hidden], .glance-item[hidden] { display: none !important; }
@media (max-width: 640px) {
  /* one scrollable line of chips, so the sticky bar stays short */
  .view-bar { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .view-bar::-webkit-scrollbar { display: none; }
  .view-chips { flex-wrap: nowrap; flex: none; padding-right: 2rem; }   /* room to scroll the last chip clear of the fade */
  /* a soft fade on the right edge says there is more to scroll to (Architect, Owner, Everything); a mask, so nothing moves */
  .view-bar { -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 2.25rem), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 2.25rem), transparent); }
  /* the "N more hidden" note moves out of the scrolling chip row into the page header, where it can be read */
  .view-bar .view-hidden { display: none; }
  .view-hidden-hero { display: block; }
}
@media (max-width: 640px) {
  /* Street View caption: the "from Broad St, facing the building" hint takes its own line instead of a one-word-wide column */
  .map-hint { flex: 1 1 100%; order: 3; }
}
@media print {
  .view-print-note { color: #333; }
  .view-hidden-hero { display: none !important; }
}


/* ======================================================= polish round 6 */
/* Plain language: explainer bubbles on every label, titled links, less noise.
   Behaviour is in static/tips.js; the text is in app/glossary.py. */

/* ---- the label is the trigger: a plain word with a faint dotted underline.
   No "?" button, no fill, no border, no padding, no change of font, size or
   letter-spacing. It is a <span>, not a <button>, and the reset below makes sure no
   global button rule (the gold pill above) can ever reach it. Inline terms inside a
   sentence (HPD, DOB, ACRIS ...) are the same thing: they read as ordinary words. */
.tl, .tl:hover, .tl:focus, .tl:active {
  appearance: none; background: none; border: 0; border-radius: 0; box-shadow: none; margin: 0; padding: 0;
  font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; line-height: inherit;
  display: inline; white-space: inherit; gap: 0; min-width: 0; width: auto; height: auto;
  text-decoration-line: underline; text-decoration-style: dotted; text-decoration-thickness: 1px; text-underline-offset: 0.22em;
  text-decoration-color: rgb(var(--ink-muted));
  text-decoration-color: color-mix(in srgb, currentColor 68%, transparent);
  cursor: help; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none;
}
.tl:hover, .tl[aria-expanded="true"] { text-decoration-color: currentColor; }
/* iOS Safari only delivers a tap to a page-level click handler from an element it thinks is clickable: a pointer cursor says so
   (a mouse keeps the "help" cursor). */
@media (pointer: coarse) { .tl, .tl:hover { cursor: pointer; } .records-table td[data-tipped] { cursor: pointer; } }
.tl:focus-visible { outline: 2px solid rgb(var(--brass)); outline-offset: 2px; border-radius: 2px; }

/* ---- the one quiet hint under the address */
.tip-hint { display: flex; align-items: center; gap: 0.25rem; margin: 0.5rem 0 0; font: 400 0.8rem/1.4 var(--sans); letter-spacing: 0; text-transform: none; color: rgb(var(--ink-muted)); }
.tip-hint[hidden] { display: none; }
.tip-hint-x, .tip-hint-x:hover {
  appearance: none; background: none; border: 0; box-shadow: none; border-radius: 0.3rem; padding: 0.35rem 0.6rem; margin: 0 0 0 -0.2rem;
  font: 400 1.15rem/1 var(--sans); letter-spacing: 0; text-transform: none; color: rgb(var(--ink-muted)); cursor: pointer; display: inline-flex;
}
.tip-hint-x:hover { color: rgb(var(--ink)); }

/* ---- the bubble itself: fixed to the page, never clipped by a scrolling box */
.tip-bubble {
  position: fixed; z-index: 80; left: 0; top: 0; max-width: 20rem; box-sizing: border-box;
  padding: 0.7rem 0.85rem; background: rgb(var(--raised)); color: rgb(var(--ink));
  border: 1px solid rgb(var(--brass) / 0.75); border-radius: 0.55rem; box-shadow: 0 10px 30px rgb(0 0 0 / 0.4);
  font: 400 0.86rem/1.45 var(--sans); letter-spacing: 0; text-transform: none; white-space: normal; overflow-wrap: break-word;
}
.tip-bubble[hidden] { display: none; }
.tip-bubble-term { display: block; margin: 0 0 0.2rem; font-size: 0.8rem; font-weight: 600; color: rgb(var(--brass-lit)); }
:root[data-theme='light'] .tip-bubble-term { color: rgb(var(--brass-text)); }
.tip-bubble-term:empty { display: none; }
.tip-bubble::before {
  content: ""; position: absolute; left: var(--tip-arrow, 50%); width: 0.6rem; height: 0.6rem; box-sizing: border-box;
  background: rgb(var(--raised)); border: 1px solid rgb(var(--brass) / 0.75);
}
.tip-bubble.tip-below::before { top: -0.34rem; transform: translateX(-50%) rotate(45deg); border-right: 0; border-bottom: 0; }
.tip-bubble.tip-above::before { bottom: -0.34rem; transform: translateX(-50%) rotate(45deg); border-left: 0; border-top: 0; }

/* ---- header: one quiet line, then the two ids spelled out */
.hero-caseline { display: block; margin-bottom: 1.1rem; }
.breadcrumb { gap: 0.4rem 1.6rem; font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; font-family: var(--sans); font-weight: 500;
}
.id-item { display: inline-flex; align-items: baseline; flex-wrap: wrap; gap: 0 0.5rem; }
.id-label { font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); font-weight: 500;
}
.basics { margin: 1.5rem 0 0; }
.facts-head {
  margin: 0; font-family: var(--serif); font-size: 1.05rem; font-weight: 600; letter-spacing: 0; text-transform: none; color: rgb(var(--ink-muted));
}
.basics .facts-strip { margin-top: 0.5rem; }

/* ---- the report bar: the contents list and the buttons share one row (the progress now lives in the tally) */
.toolbar-actions { grid-column: 2; grid-row: 1; }
.toolbar .toc { grid-column: 1 / -1; grid-row: 2; }

/* ---- the report tally (round 7, 2026-10-06): back by request. A double-ruled stamp at the top right of the
   report: "SECTIONS LOADED / 12 / 34 / loading" with a bar filling along the bottom. When everything has
   settled it stays, quietly: no tilt, a single hairline, "complete". A section that could not load is never
   counted: the bar shows it in the danger colour and the last line names it. */
.tally {
  flex: none; display: flex; flex-direction: column; align-items: center; gap: 0.2rem;
  padding: 0.8rem 1.1rem 0.75rem; min-width: 10.5rem; box-sizing: border-box;
  border: 3px double rgb(var(--brass)); color: rgb(var(--brass-text));
  font-family: var(--mono); font-variant-numeric: tabular-nums; text-transform: uppercase; letter-spacing: 0.16em;
  transform: rotate(-2deg); transition: color 0.4s ease, border-color 0.4s ease, transform 0.4s ease;
}
/* The words are quiet sans like every other label ("Sections loaded", "loading", "complete"); only the count is mono. */
.tally-label, .tally-state { font-family: var(--sans); font-size: 0.78rem; font-weight: 500; text-transform: none; letter-spacing: 0.01em; text-align: center; }
.tally-count { font-family: var(--mono); font-size: 1.45rem; font-weight: 600; letter-spacing: 0.04em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tally-bar {
  align-self: stretch; display: flex; height: 6px; margin-top: 0.35rem; overflow: hidden; border-radius: 3px;
  background: rgb(var(--brass) / 0.25);
}
.tally-fill, .tally-gap { display: block; height: 100%; width: 0; transition: width 300ms ease-out; }
.tally-fill { background: rgb(var(--brass)); }
.tally-gap { background: rgb(var(--danger)); }
.tally.is-complete { transform: none; border: 1px solid rgb(var(--rule)); color: rgb(var(--ink-muted)); }
.tally.is-complete .tally-bar { background: rgb(var(--rule-hair)); }
.tally.is-complete .tally-fill { background: rgb(var(--success)); }
.tally.is-complete:not(.has-gaps) .tally-state { color: rgb(var(--success)); }
.tally.is-complete:not(.has-gaps) .tally-state::before { content: "\2713\00a0"; }
.tally.has-gaps .tally-state { color: rgb(var(--warning)); font-weight: 600; }
@media (max-width: 640px) {
  /* one compact row under the address, the bar full width beneath it: visible, and covering nothing */
  .tally { flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 0.2rem 0.6rem; transform: none; min-width: 0; align-self: stretch; padding: 0.6rem 0.8rem 0.65rem; }
  .tally-bar { flex: 1 0 100%; margin-top: 0.2rem; }
}

/* ---- a card's state pill: only while loading or when something is wrong */
button.status-pill, button.status-pill:hover {
  background: transparent; color: rgb(var(--ink-faint)); cursor: help; letter-spacing: 0.08em; font-size: 0.64rem;
  padding: 0.15rem 0.5rem; border-radius: 999px; border: 1px solid rgb(var(--rule));
}
.status-pill[hidden] { display: none; }

/* ---- the Source line and the titled, explained links under each card */
.card-sources { display: block; }
.source-line { display: flex; flex-wrap: wrap; align-items: center; gap: 0.2rem 0.5rem; margin: 0 0 0.3rem; font-family: var(--sans); font-size: 0.8rem; color: rgb(var(--ink-muted)); }
.source-line .tag { margin: 0; font-size: 0.62rem; }
.source-line .sources-text { flex: 0 1 auto; font-family: var(--sans); font-size: 0.8rem; }
.src-list { list-style: none; margin: 0.4rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 0.5rem 1.25rem; }
.src-list li { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.card-sources .sources-links { flex: none; }
.src-list .src-link, .official-link .src-link {
  display: inline; align-self: flex-start; font-family: var(--sans); font-size: 0.82rem; line-height: 1.35; letter-spacing: 0;
  padding: 0; border: 0; border-radius: 0; white-space: normal; text-decoration: underline; text-decoration-color: rgb(var(--drafting) / 0.5); text-underline-offset: 0.18em;
}
.src-list .src-link:hover, .official-link .src-link:hover { background: none; text-decoration-color: currentColor; }
.src-why { display: block; font-family: var(--sans); font-size: 0.76rem; line-height: 1.4; letter-spacing: 0; text-transform: none; font-weight: 400; color: rgb(var(--ink-muted)); white-space: normal; }
.src-menu-link { display: flex; flex-direction: column; gap: 0.1rem; }
.src-menu-link::after { content: none; }
.src-menu-title { font-size: 0.74rem; color: rgb(var(--drafting)); }
.src-menu-title::after { content: "\00a0\2197"; font-size: 0.85em; }
.src-menu .copy-wrap { flex-direction: row; }
.src-menu .copy-wrap .src-why { flex: 1 1 100%; }
.src-internal { font-style: italic; }
.official-list .src-why { display: inline; }
.official-link { display: inline-flex; flex-direction: column; gap: 0.1rem; margin-right: 1rem; }
.official-link .src-why { display: block; }
thead th { white-space: normal; font-family: var(--sans); font-weight: 500; font-size: 0.78rem;
}
.records-table thead th { white-space: nowrap; }
.empties-head .fine { margin-left: 0.5rem; }

/* ---- signals: each badge has its own "?" */
.signal-badge { display: flex; align-items: center; gap: 0.35rem; padding: 0 0.4rem 0 0; }
.signal-badge > a { flex: 1 1 auto; min-width: 0; padding-right: 0; }
.signal-badge:not(:has(a)) { padding-left: 0.6rem; }
.signal-badge:not(:has(a)) .signal-name { flex: 1 1 auto; }
.signal-badge > .signal-conf { flex: none; }
.signal-line { align-items: center; }
.signal-line .signal-conf { margin-left: auto; }

/* ---- record tables on a phone: the label column opens the column's explainer */
@media (max-width: 640px) {
  /* the header row is hidden: a row's own label stands in for it, and where the column has an explainer a tap on it opens it */
  .records-table td::before { content: attr(data-label); font-family: var(--sans); font-weight: 500; font-size: 0.74rem;
}
  .records-table td[data-tipped]::before { text-decoration: underline dotted; text-decoration-color: rgb(var(--ink-muted)); text-underline-offset: 0.22em; text-decoration-thickness: 1px; cursor: help; }
  .hero-caseline { margin-bottom: 0.9rem; }
  .id-item { flex: 1 1 100%; }
}

/* ---- print: bubbles and "?" buttons are screen-only; jargon prints as plain text */
@media print {
  .tip-bubble, .tip-hint { display: none !important; }
  .tl, .tl:hover { text-decoration: none; cursor: auto; }
  /* the tally prints as a plain line ("Sections loaded 34 / 34 complete"); the bar is screen-only */
  .tally { transform: none; border: 1px solid rgb(var(--rule)); color: rgb(var(--ink-muted)); padding: 0.4rem 0.8rem; min-width: 0; }
  .tally-bar { display: none; }
  .src-list { grid-template-columns: 1fr 1fr; }
  .src-why { font-size: 7.5pt; }
  .records-table td::before { content: attr(data-label); text-decoration: none; font-family: var(--sans); font-weight: 500; font-size: 0.74rem;
}
}

/* ---- round 6 fix: nothing in a record row may push the page wider than the screen */
.src-compact { flex-wrap: wrap; max-width: 100%; min-width: 0; }
.src-primary { white-space: normal; overflow-wrap: break-word; max-width: 100%; }
td.src-cell { min-width: 7.5rem; }
td[data-label="Detail"] .v-long { display: block; -webkit-line-clamp: unset; overflow: visible; }   /* a row's explanation is data: never clipped */
.src-menu-link, .src-menu .src-why { overflow-wrap: anywhere; }
@media (max-width: 640px) {
  .records-table, .records-table tbody, .records-table tr { max-width: 100%; }
  .records-table td.src-cell { min-width: 0; }
  .src-primary { overflow-wrap: anywhere; }
  .records-table .src-menu { max-width: calc(100vw - 2rem); }
  .table-wrap { max-width: 100%; }
}
@media print { .src-primary { white-space: normal; } }

/* ---- if the explanation text cannot be fetched the labels stop being underlined, and one line says so */
html.tips-failed .tl, html.tips-failed .tl:hover { text-decoration: none; cursor: inherit; }
html.tips-failed .records-table td[data-tipped]::before { text-decoration: none; cursor: inherit; }
.tips-note {
  margin: 0 0 1rem; padding: 0.5rem 0.8rem; font-size: 0.85rem; color: rgb(var(--ink-muted));
  border-left: 3px solid rgb(var(--warning)); background: rgb(var(--raised)); border-radius: 0.3rem;
}
@media print { .tips-note { display: none; } }

/* ======================================================= round 7: report search, sign-in banner */

/* ---- search this report: a box in the sticky report bar, results in a panel under it */
:root { --hit-bg: 240 200 90 / 0.30; --hit-ring: 221 188 124; }
:root[data-theme='light'] { --hit-bg: 235 190 60 / 0.38; --hit-ring: 154 122 56; }
@media (prefers-color-scheme: light) { :root:not([data-theme='dark']) { --hit-bg: 235 190 60 / 0.38; --hit-ring: 154 122 56; } }
.report-search { grid-column: 1; grid-row: 1; display: flex; align-items: center; gap: 0.7rem; min-width: 0; margin: 0; }
.report-search-label { font-family: var(--sans); font-size: 0.78rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); white-space: nowrap; font-weight: 500;
}
.report-search-box { position: relative; flex: 1 1 auto; min-width: 0; max-width: 36rem; }
.report-search-input { width: 100%; box-sizing: border-box; padding: 0.42rem 3.7rem 0.42rem 0.7rem; font-size: 0.9rem; }
.report-search-input::-webkit-search-cancel-button { display: none; }
.search-clear {
  position: absolute; right: 2.2rem; top: 50%; transform: translateY(-50%); width: 1.6rem; height: 1.6rem; padding: 0;
  display: inline-flex; align-items: center; justify-content: center; font-size: 1.15rem; line-height: 1; letter-spacing: 0;
  background: transparent; border: 0; color: rgb(var(--ink-muted)); border-radius: 999px;
}
.search-clear:hover { color: rgb(var(--ink)); background: rgb(var(--raised)); }
/* the magnifier INSIDE the box is the submit button: the search runs when it is pressed (or on Enter) */
.search-go {
  position: absolute; right: 0.2rem; top: 50%; transform: translateY(-50%); width: 1.9rem; height: 1.9rem; padding: 0;
  display: inline-flex; align-items: center; justify-content: center; letter-spacing: 0;
  background: transparent; border: 0; color: rgb(var(--ink-muted)); border-radius: 999px; cursor: pointer;
}
.search-go:hover, .search-go:focus-visible { color: rgb(var(--ink)); background: rgb(var(--raised)); }
.search-clear[hidden], .search-panel[hidden], .search-item[hidden] { display: none; }
.search-toggle {
  display: none; grid-column: 2; grid-row: 1; width: 2.1rem; height: 2.1rem; padding: 0; align-items: center; justify-content: center;
  background: transparent; border: 1px solid rgb(var(--rule)); color: rgb(var(--ink-muted)); border-radius: 999px;
}
.search-close-text { display: none; font-family: var(--sans); font-size: 0.74rem; letter-spacing: 0.03em; text-transform: none; font-weight: 500;
}
.search-toggle[aria-expanded="true"] { width: auto; padding: 0 0.7rem; }
.search-toggle[aria-expanded="true"] .ico-search { display: none; }
.search-toggle[aria-expanded="true"] .search-close-text { display: inline; }
.search-toggle:hover, .search-toggle[aria-expanded="true"] { background: rgb(var(--raised)); color: rgb(var(--ink)); border-color: rgb(var(--brass)); }
.search-panel {
  position: absolute; left: clamp(1rem, 3vw, 2rem); right: clamp(1rem, 3vw, 2rem); top: 100%; z-index: 40; margin-top: 0.35rem;
  max-height: min(32rem, calc(100vh - var(--sticky-h, 8rem) - 1.5rem)); overflow-y: auto; overscroll-behavior: contain;
  background: rgb(var(--raised)); border: 1px solid rgb(var(--rule)); border-radius: var(--radius);
  box-shadow: 0 14px 34px rgb(0 0 0 / 0.38); padding: 0.5rem 0.9rem 0.8rem;
}
.search-status { margin: 0.45rem 0 0.3rem; font-family: var(--sans); font-variant-numeric: tabular-nums; font-size: 0.78rem; letter-spacing: 0.04em; color: rgb(var(--ink)); }
.search-note-line { margin: 0.3rem 0; font-size: 0.82rem; color: rgb(var(--warning)); }
.search-group { padding: 0.55rem 0 0.2rem; border-top: 1px solid rgb(var(--rule-hair)); }
.search-group:first-child { border-top: 0; }
.search-group-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.2rem 0.8rem; margin: 0; font-size: 0.95rem; font-weight: 600; }
.search-group-title { font-family: var(--serif); font-size: 1.05rem; font-weight: 600; }
.search-group-count { font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.02em; color: rgb(var(--ink-muted)); white-space: nowrap; }
.search-group-sub { margin: 0.1rem 0 0.35rem; font-size: 0.76rem; color: rgb(var(--ink-muted)); }
.search-list { list-style: none; margin: 0; padding: 0; }
.search-hit-btn {
  display: block; width: 100%; text-align: left; text-transform: none; letter-spacing: 0; font-family: inherit; font-size: 0.9rem; white-space: normal;
  background: transparent; border: 1px solid transparent; border-radius: 0.4rem; padding: 0.4rem 0.55rem; color: rgb(var(--ink)); cursor: pointer;
}
.search-hit-btn:hover, .search-hit-btn:focus-visible { background: rgb(var(--slip)); border-color: rgb(var(--rule)); }
.hit-label { display: block; font-family: var(--sans); font-size: 0.74rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); font-weight: 500;
}
.hit-text { display: block; overflow-wrap: anywhere; }
.hit-context { display: block; margin-top: 0.1rem; font-size: 0.76rem; color: rgb(var(--ink-muted)); overflow-wrap: anywhere; }
.search-more { margin: 0.2rem 0 0.4rem 0.55rem; padding: 0.25rem 0.6rem; font-size: 0.68rem; }
mark.search-hit { background: rgb(var(--hit-bg)); color: inherit; border-radius: 2px; padding: 0 0.08em; box-shadow: 0 0 0 1px rgb(var(--hit-ring) / 0.45); }
.search-panel mark.search-hit { color: rgb(var(--ink)); }
.search-focus { outline: 2px solid rgb(var(--hit-ring)); outline-offset: 2px; background-color: rgb(var(--hit-bg)); border-radius: 0.3rem; animation: search-pulse 1.4s ease-out 1; }
tr.search-focus { outline-offset: -2px; }
@keyframes search-pulse { 0% { box-shadow: 0 0 0 0 rgb(var(--hit-ring) / 0.7); } 100% { box-shadow: 0 0 0 14px rgb(var(--hit-ring) / 0); } }
[data-row], tr[data-field], .card .lede, .numbers > div { scroll-margin-top: calc(var(--sticky-h, 9rem) + 1rem); }
.search-view-note {
  grid-column: 1 / -1; grid-row: 4; margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.8rem;
  font-size: 0.82rem; color: rgb(var(--ink-muted));
}
.search-view-note .btn { padding: 0.25rem 0.6rem; font-size: 0.66rem; }

@media (max-width: 640px) {
  /* the bar stays one line: the contents list, then a magnifier; the box replaces the list while open */
  .toolbar .toc { grid-column: 1; grid-row: 1; }
  .search-toggle { display: inline-flex; }
  .report-search { display: none; }
  .report-search-label { display: none; font-family: var(--sans); font-weight: 500; font-size: 0.78rem;
}
  .toolbar.search-open .report-search { display: flex; grid-column: 1; grid-row: 1; }
  .toolbar.search-open .toc { display: none; }
  .search-panel { left: 0.9rem; right: 0.9rem; max-height: calc(100vh - var(--sticky-h, 7rem) - 1rem); }
  .search-view-note { grid-row: 2; }
}

@media print {
  .report-search, .search-toggle, .search-panel, .search-view-note { display: none !important; }
  mark.search-hit { background: none; box-shadow: none; }
  .search-focus { outline: none; background: none; animation: none; }
}

/* ---- "Your sign-in has expired" (hosted mode, session.js): one calm bar at the bottom of the screen */
.session-banner {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.5rem 1rem;
  padding: 0.7rem clamp(1rem, 3vw, 2rem); background: rgb(var(--raised)); border-top: 2px solid rgb(var(--brass)); box-shadow: 0 -8px 24px rgb(0 0 0 / 0.3);
}
.session-banner p { margin: 0; font-size: 0.95rem; color: rgb(var(--ink)); }
.session-banner-btn { text-decoration: none; background: rgb(var(--brass)); color: rgb(20 22 27); border: 1px solid rgb(var(--brass)); font-weight: 600; }
.session-banner-btn:hover { color: rgb(20 22 27); background: rgb(var(--brass-lit)); }
body.has-session-banner { padding-bottom: 4.5rem; }
@media print { .session-banner { display: none !important; } body.has-session-banner { padding-bottom: 0; } }

/* ======================================================= contractors by trade (2026-10-06) */
/* "Contractors on this building": one row per trade, who holds the most recent permit, and the earlier holders. */
.contractors { margin: 0.9rem 0 1.1rem; padding: 0.75rem 0.9rem 0.3rem; border: 1px solid rgb(var(--rule)); border-left: 3px solid rgb(var(--brass)); border-radius: var(--radius); background: rgb(var(--slip)); scroll-margin-top: calc(var(--sticky-h, 9rem) + 0.75rem); }
.contractors-title { margin: 0 0 0.2rem; font-family: var(--serif); font-size: 1.15rem; font-weight: 600; }
.contractors-lede { margin: 0 0 0.6rem; font-size: 0.84rem; color: rgb(var(--ink-muted)); max-width: 62rem; }
.contractors .table-wrap { margin-bottom: 0.5rem; }
.contractors-table tbody.trade-group > tr:first-child td { border-bottom: 0; padding-top: 0.5rem; }
.contractors-table .trade-name { font-weight: 600; }
.contractors-table td { overflow-wrap: anywhere; }
.holder { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.holder-biz { font-weight: 600; overflow-wrap: anywhere; }
.holder-person, .holder-lic, .holder-phone { font-size: 0.78rem; color: rgb(var(--ink-muted)); overflow-wrap: anywhere; }
.ctr-since { display: block; font-size: 0.72rem; color: rgb(var(--ink-muted)); }
.ctr-status { font-family: var(--sans); font-size: 0.74rem; letter-spacing: 0.03em; text-transform: none; white-space: nowrap; font-weight: 500;
}
.ctr-current { color: rgb(var(--success)); }
.ctr-expired, .ctr-revoked { color: rgb(var(--warning)); }
.ctr-signed_off, .ctr-unknown { color: rgb(var(--ink-muted)); }
.contractors-table .earlier-row td { padding: 0 0 0.5rem; border-bottom: 1px solid rgb(var(--rule-hair)); }
.earlier > summary { cursor: pointer; font-size: 0.78rem; color: rgb(var(--ink-muted)); list-style: none; display: inline-flex; gap: 0.35rem; align-items: baseline; padding: 0.15rem 0; }
.earlier > summary::-webkit-details-marker { display: none; }
.earlier[open] > summary .chev { transform: rotate(90deg); }
.earlier-list { margin: 0.25rem 0 0.2rem 1.2rem; padding: 0; font-size: 0.8rem; }
.earlier-list li { margin: 0 0 0.3rem; overflow-wrap: anywhere; }
.earlier-list .holder-biz { font-weight: 600; }
.earlier-list .holder-person, .earlier-list .holder-lic { font-size: inherit; }
tr[data-contractor], li[data-contractor] { scroll-margin-top: calc(var(--sticky-h, 9rem) + 1rem); }
@media (max-width: 640px) {
  .contractors { padding: 0.6rem 0.65rem 0.2rem; }
  .contractors-table tbody.trade-group { display: block; margin: 0 0 0.6rem; }
  .contractors-table tbody.trade-group > tr:first-child { margin-bottom: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
  .contractors-table tbody.trade-group > tr:first-child td { padding-top: 0.2rem; }
  .contractors-table .earlier-row { margin: 0; border-top: 0; border-top-left-radius: 0; border-top-right-radius: 0; padding-top: 0.1rem; }
  .contractors-table .earlier-row td { display: block; padding: 0; border: 0; }
  .contractors-table .earlier-row td::before { content: none; }
  .earlier-list { margin-left: 1rem; }
  .holder { display: inline-flex; vertical-align: top; max-width: 100%; }
}
@media print {
  .contractors { break-inside: avoid; background: none; }
  .contractors-table tbody.trade-group { break-inside: avoid; }
  .earlier > summary .chev { display: none; }
}
.nw { white-space: nowrap; }
.holder-phone.nw, td.nw .holder-phone { white-space: nowrap; }


/* ================================================== red-team round (2026-10-06) */
/* Appended last on purpose: each block below replaces an earlier rule for the same thing. */

/* ---- Explanations: Full / Half / Off. Mode is written on <html data-explain> by theme.js before the first paint.
   Full: everything above. Half: only .tl-major labels keep their dotted underline (static/tips.js makes every other
   label inert). Off: none do. The labels then read as plain text. */
html[data-explain="off"] .tl, html[data-explain="off"] .tl:hover, html[data-explain="off"] .tl:focus,
html[data-explain="half"] .tl:not(.tl-major), html[data-explain="half"] .tl:not(.tl-major):hover, html[data-explain="half"] .tl:not(.tl-major):focus {
  text-decoration: none; cursor: inherit;
}
html[data-explain="off"] .records-table td[data-tipped]::before { text-decoration: none; cursor: inherit; }
html:not([data-explain="full"]) [data-tip-hint] { display: none !important; }
@media (max-width: 640px) {
  html[data-explain="half"] .records-table td[data-tipped]::before { text-decoration: none; cursor: inherit; }
}

/* ---- the Explanations control: a small segmented switch, beside the theme toggle */
.explain-ctl { display: inline-flex; align-items: center; gap: 0.4rem; flex: none; }
.explain-label { font-family: var(--sans); font-size: 0.74rem; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink-muted)); white-space: nowrap; font-weight: 500;
}
.explain-ctl button, .explain-ctl button:hover {
  appearance: none; background: transparent; color: rgb(var(--ink-muted)); border: 1px solid rgb(var(--rule)); border-radius: 0;
  padding: 0.2rem 0.55rem; margin: 0 0 0 -1px; font: 500 0.74rem/1.2 var(--sans); letter-spacing: 0.03em; text-transform: none; cursor: pointer; font-size: 0.74rem;
}
.explain-ctl button:first-of-type { margin-left: 0; border-radius: 999px 0 0 999px; padding-left: 0.7rem; }
.explain-ctl button:last-of-type { border-radius: 0 999px 999px 0; padding-right: 0.7rem; }
.explain-ctl button:hover { color: rgb(var(--ink)); background: rgb(var(--raised)); }
.explain-ctl button[aria-pressed="true"], .explain-ctl button[aria-pressed="true"]:hover {
  color: rgb(var(--ink)); background: rgb(var(--brass) / 0.2); border-color: rgb(var(--brass)); position: relative; z-index: 1; font-weight: 700;
}
.explain-ctl button:focus-visible { outline: 2px solid rgb(var(--focus)); outline-offset: 1px; z-index: 2; position: relative; }
.explain-foot, .explain-menu { display: none; }
.site-footer .explain-foot { margin: 0 0 0.9rem; }
.page-search .topbar .explain-top { margin-left: 0; }
.explain-label-short { display: none; }
/* Narrower than 1100 px the top bar keeps a SHORT label (a bare Full/Half/Off is not self-explanatory); the footer and phone
   switch have room for the whole word. */
@media (max-width: 1100px) { .explain-top .explain-label-long { display: none; } .explain-top .explain-label-short { display: inline; } }
@media (max-width: 640px) {
  .explain-top { display: none; }
  .explain-foot { display: inline-flex; }
  body.page-dossier .explain-foot { display: none; }
  .explain-menu { display: inline-flex; justify-content: center; margin-top: 0.15rem; }
  .explain-menu .explain-label, .explain-foot .explain-label { display: inline; }
}
@media print { .explain-ctl { display: none !important; } }

/* ---- lean sticky chrome (was 212 px of a 768 px laptop screen): the top bar is ONE row, the audience view chips
   scroll away with the page, and the report bar is ONE row (its contents list scrolls away too) */
.topbar { padding-top: 0.4rem; padding-bottom: 0.4rem; gap: 0.8rem; }
.topbar-search input { padding-top: 0.38rem; padding-bottom: 0.38rem; }
.topbar-search button { padding-top: 0.4rem; padding-bottom: 0.4rem; }
.view-bar {
  position: relative; order: 0; flex: none;
  padding: 0.5rem clamp(1rem, 3vw, 2rem); border-bottom: 1px solid rgb(var(--rule-hair));
  background: rgb(var(--sunken) / 0.5);
}
.toolbar { margin-top: 1.5rem; padding-top: 0.4rem; padding-bottom: 0.4rem; row-gap: 0.3rem; }
.toolbar .toolbar-actions .btn { padding: 0.3rem 0.6rem; }
.search-view-note { grid-row: auto; }
.toc-bar {
  margin: 0 calc(-1 * clamp(1rem, 3vw, 2rem)); padding: 0.55rem clamp(1rem, 3vw, 2rem) 0.6rem;
  border-bottom: 1px solid rgb(var(--rule-hair));
}
.toc { grid-column: auto; }
.actions-toggle {
  display: none; grid-column: 2; grid-row: 1; align-items: center; gap: 0.35rem; height: 2.1rem; padding: 0 0.8rem;
  background: transparent; color: rgb(var(--ink-muted)); border: 1px solid rgb(var(--rule)); border-radius: 0.4rem;
}
.actions-toggle:hover, .actions-toggle[aria-expanded="true"] { background: rgb(var(--raised)); color: rgb(var(--ink)); border-color: rgb(var(--brass)); }
.search-toggle-text { display: none; }
@media (max-width: 1100px) {
  .report-search-label { display: none; font-family: var(--sans); font-weight: 500; font-size: 0.78rem;
}
}
/* narrow screens (a phone, an iPad held upright): the report buttons and the Explanations switch fold into a
   "More" menu, so the search box has room (the 820 px squeeze) and a phone can reach the full printable report */
@media (max-width: 900px) {
  .actions-toggle { display: inline-flex; }
  .toolbar-actions { display: none; }
  .toolbar.actions-open .toolbar-actions {
    display: flex; flex-direction: column; align-items: stretch; gap: 0.45rem;
    grid-column: auto; grid-row: auto;   /* an absolutely placed grid item is sized from its grid AREA unless both are auto */
    position: absolute; top: 100%; right: clamp(1rem, 3vw, 2rem); width: min(21rem, calc(100% - 2 * clamp(1rem, 3vw, 2rem))); z-index: 45;
    margin-top: 0.3rem; padding: 0.7rem; background: rgb(var(--raised)); border: 1px solid rgb(var(--rule)); border-radius: var(--radius);
    box-shadow: 0 14px 34px rgb(0 0 0 / 0.38);
  }
  .toolbar-actions .btn { justify-content: center; width: 100%; padding: 0.55rem 0.8rem; font-size: 0.72rem; }
  .report-search-box { max-width: none; }
}
@media (max-width: 640px) {
  .toolbar { grid-template-columns: minmax(0, 1fr) auto; padding-top: 0.35rem; padding-bottom: 0.35rem; }
  .search-toggle {
    grid-column: 1; grid-row: 1; width: auto; height: 2.3rem; justify-self: stretch; justify-content: flex-start; gap: 0.55rem; padding: 0 0.8rem;
    border-radius: 0.5rem; font-family: var(--sans); font-size: 0.9rem; letter-spacing: 0; text-transform: none; display: inline-flex;
  }
  .search-toggle-text { display: inline; }
  .toolbar.search-open .search-toggle { grid-column: 2; justify-self: auto; padding: 0 0.7rem; }
  .toolbar.search-open .search-toggle-text { display: none; }
  .toolbar.search-open .actions-toggle { display: none; }
  .actions-toggle { height: 2.3rem; }
  .report-search { display: none; }
  .toolbar.search-open .report-search { display: flex; grid-column: 1; grid-row: 1; }
  .toc-bar .toc { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; gap: 0 1rem; -webkit-overflow-scrolling: touch; }
  .toc-bar .toc::-webkit-scrollbar { display: none; }
  .toc-bar { padding-top: 0.35rem; padding-bottom: 0.4rem; }
}
@media print { .toc-bar, .actions-toggle { display: none !important; } }

/* ---- "You searched: ..." under the report's title, and the match page's new messages */
.you-searched { margin: 0.6rem 0 0; font-size: 0.9rem; color: rgb(var(--ink-muted)); }
.you-searched[hidden] { display: none; }
.you-searched q { font-style: normal; color: rgb(var(--ink)); quotes: "\201C" "\201D"; }
.match-message.match-outside { color: rgb(var(--warning)); }
.did-you-mean { list-style: none; margin: 0.6rem 0 0.2rem; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.busy-note { color: rgb(var(--ink-muted)); font-style: italic; }

/* ---- "Now": nothing loads from Google until asked; a clean panel when it cannot, a shield so a phone can scroll */
.maps-note { grid-column: 1 / -1; margin: 0; font-size: 0.85rem; color: rgb(var(--ink-muted)); }
.map-stage { position: relative; height: 200px; background: rgb(var(--sunken)); overflow: hidden; }
.map-stage.is-loaded { height: clamp(240px, 32vw, 380px); }
.map-stage iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
.map-poster {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.4rem; padding: 1.2rem; text-align: center;
  background: rgb(var(--sunken));
}
.map-poster[hidden] { display: none; }
.map-poster-title { margin: 0; font-family: var(--sans); font-size: 0.78rem; font-weight: 500; letter-spacing: 0.03em; text-transform: none; color: rgb(var(--ink)); }
.map-poster-text { margin: 0; max-width: 24rem; font-size: 0.9rem; color: rgb(var(--ink-muted)); }
.map-load { margin-top: 0.35rem; }
.map-load:disabled { opacity: 0.5; cursor: default; }
.map-shield {
  position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; padding: 0; border: 0; border-radius: 0; background: transparent; cursor: pointer;
  display: flex; align-items: flex-end; justify-content: center; text-transform: none; letter-spacing: 0;
}
.map-shield:hover { background: transparent; }
.map-shield-hint[hidden] { display: none; }
.map-shield-hint {
  margin-bottom: 0.7rem; padding: 0.3rem 0.8rem; border-radius: 999px; font: 500 0.78rem/1.3 var(--sans); letter-spacing: 0;
  background: rgb(var(--ground) / 0.88); color: rgb(var(--ink)); border: 1px solid rgb(var(--rule));
}
.map-done, .map-done:hover { background: transparent; color: rgb(var(--ink-muted)); border: 1px solid rgb(var(--rule)); border-radius: 999px; padding: 0.15rem 0.6rem; font-size: 0.64rem; }
.map-done[hidden] { display: none; }
.map-frame figcaption a[hidden] { display: none; }
@media (max-width: 640px) { .map-stage.is-loaded { height: 240px; } }
@media print {
  .map-stage { height: auto; background: none; }
  .map-poster { position: static; padding: 0.3rem 0; background: none; align-items: flex-start; text-align: left; }
  .map-load, .maps-note, .map-done { display: none !important; }
}

/* ---- the match page's pictures: the City's own aerial tiles, never a Google frame */
.aerial-thumb { position: relative; min-height: 170px; border-radius: 0.4rem; overflow: hidden;
  background: repeating-linear-gradient(45deg, rgb(var(--sunken)), rgb(var(--sunken)) 8px, rgb(var(--raised)) 8px, rgb(var(--raised)) 16px); }
.aerial-thumb .thumb-tiles { position: absolute; left: 50%; top: 50%; width: 0; height: 0; }
.aerial-thumb .thumb-tiles img { position: absolute; display: block; max-width: none; width: 256px; height: 256px; }
.thumb-pin {
  position: absolute; left: 50%; top: 50%; width: 0.95rem; height: 0.95rem; margin: -0.475rem 0 0 -0.475rem; border-radius: 50%;
  border: 2px solid rgb(var(--brass-lit)); box-shadow: 0 0 0 2px rgb(0 0 0 / 0.5);
}
.thumb-cap { position: absolute; left: 0.4rem; bottom: 0.4rem; padding: 0.1rem 0.45rem; border-radius: 3px; font: 500 0.7rem/1.4 var(--sans); letter-spacing: 0.03em; background: rgb(0 0 0 / 0.6); color: #fff; }
@media print { .thumb-tiles { display: none; } }

/* ---- signal badges: the whole name shows, and the word says what it measures (confidence), not severity */
.signal-name { overflow: visible; text-overflow: clip; white-space: normal; overflow-wrap: anywhere; }
.signal-badge > a, .signal-badge:not(:has(a)) { flex-wrap: wrap; row-gap: 0.1rem; }
.signal-badge > a { align-items: baseline; }
.signal-conf { text-transform: none; letter-spacing: 0.02em; font-weight: 600; font-size: 0.7rem; white-space: nowrap; }
@media (max-width: 480px) { .signal-strip { grid-template-columns: minmax(0, 1fr); } }

/* ---- polish: the Street View caption keeps its aim on its own line (no orphaned "St"), and on a tablet all six view
   chips fit on one row */
.map-frame .map-hint { flex: 1 1 100%; order: 3; }
@media (max-width: 900px) and (min-width: 641px) {
  .view-bar { column-gap: 0.5rem; }
  .view-chips { gap: 0.3rem; }
  .view-chip { padding: 0.2rem 0.5rem; font-size: 0.68rem; letter-spacing: 0; }
}
.map-wait-note {
  position: absolute; z-index: 3; top: 0.5rem; left: 0.5rem; right: 0.5rem; width: fit-content; max-width: calc(100% - 1rem); pointer-events: none;
  padding: 0.3rem 0.7rem; border-radius: 0.5rem; font: 400 0.78rem/1.35 var(--sans); background: rgb(var(--ground) / 0.9); color: rgb(var(--ink)); border: 1px solid rgb(var(--rule));
}
@media print { .map-wait-note { display: none; } }

/* ---- digits and IDs line up in Geist Mono; every other table cell is Geist with tabular figures */
td[data-label*="date" i], td[data-label*="number" i], td[data-label*="bbl" i], td[data-label*="bin" i], td[data-label*="phone" i],
td[data-label*="license" i], td[data-label="Job"], td[data-label^="Issued"], td[data-label*="filing" i], td[data-label*="count" i],
td[data-label*="units" i], td[data-label*="amount" i], td[data-label*="cost" i], td[data-label*="fee" i], td[data-label*="area" i] {
  font-family: var(--mono); font-variant-numeric: tabular-nums;
}