/* CANDIDATE A2 — "ON A SHEET". A1 plus a real figure/ground boundary. The owner's
   choice, 2026-08-03.
   Generated from style.css by gen_styles.py — DO NOT EDIT THIS FILE. */

*, *::before, *::after { box-sizing: border-box; }   /* without this, figures overflow 320px */

:root{
  /* surfaces */
  --paper:#ffffff;
  --canvas:#f3f5f7;
  --slate:#28313A;          /* the existing page surround, retained */

  /* ink — ratios computed, all pass WCAG AA */
  --ink:#1d252c;            /* 15.52:1 on paper */
  --ink-soft:#5a6672;       /*  5.87:1 */
  --accent:#0f5f8c;         /*  6.92:1 on paper, 1.91:1 on slate -> separate focus colour */
  --accent-dark:#0b4a6e;    /*  9.46:1 */
  --rule:#dfe3e7;           /*  1.29:1 — DECORATIVE HAIRLINES ONLY, never a control border */
  --control:#848e99;        /*  3.33:1 — borders of real controls */
  --focus-slate:#9dc7ee;    /*  7.44:1 on slate */
  --tint:#eef4f8;

  --serif:"Charter","Iowan Old Style","Palatino Linotype","Book Antiqua",Georgia,
          "Times New Roman",serif;
  --sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;

  --f-2:.75rem; --f-1:.875rem; --f0:1.0625rem; --f1:1.25rem;
  --f2:1.5rem; --f3:1.875rem; --f4:2.125rem;

  --s1:.25rem; --s2:.5rem; --s3:.75rem; --s4:1rem;
  --s5:1.5rem; --s6:2rem; --s7:3rem; --s8:4rem;

  --shell:60rem;      /* 70rem left 104px of dead air beside a 36rem column */
  --measure:36rem;    /* 576px ~= 73 chars; today's real text box is 580px */
  --rail:15.5rem;
  --radius:4px;
}

html{ -webkit-text-size-adjust:100%; background:var(--canvas); }

body{
  margin:0;
  background:var(--canvas);
  color:var(--ink);
  font:var(--f0)/1.65 var(--serif);
  text-align:left;            /* was justify — the rivers are the most dated single thing */
  -webkit-font-smoothing:antialiased;
}

a{ color:var(--accent); text-decoration-thickness:1px; text-underline-offset:3px;
   text-decoration-color:rgba(15,95,140,.4); }
a:hover{ color:var(--accent-dark); text-decoration-color:currentColor; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; border-radius:2px; }
::selection{ background:#d7e6f0; }
img{ max-width:100%; height:auto; }

/* ---------------------------------------------------------------- masthead */
/* MEASURED: today the title is #28313A DARK on a LIGHT grey gradient (img01.jpg);
   the WHITE text is the MENU on a BLUE gradient (img02.jpg). Slate is the page
   surround, not a header band. Here the surround becomes a real masthead. */

#wrapper{ background:var(--slate); }
#logo{
  max-width:var(--shell); margin-inline:auto;
  padding:var(--s6) var(--s6) var(--s5);
}
#logo :focus-visible{ outline-color:var(--focus-slate); }

.masthead-home{
  display:inline-block; margin-bottom:var(--s3);
  font:600 var(--f-2)/1 var(--sans);
  letter-spacing:.08em; text-transform:uppercase;
  color:rgba(255,255,255,.72); text-decoration:none;
}
.masthead-home:hover{ color:#fff; text-decoration:underline; }

#logo h1{
  margin:0;
  font:400 clamp(1.6rem, 1.15rem + 1.7vw, 2.125rem)/1.14 var(--serif);
  color:#fff; letter-spacing:-.01em; text-wrap:balance; max-width:26ch;
}
#logo h1 a{ color:#fff; text-decoration:none; }
/* On the homepage and the two /notes/ pages the masthead line is BRANDING, not the page
   subject, so it is demoted to a <p> and the real content h1 stays the only h1. Styled
   identically -- this is a semantic change, not a visual one. */
#logo .site-name{
  margin:0;
  font:400 clamp(1.6rem, 1.15rem + 1.7vw, 2.125rem)/1.14 var(--serif);
  color:#fff; letter-spacing:-.01em; text-wrap:balance; max-width:26ch;
}
#logo .site-name a{ color:#fff; text-decoration:none; }
#logo h2{                                              /* the "» a meta-analysis" tagline */
  margin:var(--s2) 0 0;
  font:400 var(--f-1)/1.45 var(--sans);
  color:rgba(255,255,255,.66); letter-spacing:.01em;
}

/* -------------------------------------------------- artifact strip (#menu) */
/* On 51 pages #menu IS the file list (Paper, Data, Code...). Markup is FROZEN —
   the parser's non-greedy <div id="menu">(.*?)</div> capture must not be truncated —
   so this is pure CSS promotion. Badges are ::after pseudo-content: invisible to the
   parser, to verify_seo's text check, and to Common Crawl. */

#header{ background:var(--slate); }
#menu{
  max-width:var(--shell); margin-inline:auto;
  padding:0 var(--s6) var(--s6);
  background:none; height:auto;
}
#menu ul{ display:flex; flex-wrap:wrap; gap:var(--s2); margin:0; padding:0; list-style:none; }
#menu li{ margin:0; padding:0; background:none; }
#menu a{
  display:inline-flex; align-items:center; gap:var(--s2);
  min-height:2.25rem; padding:var(--s2) var(--s3);
  background:var(--paper); border:1px solid var(--control); border-radius:var(--radius);
  font:600 var(--f-1)/1 var(--sans);      /* 600 not 500: Windows has no Segoe UI Medium */
  color:var(--ink); text-decoration:none; text-transform:none;
}
#menu a:hover{ border-color:var(--accent); color:var(--accent); background:var(--tint); }
#menu a::after{
  font:400 var(--f-2)/1 var(--sans); letter-spacing:.06em;
  color:var(--ink-soft); border-left:1px solid var(--rule); padding-left:var(--s2);
}
#menu a[href$=".pdf"]::after{ content:"PDF"; }
#menu a[href$=".xlsx"]::after,#menu a[href$=".xls"]::after{ content:"XLSX"; }
#menu a[href$=".do"]::after{ content:"DO"; }
#menu a[href$=".zip"]::after{ content:"ZIP"; }
#menu a[href$=".csv"]::after{ content:"CSV"; }
#menu a[href$=".R"]::after,#menu a[href$=".r"]::after{ content:"R"; }
/* /maive/ carries FIVE current_page_item — any "current" styling would light up five
   arbitrary pills. Deliberately neutral. */
#menu li.current_page_item > a{ background:var(--paper); }

/* -------------------------------------------------------------- page shell */
#page{
  max-width:var(--shell); margin-inline:auto;
  padding:var(--s7) var(--s6) var(--s8);
  background:var(--canvas);
}
@media (min-width:64rem){
  #page{ display:grid; grid-template-columns:minmax(0,1fr) var(--rail); gap:var(--s8);
         align-items:start; }
}
/* the 55 trailing <div style="clear:both"> spacers must not become grid items */
#page > div[style]{ display:none; }

#content{ min-width:0; }
#content > .post > .entry{ max-width:var(--measure); }   /* prose ONLY — not the
     catalogue table, not the estimates list; constraining those makes them ragged */

/* --------------------------------------------------------------- headings */
#content h1.title{                 /* homepage / notes keep a real content h1 */
  margin:0 0 var(--s5);
  font:400 var(--f3)/1.2 var(--serif); color:var(--ink); text-wrap:balance;
}
#content h2.title{                 /* the demoted "Abstract" label */
  margin:0 0 var(--s4);
  font:600 var(--f-2)/1 var(--sans);
  text-transform:uppercase; letter-spacing:.07em; color:var(--ink-soft);
  padding-bottom:var(--s2); border-bottom:1px solid var(--rule);
}

/* ------------------------------------------------------------------ prose */
.entry p, .entry ul, .entry ol{ margin:0 0 var(--s4); line-height:1.65; text-align:left; }
/* NO lead-paragraph rule. On these pages the first <p> IS the whole abstract (eis: 708
   chars), so enlarging it squeezes the entire abstract to 59 chars/line. Found by
   rendering, not by reading. */
.entry a{ overflow-wrap:anywhere; }   /* long DOIs overflow 320px otherwise */

/* figures: measured 1100x800 shown at 400px — they have the resolution to fill the column */
.entry img{
  display:block; width:100%; margin:var(--s5) 0;
  background:var(--paper); padding:var(--s4);
  border:1px solid var(--rule); border-radius:var(--radius);
}
.entry figure{ margin:var(--s5) 0; max-width:var(--measure); }
.entry figure img{ margin:0; }
.entry figcaption{
  margin-top:var(--s2); font:400 var(--f-1)/1.5 var(--sans); color:var(--ink-soft);
}
/* eis-style captions sit INSIDE the machine abstract, so they stay as <p><b>…</b></p>.
   Bind them to the image visually instead of structurally. */
.entry p:has(+ img){ margin-bottom:0; font:400 var(--f-1)/1.5 var(--sans);
                     color:var(--ink-soft); }
.entry p:has(+ img) b{ font-weight:400; }
.entry p:has(+ img) + img{ margin-top:var(--s2); }

/* --------------------------------------------------- paper extras (new) */
.extras{ margin-top:var(--s7); max-width:var(--measure); }
.extra{ padding-top:var(--s5); border-top:1px solid var(--rule); margin-top:var(--s5); }
.extra:first-child{ margin-top:0; }
.extra h3{
  margin:0 0 var(--s3);
  font:600 var(--f-2)/1 var(--sans);
  text-transform:uppercase; letter-spacing:.07em; color:var(--ink-soft);
}
#headline-result p{
  margin:0; font:400 var(--f1)/1.55 var(--serif); color:var(--ink);
  border-left:3px solid var(--accent); padding-left:var(--s4);
}
#cite .ref{ margin:0 0 var(--s3); font-size:var(--f-1); color:var(--ink); }
#cite details{ font:var(--f-1)/1.5 var(--sans); }
#cite summary{ cursor:pointer; color:var(--accent); width:max-content; }
#cite pre{
  margin:var(--s3) 0 0; padding:var(--s4);
  background:var(--paper); border:1px solid var(--rule); border-radius:var(--radius);
  font:400 var(--f-2)/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  white-space:pre-wrap; overflow-wrap:anywhere; color:var(--ink);
}
#related ul{ margin:0; padding:0; list-style:none; }
#related li{ margin-bottom:var(--s2); font-size:var(--f-1); }

/* ---------------------------------------------------------------- sidebar */
#sidebar{ min-width:0; font:var(--f-1)/1.55 var(--sans); color:var(--ink-soft); }
#sidebar > ul{ margin:0; padding:0; list-style:none; }
#sidebar > ul > li{ margin-bottom:var(--s6); }
#sidebar h2{
  margin:0 0 var(--s3);
  font:600 var(--f-2)/1 var(--sans);
  text-transform:uppercase; letter-spacing:.07em; color:var(--ink-soft);
  padding-bottom:var(--s2); border-bottom:1px solid var(--rule);
}
#sidebar ul ul{ margin:0; padding:0; list-style:none; }
#sidebar ul ul li{ margin-bottom:var(--s2); }
#sidebar a{ overflow-wrap:anywhere; }
#sidebar form fieldset{ margin:0; padding:0; border:0; display:flex; gap:var(--s2); }
#sidebar input[type=text]{
  flex:1 1 auto; min-width:0; min-height:2.25rem; padding:var(--s2);
  font:var(--f-1) var(--sans); font-size:16px;      /* 16px: below it iOS zooms on focus */
  border:1px solid var(--control); border-radius:var(--radius); background:var(--paper);
  color:var(--ink);
}
#sidebar input[type=submit]{
  min-height:2.25rem; padding:0 var(--s3);
  font:600 var(--f-1) var(--sans); color:var(--paper); background:var(--accent);
  border:1px solid var(--accent); border-radius:var(--radius); cursor:pointer;
}
#sidebar input[type=submit]:hover{ background:var(--accent-dark); }

/* ---------------------------------------------------- homepage catalogue */
table.catalogue{ width:100%; border-collapse:collapse; table-layout:fixed; }
table.catalogue td{ width:50%; vertical-align:top; padding:0 var(--s6) var(--s5) 0; }
table.catalogue b{
  display:block; margin-bottom:var(--s3);
  font:600 var(--f-2)/1 var(--sans);
  text-transform:uppercase; letter-spacing:.07em; color:var(--ink-soft);
  padding-bottom:var(--s2); border-bottom:1px solid var(--rule);
}
table.catalogue ul{ margin:0 0 var(--s6); padding:0; list-style:none; }
table.catalogue li{ margin-bottom:var(--s2); font-size:var(--f-1); line-height:1.5; }

/* ------------------------------------------------ headline results block */
/* Structure is FROZEN: each <li> must stay ONE uninterrupted run of text nodes.
   Common Crawl keeps text and drops tags, and it holds only the homepage. */
.post.estimates{ margin-top:var(--s7); padding-top:var(--s6); border-top:1px solid var(--rule); }
.post.estimates .entry{ max-width:none; }
.post.estimates ul{ margin:0; padding:0; list-style:none; }
.post.estimates li{
  max-width:44rem; margin-bottom:var(--s4); line-height:1.7; font-size:.9375rem;
}
.post.estimates li > a:first-child{ font-weight:600; }

.meta{ margin-top:var(--s5); font:var(--f-1) var(--sans); color:var(--ink-soft); }

/* ------------------------------------------------------------------ phone */
@media (max-width:64rem){
  #logo, #menu, #page{ padding-left:var(--s4); padding-right:var(--s4); }
  #page{ padding-top:var(--s5); }
  #sidebar{ margin-top:var(--s7); padding-top:var(--s5); border-top:1px solid var(--rule); }
}
@media (max-width:40rem){
  /* 16px only on genuinely narrow screens. At 768px the column is still 576px, so
     dropping to 16px there RAISED chars/line to ~79. Measured, not assumed. */
  :root{ --f0:1rem; }
}
@media (max-width:48rem){
  #menu a::after{ display:none; }            /* 9 items would wrap to 4 rows with badges */
  table.catalogue, table.catalogue tbody, table.catalogue tr,
  table.catalogue td{ display:block; width:100%; padding-right:0; }
  .entry img{ padding:var(--s3); }
}

/* ------------------------------------------------------------------ print */
@media print{
  #sidebar, .masthead-home{ display:none; }
  /* #menu is NOT hidden — on 51 pages it is the file list, not navigation */
  #wrapper, #header, #menu{ background:none; }
  #logo h1, #logo h2, .masthead-home{ color:#000; }
  #menu a{ border:0; padding:0 var(--s3) 0 0; }
  #page{ display:block; max-width:none; padding:0; }
  body{ background:#fff; font-size:11pt; }
  a{ text-decoration:none; color:#000; }
}

/* ---- fixes found by auditing the rendered preview ------------------------- */

/* The homepage h2.title "Headline results from these papers" is a real SECTION
   heading, not the small "Abstract" label. Without this it renders as a 12px eyebrow. */
#content .post.estimates h2.title{   /* needs the #content prefix to beat
                                        '#content h2.title' on specificity */
  font:400 var(--f2)/1.25 var(--serif);
  text-transform:none; letter-spacing:normal; color:var(--ink);
  border-bottom:0; padding-bottom:0; margin-bottom:var(--s5);
}

/* The eyebrow duplicated ONLY on the homepage, where .site-name is also
   "meta-analysis.cz". It is now simply not emitted there (see build_preview.py), so no
   CSS rule is needed -- and /notes/, whose site-name is "Research notes", keeps its
   route back to the root. */

/* PHONE ORDER -- reinstated deliberately. PLAN.md ruled KEEP this: DOM order puts the 52
   estimate sentences before #sidebar, so without the reorder the homepage sidebar lands at
   ~11,700px (screen 14.4) instead of ~3,100px (screen 3.8). The WCAG C27 DOM-order debt is
   pre-existing and disclosed; a 14-screen scroll is not an acceptable price to clear it. */
@media (max-width:64rem){
  #page{ display:flex; flex-direction:column; }
  #content{ display:contents; }
  #content > .post{ order:1; }
  #sidebar{ order:2; }
  #content > .post.estimates{ order:3; }
  #page > div[style]{ order:9; display:none; }
}
@media (max-width:48rem){
  /* the catalogue cells must linearise: the row box also has to break */

}

/* ---- fixes from the Codex audit ------------------------------------------ */

/* 404.html has no #sidebar. Without this it reserves a 15.5rem rail + 4rem gap
   beside empty space. */
@media (min-width:64rem){
  #page:not(:has(#sidebar)){ display:block; max-width:var(--shell); }
}

/* /outliers/ carries a real DATA table (caption + thead + inline styles). It is not the
   homepage catalogue and must not be stacked or restyled as one. Give it table manners. */
#content table:not(.catalogue){ border-collapse:collapse; width:100%; margin:var(--s5) 0; }
#content table:not(.catalogue) caption{
  caption-side:top; text-align:left; padding-bottom:var(--s3);
  font:400 var(--f-1)/1.5 var(--sans); color:var(--ink-soft);
}
#content table:not(.catalogue) th,
#content table:not(.catalogue) td{ font:400 var(--f-1)/1.4 var(--sans); padding:var(--s2) var(--s3); }
#content table:not(.catalogue) th{ font-weight:600; color:var(--ink); }
@media (max-width:48rem){
  /* scroll it, never stack it -- stacking a numeric table destroys the comparison */
  .table-scroll{ overflow-x:auto; }
  #content table:not(.catalogue){ min-width:34rem; }
}

/* /notes/ comes from its own generator and has a byline the site CSS never styled */
.byline, p.byline{ font:400 var(--f-1)/1.5 var(--sans); color:var(--ink-soft); margin:0 0 var(--s5); }

/* ---- gaps found by the orphaned-rule sweep -------------------------------- */

/* In-body section headings. The /notes/ article has five plain <h2> ("The question",
   "What we did", "What we found") with no class; without this they fall back to
   UA-default bold 25.5px serif, outside the type scale entirely. Scoped to .entry so it
   cannot touch h2.title, #logo h2 or the sidebar headings. */
.entry h2{
  margin:var(--s6) 0 var(--s3);
  font:400 var(--f2)/1.25 var(--serif); color:var(--ink); text-wrap:balance;
}
.entry h3{
  margin:var(--s5) 0 var(--s3);
  font:600 var(--f1)/1.3 var(--serif); color:var(--ink);
}

/* .meta > p.links kept a UA-default paragraph margin once the old rule went */
.meta p{ margin:0; }
.meta .links{ margin:0; }

/* The homepage catalogue's seven category labels are <b> inside .post.estimates .entry p
   and lost their colour when default.css went. */
.post.estimates .entry p b{ color:var(--ink); font-weight:600; }

/* ---- the catalogue -> headline-results transition ------------------------- */
/* Sequence on the homepage is: catalogue table, funding acknowledgement, a
   "More papers on meta-analysis" link in .meta, then the results section. Those four
   things ran together at nearly the same weight. */

/* the funding line is housekeeping, not body copy: let it recede */
.funding{
  margin:var(--s6) 0 0;
  font:400 var(--f-1)/1.55 var(--sans);
  color:var(--ink-soft);
  max-width:var(--measure);
}

/* the "More papers" link is a footer to the catalogue, not a peer of the results heading */
#content > .post > .meta{
  margin-top:var(--s5);
  padding-top:var(--s4);
  border-top:1px solid var(--rule);
}
#content > .post > .meta .links{ font:400 var(--f-1)/1.5 var(--sans); }
#content > .post > .meta a.more{ font-weight:600; text-decoration:none; }
#content > .post > .meta a.more:hover{ text-decoration:underline; }

/* and give the results section a real break: it is a new section of the page, not the
   next paragraph. Space does the work; the rule only confirms it. */
.post.estimates{
  margin-top:var(--s8);
  padding-top:var(--s7);
  border-top:2px solid var(--ink-soft);
}
.post.estimates > .entry > p:first-of-type{     /* the "one line per paper" note */
  font:400 var(--f-1)/1.6 var(--sans);
  color:var(--ink-soft);
  max-width:var(--measure);
  margin-bottom:var(--s6);
}

/* ---- A1 "set in place": rank for the flagships, a shorter crown on phones ---- */
/* The three flagship links measured 17px -- exactly body size -- so the site's three crown
   products read as ordinary paragraphs. The accent bar is A's OWN device, reused from the
   paper-page headline result, rather than a new one imported from D/E/F. */
#content > .post > .entry > p:has(> br){
  border-left:3px solid var(--accent);
  padding-left:var(--s4);
  margin:var(--s5) 0;
}
#content > .post > .entry > p:has(> br) > a{
  font-size:var(--f1);            /* 20px: one step above body, below the page title */
  line-height:1.4;
}
@media print{
  #content > .post > .entry > p:has(> br){ border-left:0; padding-left:0; }
}
/* The phone crown cost 269px on the homepage and 331px on /maive/ -- 39% of the viewport
   before a word of content. Desktop is deliberately untouched: the tall slate crown with the
   serif wordmark is the identity, and shrinking it is what made F unacceptable. */
@media (max-width:48rem){
  #logo{ padding:var(--s5) var(--s4) var(--s3); }
  #logo h2{ margin-top:var(--s1); }
  #menu{ padding-bottom:var(--s4); }
  #menu a{ min-height:2rem; padding:var(--s1) var(--s3); }
}

/* ---- A2 "on a sheet": the one thing the live site does better than A ---- */
/* A's body and #page are the SAME colour (rgb 243,245,247), so running text sits on tinted
   grey and white is reserved for figure cards -- inverted. Restore a quiet figure/ground:
   canvas one step deeper, the content shell on white. Masthead, type, pills, layout unchanged. */
:root{ --canvas:#e9edf1; }
#page{
  background:var(--paper);
  border:1px solid var(--rule);   /* paper vs canvas is ~1.1:1; the hairline carries the edge */
  border-top:0;                   /* flush against the slate masthead */
  border-radius:0 0 var(--radius) var(--radius);
}
@media (max-width:64rem){ #page{ border:0; border-radius:0; } }
@media print{ #page{ border:0; border-radius:0; } }
#cite pre{ background:var(--canvas); }   /* the one paper-on-canvas surface, flipped */
/* /maive/ had nine resource buttons wrapping to a second row, which read as a toolbar. The
   ninth ("MAIVE app") is gone and this sentence, which points at the same URL, takes over the
   job -- so it has to look like an invitation rather than a stray bold line. Same accent bar
   as the flagship callouts, so the page has one vocabulary for "this is a thing you can use". */
.entry > b.tool-link{
  display:block;
  margin:var(--s5) 0;
  padding:var(--s3) var(--s4);
  border-left:3px solid var(--accent);
  background:var(--paper);
  font-weight:400;
}
.entry > b.tool-link > a{
  font-size:var(--f1);            /* 20px: one step above body, matching the flagships */
  line-height:1.4;
  font-weight:700;
}
@media print{
  .entry > b.tool-link{ border-left:0; padding:0; background:none; }
}
/* let a full paper title use the width the masthead actually has */
#logo h1,#logo .site-name{ max-width:52ch }
@media (max-width:48rem){
  table.catalogue td[colspan]{ text-align:left !important; padding-top:0 !important; }
  table.catalogue td[colspan] > div{ display:block !important; }
  /* The visible white before the funding line was 72px: the last group's list still carried
     the 32px margin that separates one group from the next, plus 24px of cell padding, plus
     the funding line's own margin. Nothing follows the last group, so the first two are paying
     for a separation that is not needed. Zero them and let one deliberate 32px do the work. */
  table.catalogue td[colspan]{ padding-bottom:0 !important; }
  table.catalogue td[colspan] ul:last-child{ margin-bottom:0; }
  .funding{ margin-top:var(--s6); }
}
/* ---- /datasets/ ---- */
/* The catalogue is genuine tabular data, not the homepage's layout table, so it gets real
   table treatment: a caption, a ruled header, and hairline rows. It is wider than the prose
   measure by design -- five columns of 44 rows is not something to squeeze into 36rem. */
.entry .dataset-catalogue{
  width:100%; max-width:none; border-collapse:collapse;
  margin:var(--s5) 0 var(--s6); font-size:var(--f-1);
}
.entry .dataset-catalogue caption{
  caption-side:top; text-align:left; padding-bottom:var(--s3);
  font:400 var(--f-1)/1.5 var(--sans); color:var(--ink-soft);
}
.entry .dataset-catalogue th{
  text-align:left; vertical-align:bottom; padding:0 var(--s4) var(--s2) 0;
  font:600 var(--f-2)/1.3 var(--sans); text-transform:uppercase; letter-spacing:.07em;
  color:var(--ink-soft); border-bottom:1px solid var(--control);
}
.entry .dataset-catalogue td{
  padding:var(--s3) var(--s4) var(--s3) 0; vertical-align:top;
  border-bottom:1px solid var(--rule); line-height:1.45;
}
.entry .dataset-catalogue td.num,.entry .dataset-catalogue th:nth-child(2){
  text-align:right; padding-right:var(--s5);
  font-variant-numeric:tabular-nums lining-nums;   /* 44 counts that must line up */
  white-space:nowrap;
}
.entry .dataset-catalogue .not-pooled{
  display:inline-block; margin-left:var(--s2); font:600 var(--f-2)/1 var(--sans);
  text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft);
}
/* On a phone five columns cannot fit and stacking 44 rows would be unreadable, so the table
   scrolls inside its own box. The SCROLLING BELONGS TO THE WRAPPER, not the table: setting
   display:block + overflow-x on the table itself did not contain it, because the cells'
   min-widths then size the table's own block box (measured 544px inside a 390px viewport, and
   the whole document scrolled sideways). A wrapper with a constrained width and the table at
   its natural width inside is the arrangement that actually holds. */
/* A's .entry is capped at the prose measure (36rem), which is right for reading and wrong for
   a five-column table: at 576px "codebook" broke as "codebo/ok" and rows ran to five lines.
   On this page only, the entry takes the full sheet and the PROSE keeps the measure, so the
   table gets 894px while the sentences stay readable. Specificity has to beat
   `#content > .post > .entry`, hence the same chain plus the class. */
#content > .post > .entry.datasets{ max-width:none; }
#content > .post > .entry.datasets > p,
#content > .post > .entry.datasets > h2,
#content > .post > .entry.datasets > pre,
#content > .post > .entry.datasets > .funding,
#content > .post > .entry.datasets > .not-pooled-reasons{ max-width:var(--measure); }
/* Scroll shadows. The tables DO scroll on a phone -- measured 358px of viewport against a
   544px table on /outliers/ and 756px on /datasets/ -- but mobile scrollbars are invisible
   until you touch, so a reader sees a column sliced mid-word and no reason to think there is
   more. These two gradients are painted on the scroller: the `local` pair scrolls with the
   content and hides the shadow when you reach an edge, the `scroll` pair stays put. So a
   shadow appears only on the side that has something left to see. */
.entry .table-scroll{
  max-width:100%; overflow-x:auto;
  background:
    linear-gradient(to right, var(--paper) 40%, rgba(255,255,255,0)) left center / 2.5rem 100% no-repeat local,
    linear-gradient(to left,  var(--paper) 40%, rgba(255,255,255,0)) right center / 2.5rem 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%, rgba(31,41,51,.16), rgba(31,41,51,0)) left center / .9rem 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%, rgba(31,41,51,.16), rgba(31,41,51,0)) right center / .9rem 100% no-repeat scroll;
}
@media (max-width:48rem){
  .entry .dataset-catalogue{ width:auto; min-width:100%; }
  .entry .dataset-catalogue td,.entry .dataset-catalogue th{ min-width:8rem; }
  .entry .dataset-catalogue td:first-child,.entry .dataset-catalogue th:first-child{ min-width:15rem; }
}

/* why four datasets are published but not pooled */
.entry .not-pooled-reasons{ margin:var(--s5) 0 var(--s6); }
.entry .not-pooled-reasons dt{
  font:600 var(--f-1)/1.4 var(--mono,ui-monospace,SFMono-Regular,Menlo,monospace);
  color:var(--ink); margin-top:var(--s4);
}
.entry .not-pooled-reasons dd{
  margin:var(--s1) 0 0; padding-left:0; color:var(--ink-soft);
  font-size:var(--f-1); line-height:1.5;
}

/* Paste-and-run. These WRAP rather than scroll: the whole point is that a reader sees the
   command and copies it, and a horizontally scrolled box hides the second half of the URL --
   which is the half that matters. Wrapping at any character keeps the URL intact on copy,
   because the wrap is visual only and no character is inserted. */
.entry pre.usage{
  margin:var(--s3) 0; padding:var(--s3) var(--s4);
  background:var(--canvas); border-left:3px solid var(--rule);
  font-size:var(--f-1); line-height:1.5;
  white-space:pre-wrap; overflow-wrap:anywhere;
}
.entry pre.usage code{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-variant-ligatures:none; }
.entry p.alt-format{ margin-top:calc(-1 * var(--s3)); font-size:var(--f-1); color:var(--ink-soft); }

/* The units caveat sits directly under the download on purpose: a reader who pools an
   elasticity with a dollar value gets a confident wrong answer. Marked, not shouted. */
.entry p.caveat{
  margin:var(--s5) 0; padding:var(--s3) var(--s4);
  border-left:3px solid var(--control); background:var(--paper);
  font-size:var(--f-1); line-height:1.55; color:var(--ink);
}
.entry p.caveat code{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.95em; }