/* megacard.css — dynamic /data/ Mega Card. Ported venue-page shim (identical to the retired venue_detail.html.j2) so the card matches the home/venue UX exactly, plus the search shell + new dossier sections. */
  /* Venue-page shim — every styling rule that is genuinely page-specific
     (the venue-page wrapper + the sectioned card stack). The home card /
     typography classes already handle font, color, padding, borders, etc.
     This shim only adds the layout glue the home stylesheet doesn't already
     provide for a single-page venue record. */
  .venue-page { max-width: 880px; margin: 0 auto; padding: var(--s-5) var(--s-4) var(--s-6); }
  .venue-page__crumb { font-size: var(--text-sm); color: var(--ink-muted); margin: 0 0 var(--s-3); }
  .venue-page__crumb a { color: var(--ink-2); text-decoration: none; }
  .venue-page__crumb a:hover { text-decoration: underline; }

  .venue-page__name { font-family: var(--font-display, var(--font-body)); font-size: 1.9rem; font-weight: 800; line-height: 1.15; margin: 0 0 var(--s-1); color: var(--ink); }
  .venue-page__loc { color: var(--ink-muted); margin: 0 0 var(--s-4); }

  .venue-page__stack { display: grid; gap: var(--s-4); }
  .venue-page__stack > .card { display: block; }

  /* Card section headings — the home typography already styles <h2>, but
     on a venue page we want a sectioned card, not the page-level h2. Use
     a card__title class for the consistent look-and-feel. */
  .card__title {
    font-family: var(--font-display, var(--font-body));
    font-size: 1.05rem;
    font-weight: 800;
    margin: 0 0 var(--s-3);
    color: var(--ink);
    letter-spacing: 0.01em;
  }

  /* Score header — large number + tier badge + percentiles inline. */
  .venue-page__score {
    display: flex; align-items: baseline; gap: var(--s-3); flex-wrap: wrap;
    padding: var(--s-3); border: 1px solid var(--rule); border-radius: 8px;
    background: var(--paper-2); margin: 0 0 var(--s-3);
  }
  .venue-page__score-num { font-size: 2.4rem; font-weight: 800; color: var(--ink); line-height: 1; }
  .venue-page__score-tier {
    display: inline-block; padding: 3px 10px; border-radius: 999px;
    font-size: var(--text-sm); font-weight: 800; letter-spacing: 0.04em;
    text-transform: uppercase; background: var(--paper); color: var(--ink);
    border: 2px solid currentColor;
  }
  .venue-page__score-tier--clean    { color: #166534; }
  .venue-page__score-tier--routine  { color: #854d0e; }
  .venue-page__score-tier--heavy    { color: #b45309; }
  .venue-page__score-tier--severe   { color: #b91c1c; }
  .venue-page__score-tier--emergency{ color: #7f1d1d; }
  .venue-page__score-legend { font-size: var(--text-sm); color: var(--ink-muted); margin: 0; }
  .venue-page__legend { font-size: var(--text-sm); color: var(--ink-muted); margin: 0 0 var(--s-3); }

  /* Identity grid (label : value rows). */
  .venue-page dl.idgrid { display: grid; grid-template-columns: 200px 1fr; gap: var(--s-1) var(--s-3); margin: 0; font-size: var(--text-sm); }
  .venue-page dl.idgrid dt { color: var(--ink-muted); font-weight: 600; }
  .venue-page dl.idgrid dd { margin: 0; color: var(--ink); }
  .venue-page dl.idgrid a { color: #1d4ed8; }

  /* Tables: home uses minimal horizontal rules + small font for compact
     records lists. The venue page reuses the same shape. */
  .venue-page table { width: 100%; border-collapse: collapse; font-size: var(--text-sm); margin: 0; }
  .venue-page th, .venue-page td { text-align: left; padding: var(--s-2) var(--s-2); border-bottom: 1px solid var(--rule); vertical-align: top; }
  .venue-page thead th { color: var(--ink-muted); font-weight: 700; font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.06em; }
  .venue-page tbody tr:last-child td { border-bottom: 0; }
  .venue-page .src { color: #1d4ed8; }
  .venue-page .src a { color: #1d4ed8; }

  /* Disposition-colored inspection row — preserves the existing convention. */
  .venue-page .ins--bad td:nth-child(3) { color: #991b1b; font-weight: 600; }
  .venue-page .ins--ok td:nth-child(3) { color: #166534; }

  /* Note lines — small muted explanatory paragraphs. */
  .venue-page .note { font-size: var(--text-sm); color: var(--ink-muted); margin: var(--s-2) 0 0; line-height: 1.4; }

  /* Status pills (DBPR Active/Inactive) — match the home dimension-badge
     shape (rounded pill, color-keyed). */
  .venue-page__status {
    display: inline-block; padding: 2px 10px; border-radius: 999px;
    font-size: var(--text-xs); font-weight: 700; letter-spacing: 0.04em;
    text-transform: uppercase; background: var(--paper); color: var(--ink);
    border: 1.5px solid currentColor;
  }
  .venue-page__status--active   { color: #166534; }
  .venue-page__status--inactive { color: #991b1b; }

  /* Owner-dossier mini-rap-sheet table — tighter font, distinct row. */
  .venue-page__dossier-rows th, .venue-page__dossier-rows td { padding: var(--s-1) var(--s-2); font-size: var(--text-sm); }
  .venue-page__dossier-rows thead th { color: var(--ink-muted); font-weight: 700; font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.06em; }

  /* News / social mentions list — tight, link-forward. */
  .venue-page__news { margin: 0; padding-left: var(--s-4); }
  .venue-page__news li { margin: 0 0 var(--s-2); }
  .venue-page__news-date { color: var(--ink-muted); font-size: var(--text-sm); }
  .venue-page__news-summary { color: var(--ink-2); font-size: var(--text-sm); margin-top: 2px; }

  /* Footer-like note at the bottom of the page (above the home footer). */
  .venue-page__footnoted { font-size: var(--text-sm); color: var(--ink-muted); margin: var(--s-4) 0 0; line-height: 1.4; }

/* ---- dynamic /data/ search shell (adds to the venue-page shim above) ---- */
.data-search { max-width: 880px; margin: 0 auto; padding: var(--s-5, 2rem) var(--s-4, 1rem) var(--s-3, .75rem); }
.data-search__hero { text-align: center; margin: 0 0 var(--s-3, 1rem); }
.data-search__hero h1 {
  font-family: var(--font-display, var(--font-body)); font-size: clamp(1.7rem, 4vw, 2.6rem);
  font-weight: 800; margin: 0 0 var(--s-1, .4rem); color: var(--red, #A11515);
}
.data-search__hero p { color: var(--ink-muted, #4b5563); margin: 0 auto; max-width: 42rem; }
.data-search__box {
  position: relative; display: grid; grid-template-columns: minmax(12rem, 16rem) minmax(0, 1fr);
  gap: .65rem; align-items: end; max-width: 52rem; margin: var(--s-3, 1rem) auto 0;
}
.data-search__metro { margin: 0; }
.data-search__metro select { min-height: 48px; }
.data-search__box input[type="search"] {
  width: 100%; font: inherit; font-size: 1.1rem; padding: .85rem 1rem;
  border: 2px solid var(--red, #A11515); border-radius: 12px; box-sizing: border-box;
  background: var(--paper, #fff); color: var(--ink, #111);
}
.data-search__box input[type="search"]:focus { outline: 3px solid rgba(161,21,21,.25); }
.data-search__hint { text-align: center; color: var(--ink-muted, #6b7280); font-size: var(--text-sm, .85rem); margin-top: .5rem; }
@media (max-width: 640px) {
  .data-search__box { grid-template-columns: 1fr; }
}
#megacard { }
#megacard .venue-page { padding-top: var(--s-4, 1.5rem); }

/* new full-fidelity dossier sections — inherit the home .card/table styling;
   only the tally emphasis is bespoke. */
.emergency-tally, .rdar-tally { font-size: 1.05rem; margin: 0 0 var(--s-2, .7rem); }
.emergency-tally strong, .rdar-tally strong { color: var(--red, #A11515); }
.chronic-signals { margin: 0 0 var(--s-2, .5rem) 1.1rem; }
.violation-codes { margin: .3rem 0 .3rem 1rem; padding: 0; font-size: var(--text-sm, .85rem); color: var(--ink-2, #4b5563); }
.ins-detail td { background: var(--paper-2, #fafafa); }
.mc-empty, .mc-loading { text-align: center; color: var(--ink-muted, #6b7280); padding: 2rem; }
.mentions { margin: 0 0 0 1.1rem; }
.mention-date { color: var(--ink-muted, #9ca3af); font-size: var(--text-sm, .85rem); }

/* wide tables scroll inside their card, never the page */
#megacard .card { overflow-x: auto; }
@media (max-width: 640px) {
  .data-search { padding-left: 16px; padding-right: 16px; }
  .data-search__box input[type="search"] { min-height: 48px; }
  .reveal-search__row { min-height: 48px; box-sizing: border-box; }
  #megacard .venue-page { padding-left: 0; padding-right: 0; }
  #megacard .card {
    overscroll-behavior-inline: contain;
    scrollbar-gutter: stable;
    -webkit-overflow-scrolling: touch;
  }
  #megacard .card:has(table)::after {
    content: "Swipe table sideways to see more →";
    display: block;
    position: sticky;
    left: 0;
    width: fit-content;
    padding: .35rem 0 .1rem;
    color: var(--ink-muted, #6b7280);
    font-size: .78rem;
    font-weight: 700;
  }
  #megacard table { min-width: 36rem; font-size: .88rem; }
}

/* Lifetime severity history -- ported verbatim from styles.css's
   .worsts-spark* (the Alerts/Caution dimension-card visualization),
   operator directive 2026-07-25: same style everywhere. */
.worsts-spark {
  margin: .5rem 0 .8rem;
  padding: .35rem .6rem;
  background: rgba(255, 87, 34, 0.04);
  border-left: 3px solid #ff5722;
  border-radius: 2px;
}
.worsts-spark__chart-wrap { position: relative; width: 100%; max-width: 264px; margin: 0 0 4px; }
.worsts-spark__svg { display: block; width: 100%; max-width: 264px; height: 36px; margin: 0 0 4px; }
.worsts-spark__year-axis {
  position: relative; width: 100%; height: 12px; margin-top: 1px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 9px; font-weight: 700; color: var(--ink-muted, #6b7280);
}
.worsts-spark__year-tick { position: absolute; top: 0; transform: translateX(-50%); white-space: nowrap; line-height: 1; }
.worsts-spark__endpoints {
  display: flex; justify-content: space-between; margin-top: 2px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .66rem; font-weight: 800; color: var(--ink, #111);
}
.worsts-spark__endpoint--start { text-align: left; }
.worsts-spark__endpoint--end { text-align: right; }
.worsts-spark__summary { margin: 0; font-size: .82rem; font-weight: 700; line-height: 1.25; color: var(--ink, #111); }
.worsts-spark__summary--chronic    { color: #8B1818; }
.worsts-spark__summary--climbing   { color: #dc2626; }
.worsts-spark__summary--collapsing { color: #ff5722; }
.worsts-spark__summary--persistent { color: #6B5B4E; }
.worsts-spark__caption { margin: 2px 0 0; font-size: .66rem; font-style: italic; color: var(--ink-muted, #6b7280); letter-spacing: .02em; }

/* per-owner admin-complaint badges (current owner + each prior era) */
.venue-page__badges { margin: .4rem 0 0; }
.mc-badge { display: inline-block; font-size: var(--text-sm, .85rem); font-weight: 600;
  padding: .15rem .55rem; border-radius: 999px; }
.mc-badge--admin-complaint { background: #fef2f2; color: #A11515; border: 1px solid #f3c6c6; }
/* High Volume (operator 2026-08-13): a single inspection large enough to reach
   Alerts although DBPR left the venue OPEN. Deliberately shares the
   admin-complaint red rather than inventing a louder colour — it sits beside
   emergency-order cards and must not out-shout an actual closure. */
.mc-badge--high-volume { background: #fef2f2; color: #A11515; border: 1px solid #e6a2a2;
  margin-right: .35rem; }
/* Chronic Pests (operator 2026-08-13): a rate above the ordinary, not a
   closure and not an official finding. Amber rather than the closure red —
   it must read as serious without impersonating an emergency order. */
.mc-badge--chronic-pests { background: #fffbeb; color: #92400E; border: 1px solid #e5c07b;
  margin-right: .35rem; }
/* Closure evidence tiers (operator 2026-08-13). Differentiated by KIND, not
   severity: a concept ending and a relocation are not lesser closures, they
   are different facts. Only the ended/closed tiers take the closure red. */
.mc-badge--closure-tier { border: 1px solid currentColor; margin-right: .35rem; }
.mc-badge--tier-corroborated-closure,
.mc-badge--tier-location-closed { background: #fef2f2; color: #A11515; }
.mc-badge--tier-concept-ended   { background: #eef2ff; color: #3730A3; }
.mc-badge--tier-succeeded-closure { background: #f0f9ff; color: #075985; }
.mc-badge--tier-relocated       { background: #f0fdf4; color: #166534; }

/* Cleanliness medal + alcohol licence. Each carries its own WORD beside the
   glyph, so neither depends on colour or on the reader knowing what a trophy
   means. Metal tones are muted deliberately -- these sit above a score header
   that should stay the loudest thing on the page. */
.mc-badge--medal, .mc-badge--alcohol { border: 1px solid currentColor; margin-right: .35rem; }
.mc-badge--platinum { background: #EDF2F7; color: #4A5568; }
.mc-badge--gold     { background: #FEFCE8; color: #8A6D1F; }
.mc-badge--silver   { background: #F4F6F8; color: #5A6472; }
.mc-badge--bronze   { background: #FDF6EC; color: #8A5A2B; }
.mc-badge--alcohol  { background: #F6F3FB; color: #5B4B7A; }
/* A revoked licence is a different statement from a held one and must never
   read as an endorsement. */
.mc-badge--revoked  { background: #FDF0F0; color: #8A2B2B; }

/* ---- Maximum Enforcement -------------------------------------------------
   Leads the dossier stack, so it needs to read as a heavier statement than the
   sections under it WITHOUT becoming a banner: the claim is quantitative and
   the numbers are the point. Deep maroon rule + tinted ground, both already in
   the palette for the chronic register, so this stays inside the existing
   visual language rather than inventing an alarm colour. */
.venue-page__stack > .card[aria-label="Maximum Enforcement"] {
  border-left: 4px solid var(--red-deep);
  background: var(--red-bg);
  padding-left: var(--s-3);
}
.maxenf__claim { margin: 0 0 var(--s-3); color: var(--ink); line-height: 1.4; }
.maxenf__ledger { width: 100%; border-collapse: collapse; }
.maxenf__ledger th,
.maxenf__ledger td {
  text-align: left; padding: var(--s-1) 0;
  border-bottom: 1px solid var(--rule); font-size: var(--text-sm);
}
.maxenf__ledger th { font-weight: 600; color: var(--ink-2); }
/* Counts and dates line up as a column, so they get tabular figures. */
.maxenf__ledger td { color: var(--ink); font-variant-numeric: tabular-nums; }
.maxenf__ledger tr:last-child th,
.maxenf__ledger tr:last-child td { border-bottom: 0; }