/* Detail pages (WP13B): entity History Wall, appearance transcript, word, sports.
   WP12 tokens only (static/css/parrot.css); no new colours. Tables show every row at full height and the page
   scrolls: column headers stick under the site nav. Only narrow screens, where a table is wider than the page,
   scroll the table sideways (and there the header row scrolls with the page). */

:root { --nav-h: 65px; }                         /* .site-h: 64 px + its 1 px border */

/* ---------- full-height walls, sticky headers under the nav ---------- */
.tbl-wrap.flat { overflow: visible; }
/* a wall scrolls sideways inside its card unless it fits (detail.js sets .fits on load, resize and the Markets
   toggle); a wall that fits shows full height with its header row sticky under the nav. Without JS: the safe one. */
.tbl-wrap.wall { overflow-x: auto; }
.tbl-wrap.wall.fits { overflow: visible; }
.wall .wt thead th { position: sticky; top: 0; }
.wall.fits .wt thead th { top: var(--nav-h); }
.wall .wt thead th:first-child { border-top-left-radius: var(--r-lg); }
.wall .wt thead th:last-child { border-top-right-radius: var(--r-lg); }
.wall .wt thead th.q a.qh { color: inherit; text-decoration: none; }
.wall .wt thead th.q a.qh:hover { text-decoration: underline; }
.wall .wt td.hc { width: 46px; }
.wall .wt .wcol .wname[data-dialog] { cursor: pointer; }
@media (max-width: 1100px) {
  /* only a wall that does not fit scrolls sideways (and its header row then scrolls with it); one that fits keeps
     full height with its header sticky under the nav (A11Y-12) */
  .tbl-wrap.wall:not(.fits) { overflow-x: auto; }
  .wall:not(.fits) .wt thead th { top: 0; }
}
/* walls fit at >= 1024 px (DES-10): under 1280 px, and whenever the Markets layer adds its column, the Trend and
   Scripted columns step aside (their numbers are on each word's page) and the market cell shows the price only */
@media (max-width: 1279px) { .wall .c-trend, .wall .c-scr { display: none; } }
.show-mkt .wall .c-trend, .show-mkt .wall .c-scr { display: none; }
.wall .mkt-c .pxv { display: none; }
.wall .wt thead th.q { padding: 0 3px; white-space: nowrap; }
.wall .wt thead th.q span { line-height: 1.15; }
@media (max-height: 500px) { .wall .wt thead th { top: 0; } }

/* ---------- plain data tables (record, history, markets) ---------- */
table.dt { border-collapse: separate; border-spacing: 0; width: 100%; font-size: 14px; }
.dt th, .dt td { padding: 9px 12px; text-align: left; vertical-align: middle; border-bottom: 1px solid var(--line); }
.dt thead th {
  position: sticky; top: var(--nav-h); z-index: 2; background: var(--surface);
  font-size: 11px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--muted);
}
.dt thead th:first-child { border-top-left-radius: var(--r-lg); }
.dt thead th:last-child { border-top-right-radius: var(--r-lg); }
.dt tbody tr:last-child > * { border-bottom: 0; }
.dt tbody tr:hover > * { background: var(--surface-2); }
.dt .ra { text-align: right; }
.dt .nowrap, .nowrap { white-space: nowrap; }
.dt .ap-title { display: block; font-size: 12.5px; margin-top: 2px; max-width: 46ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dt .w a, .dt .w span.wname { font-weight: 600; }
@media (max-width: 720px) {
  .tbl-wrap.flat { overflow-x: auto; }
  .dt thead th { top: 0; position: static; }
  .dt th, .dt td { padding: 8px; }
}

/* ---------- small type helpers ---------- */
.small { font-size: 13px; }
.lede { font-size: 15px; color: var(--ink-2); max-width: 75ch; }
.lede b { color: var(--ink); }
.pager { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.report { margin-top: 18px; font-size: 13px; color: var(--muted); }
.report a { color: var(--muted); }
.agent-line { display: flex; gap: 8px; align-items: flex-start; margin-top: 28px; font-size: 13px; color: var(--muted); overflow-wrap: anywhere; }
.agent-line svg { flex: none; margin-top: 3px; }
.agent-line a { color: var(--muted); }
.agent-line code { font-size: 12px; }
.section-h .sh-acts { margin-left: auto; display: inline-flex; gap: 8px; align-items: center; }
.res-y { color: var(--pos); font-weight: 600; }
.res-n { color: var(--ink-2); }
.ok { color: var(--pos); font-weight: 650; }
.bad { color: var(--neg); font-weight: 650; }
.px { font-weight: 650; color: var(--ink); }
.pxv { font-size: 12px; color: var(--muted); }
.mkt-note { margin: 8px 2px 0; font-size: 12px; color: var(--muted); }
.answer .facts div.mkt-only { display: none; }
.show-mkt .answer .facts div.mkt-only { display: flex; }

/* ---------- next occasion head ---------- */
.next-h { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 20px; padding: 12px 16px; margin-bottom: 12px; }
.next-h p { margin: 0; }
.nh-when { font-size: 16px; color: var(--ink); display: flex; align-items: center; gap: 8px; }
.nh-when .rel { font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--link); }
.nh-sub { font-size: 13px; color: var(--muted); margin-top: 2px !important; }
.nh-r { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.nh-scope { font-size: 13px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: flex-end; }
@media (max-width: 720px) { .nh-r { align-items: flex-start; } .nh-scope { justify-content: flex-start; } }

/* ---------- word page: answer first ---------- */
.answer { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px 24px; align-items: center; padding: 18px 20px; margin: 4px 0 8px; }
.answer .q { font: 600 22px/1.25 var(--font-head); margin: 0; }
.answer .q .w { color: var(--link); }
.answer .a { margin: 8px 0 0; font-size: 15px; color: var(--ink-2); max-width: 70ch; }
.answer .big { text-align: right; }
.answer .big .pv { display: block; font: 700 44px/1 var(--font-head); color: var(--ink); }
.answer .big .pv.na { font-size: 28px; color: var(--muted); }
.answer .big .pn { display: block; margin-top: 6px; font-size: 13px; color: var(--muted); }
.answer .big .pb { margin: 10px 0 0 auto; }
.answer .facts { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0; font-size: 14px; color: var(--muted); }
.answer .facts div { display: flex; gap: 6px; align-items: center; }
.answer .facts dt { font-weight: 400; }
.answer .facts dd { margin: 0; color: var(--ink); font-weight: 650; }
@media (max-width: 720px) {
  .answer { grid-template-columns: minmax(0, 1fr); padding: 16px; }
  .answer .big { text-align: left; }
  .answer .big .pb { margin-left: 0; }
  .answer.has-ap .big .pn:not(.pctx) { display: none; }   /* the p sentence above already names the source and n */
}
.faq dt { font-weight: 650; color: var(--ink); margin-top: 12px; }
.faq dd { margin: 4px 0 0; color: var(--ink-2); max-width: 75ch; }

/* ---------- word dialog fragment ---------- */
.wfrag .ev-head { padding-bottom: 8px; }
.wfrag .ev-panels { padding-top: 12px; }
.wfrag .ev-bar { justify-content: space-between; }
.ev-panel .none { margin: 0; font-size: 14px; color: var(--muted); }

/* ---------- appearance: header, people, transcript ---------- */
.people { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 16px; padding: 0; list-style: none; }
.src-line { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; font-size: 13px; color: var(--muted); margin-bottom: 12px; }
.src-line a { color: var(--muted); }
.tx-find { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 14px; padding: 8px; border-radius: var(--r); background: var(--surface); border: 1px solid var(--line); position: sticky; top: calc(var(--nav-h) + 8px); z-index: 5; }
.tx-find input { flex: 1; min-width: 160px; min-height: 34px; padding: 0 10px; border-radius: 8px; border: 1px solid var(--control-line); background: var(--bg); }
.tx-find .fx-n { font-size: 13px; color: var(--muted); min-width: 6ch; }
@media (max-width: 720px), (max-height: 500px) { .tx-find { position: static; } }
.tx { max-width: 78ch; }
.turn { margin: 0 0 18px; scroll-margin-top: calc(var(--nav-h) + 72px); }
.turn-h { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 4px; font-size: 13px; }
.turn-h .who { font-weight: 650; color: var(--ink); font-size: 14px; }
.turn-h .who a { color: inherit; text-decoration: none; }
.turn-h .who a:hover { text-decoration: underline; }
.turn-h .t { font: 12px var(--font-mono); color: var(--muted); text-decoration: none; }
.turn p { margin: 0 0 8px; font-size: 15.5px; line-height: 1.65; color: var(--ink-2); }
.turn .sec { margin: 22px 0 10px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
mark.fx { background: var(--mark-bg); }
mark.fx.cur { box-shadow: 0 0 0 2px var(--focus); }
.tx-parts { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 16px 0; font-size: 13px; color: var(--muted); }
.tx-parts a[aria-current] { font-weight: 700; color: var(--ink); }
.hits .quote { max-width: 78ch; }
.occ-list { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); margin: 0; padding: 0; list-style: none; }
.occ-list li { padding: 14px; }
.occ-list .ol-h { display: flex; gap: 10px; align-items: center; margin-bottom: 6px; }
.occ-list .ol-h a { font-weight: 650; }
.occ-list p { margin: 0; font-size: 13px; color: var(--muted); }

/* ---------- sports ---------- */
.game-h { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 12px 20px; padding: 18px 20px; margin: 6px 0 16px; }
.game-h .side { display: flex; align-items: center; gap: 12px; min-width: 0; }
.game-h .side.home { justify-content: flex-end; text-align: right; flex-direction: row-reverse; }
.game-h .side .nm { font: 600 20px/1.2 var(--font-head); }
.game-h .side .nm a { color: inherit; text-decoration: none; }
.game-h .side .nm a:hover { text-decoration: underline; }
.game-h .side .ab { display: block; font: 600 12px var(--font-mono); color: var(--muted); }
.game-h .mid { text-align: center; }
.game-h .score { font: 700 28px/1 var(--font-head); }
.game-h .vs { font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.game-h .meta { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px 14px; justify-content: center; font-size: 13px; color: var(--muted); margin: 0; }
@media (max-width: 720px) {
  .game-h { grid-template-columns: minmax(0, 1fr); text-align: left; }
  .game-h .side.home { flex-direction: row; justify-content: flex-start; text-align: left; }
  .game-h .mid { text-align: left; }
  .game-h .meta { justify-content: flex-start; }
}
.games-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.split-n { font-size: 12px; color: var(--muted); }
.diff-up { color: var(--pos); font-weight: 650; }
.diff-dn { color: var(--neg); font-weight: 650; }
.state-row { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; margin: 0 0 14px; }

/* ---------- pending transcript ---------- */
.pending-tx { margin: 0 0 12px; max-width: 78ch; }
ul.scopes { list-style: none; margin: 0 0 10px; padding: 0; gap: 6px 10px; }
ul.scopes li { display: inline-flex; align-items: center; gap: 6px; }
ul.mk-titles { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 4px; }
ul.mk-titles li { display: flex; align-items: center; gap: 8px; }
.latest-clip { max-width: 520px; margin: 0 0 18px; }

/* ---------- fixer pass (WP13B review) ---------- */
/* state pills wrap instead of pushing the page sideways at 320 px */
.state-row > *, .state-row .state { max-width: 100%; min-width: 0; }
.state-row .state { white-space: normal; height: auto; padding-top: 3px; padding-bottom: 3px; line-height: 1.35; }
/* a base-rate p (n = 0): muted, labelled 'prior' */
.prob.prior .pv { color: var(--muted); font-weight: 500; }
.prob.prior .pn, .answer .big .pn.pctx { font-style: normal; }
.answer .big .pn.pctx { margin-top: 2px; }
.pk { display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 99px; font-size: 10.5px; font-weight: 650;
      letter-spacing: .03em; color: var(--ink-2); background: var(--surface-3); vertical-align: middle; }
/* evidence: one notice when an entity has no transcripts; per-panel rule and counts */
.ev-note { display: flex; gap: 8px; align-items: flex-start; margin: 0 20px 12px; font-size: 13px; color: var(--muted); }
.ev-note svg { flex: none; margin-top: 3px; }
.ev-panel .ev-rule.small { margin: 0 0 8px; }
.ev-panel .ev-sum { margin: 0 0 10px; }
/* the strip keeps a compact label on narrow screens */
.strip .sc small.s { display: none; }
@media (max-width: 720px) {
  .ev-note { margin: 0 16px 10px; }
  .strip .sc small.l { display: none; }
  .strip .sc small.s { display: block; font: 9.5px/1 var(--font-mono); letter-spacing: -.02em; white-space: nowrap; overflow: hidden; max-width: 100%; }
}
.wall-note { margin: 0 0 10px; max-width: 90ch; }

/* ---------- launch review pass (lr/pages) ---------- */
/* probability cells: bar | number | label in fixed tracks, so bars line up down a column (DES-12) */
.wt .prob, .dt .prob { display: inline-grid; grid-template-columns: auto 3.1em 5.2em; align-items: center; gap: 0 6px; }
.wt .prob .pn, .dt .prob .pn { text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dt .prob.sm { grid-template-columns: auto 2.8em 4.6em; }
.prob.weak .pv { color: var(--muted); font-weight: 500; }
.bt-note { display: flex; gap: 8px; align-items: baseline; margin: 0 0 8px; }
.bt-note .pk { margin-left: 0; flex: none; }
/* honest QA labels */
.beta-note { display: flex; gap: 8px; align-items: baseline; margin: 0 0 12px; font-size: 13px; color: var(--muted); max-width: 90ch; }
.beta-note .badge { flex: none; }
.beta-note a { color: inherit; }
.cov-note { font-size: 12px; color: var(--muted); }
/* a window's known appearances */
ul.win-apps { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 4px; font-size: 14px; }
ul.win-apps li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
/* the word dialog: the close button sits in its own bar, so nothing scrolls under it (DES-18) */
.dlg .dlg-x { position: static; flex: none; align-self: flex-end; margin: 10px 12px 0 0; }
.dlg .ev-head { padding-top: 0; padding-right: 20px; }
.ev-head .ev-acts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
@media (max-width: 720px) {
  /* phones: the word column stays at the left, the probability at the right, and the wall opens on the latest
     appearances between them (detail.js scrolls there; DES-05) */
  .wall .wt .wcol { min-width: 112px; max-width: 132px; }
  .wall .wt .c-p { position: sticky; right: 0; z-index: 2; background: var(--surface); box-shadow: -1px 0 0 var(--line); padding-left: 6px; }
  .wall .wt thead th.c-p { z-index: 4; }
  .wall .wt .prob .pb { display: none; }
  .wall .wt .prob { grid-template-columns: 2.6em 4.2em; gap: 0 4px; }
}
.col-defs { margin: 6px 2px 0; font-size: 12.5px; color: var(--muted); }
.col-defs > summary { cursor: pointer; display: inline-flex; min-height: 24px; align-items: center; color: var(--link); }
.col-defs dl { margin: 6px 0 0; display: grid; gap: 4px; max-width: 90ch; }
.col-defs div { display: flex; gap: 8px; }
.col-defs dt { flex: none; min-width: 7em; font-weight: 650; color: var(--ink-2); }
.col-defs dd { margin: 0; }
.answer .other-l { margin: 8px 0 0; font-size: 13.5px; color: var(--muted); }
.ev-latest { margin: 0 0 18px; }
.ev-latest h3 { font-size: 14px; margin: 0 0 4px; }

/* ---------- T5: answer sentence and Cite line (word, entity, appearance pages) ---------- */
.answer .a + .a { margin-top: 6px; }
.answer .a2 { font-size: 14px; color: var(--muted); }
.cite { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: flex-start; margin: 28px 0 0; font-size: 13px; color: var(--muted); overflow-wrap: anywhere; }
.cite > svg { flex: none; margin-top: 3px; }
.cite > .btn { flex: none; margin-top: -3px; }
@media (max-width: 720px) { .cite > .btn { margin: 0 0 0 21px; } }
.cite > span { flex: 1 1 320px; min-width: 0; }
.cite b { color: var(--ink-2); font-weight: 650; margin-right: 4px; }
.cite .cite-t { user-select: all; }
.cite + .agent-line { margin-top: 10px; }
.answer .a .a-p { color: var(--muted); }
