@ampath/esm-reports-app 1.0.0-next.79 → 1.0.0-next.80

package/src/reports/moh-729b/moh-729b.config.ts

@@ -0,0 +1,235 @@
+/**
+ * The regimen codes of the MoH 729B Facility Monthly ARV Patient Summary
+ * (F-MAPS, Ver. July 2023), section by section as printed on its report page.
+ *
+ * `h` is each row's height as measured off the form (in its own units, scaled
+ * to millimetres by the sheet), so the two halves of the page keep the
+ * printed proportions: a two-line regimen gets a taller row.
+ */
+
+export type Regimen = [code: string, name: string, h?: number];
+
+export interface RegimenSection {
+  title: string;
+  /** the heading row's height */
+  h: number;
+  rows: Regimen[];
+}
+
+/* Left half: ART */
+
+export const ADULT_ART: RegimenSection[] = [
+  {
+    title: 'Adult ART 1st Line regimens',
+    h: 39,
+    rows: [
+      ['AF2E', 'TDF + 3TC + DTG'],
+      ['AF2B', 'TDF + 3TC + EFV'],
+      ['AF1D', 'AZT + 3TC + DTG'],
+      ['AF4C', 'ABC + 3TC + DTG'],
+      ['AF2D', 'TDF + 3TC + ATV/r'],
+      ['AF2F', 'TDF + 3TC + LPV/r'],
+      ['AS2G', 'TAF + 3TC + DTG'],
+      ['AF1E', 'AZT + 3TC + LPV/r'],
+      ['AF1F', 'AZT + 3TC + ATV/r'],
+      ['AF5X', 'Any other 1st line Adult regimens'],
+    ],
+  },
+  {
+    title: 'Adult ART 2nd Line regimens',
+    h: 40,
+    rows: [
+      ['AS1A', 'AZT + 3TC + LPV/r', 63],
+      ['AS1B', 'AZT + 3TC + ATV/r', 64],
+      ['AS1C', 'AZT + 3TC + DTG', 38],
+      ['AS2A', 'TDF + 3TC + LPV/r', 38],
+      ['AS2B', 'TDF + 3TC + DTG', 38],
+      ['AS2C', 'TDF + 3TC + ATV/r', 38],
+      ['AS5A', 'ABC + 3TC + LPV/r', 38],
+      ['AS5B', 'ABC + 3TC + ATV/r', 38],
+      ['AS5C', 'ABC + 3TC + DTG', 38],
+      ['AS6X', 'Any other 2nd line Adult regimens', 45],
+    ],
+  },
+  {
+    title: 'Adult ART 3rd Line regimens',
+    h: 44,
+    rows: [
+      ['AT2D', 'TDF+3TC+DTG+DRV+RTV', 45],
+      ['AT2F', 'TDF+3TC+DTG+ETV+DRV+RTV', 45],
+      ['AT2G', 'TDF + 3TC + DTG', 44],
+      ['AT2H', 'AZT + 3TC + DTG', 45],
+      ['AT2I', 'AZT + 3TC + DTG + DRV + RTV', 45],
+      ['AT2X', 'Any other 3rd line Adult regimens', 45],
+    ],
+  },
+];
+
+/** The children's weight bands, then their Total */
+export const WEIGHT_BANDS = ['3-5.9kg', '6-9.9kg', '10-13.9kg', '14-19.9kg', '20-24.9kg', '25-29.9kgs', '≥30kgs'];
+
+export const PAEDIATRIC_ART: RegimenSection[] = [
+  {
+    title: 'Paediatric ART 1st Line regimens',
+    h: 40,
+    rows: [
+      ['CF2G', 'ABC+3TC+DTG', 41],
+      ['CF1D', 'AZT + 3TC + DTG', 41],
+      ['CF4E', 'TDF + 3TC + DTG', 41],
+      ['CF5X', 'Any other 1st line Paediatric regimens', 41],
+    ],
+  },
+  {
+    title: 'Paediatric ART 2nd Line regimens',
+    h: 46,
+    rows: [
+      ['CS1A', 'AZT + 3TC + LPV/r', 41],
+      ['CS1B', 'AZT + 3TC + DTG', 41],
+      ['CS2A', 'ABC + 3TC + LPV/r', 41],
+      ['CS2B', 'ABC+3TC+DTG', 41],
+      ['CS4X', 'Any other 2nd line Paediatric regimens', 41],
+    ],
+  },
+  {
+    title: 'Paediatric ART 3rd Line regimens',
+    h: 54,
+    rows: [
+      ['CT1H', 'AZT + 3TC + DRV+RTV+RAL', 41.5],
+      ['CT2D', 'ABC + 3TC + DRV+RTV+RAL', 41.5],
+      ['CT3X', 'Any other 3rd line Paediatric regimens', 41.5],
+    ],
+  },
+];
+
+export const PREP: RegimenSection = {
+  title: 'PrEP',
+  h: 37,
+  rows: [
+    ['PRP1A', 'TDF + FTC', 29.5],
+    ['PRP1B', 'TDF + 3TC', 29.5],
+    ['PRP1D', 'Dapivirine ring', 29.5],
+    ['PRP1E', 'Cabotegravir', 29.5],
+    /* not printed on the form: added for clients on Lenacapavir */
+    ['PRP1F', 'Lenacapavir', 29.5],
+    ['PRP1X', 'Others', 29.5],
+  ],
+};
+
+/* Right half: PMTCT, PEP, Hepatitis B and OIs */
+
+export const PMTCT_MOTHERS: RegimenSection = {
+  title: 'Pregnant women or HEI Mothers',
+  h: 39,
+  rows: [
+    ['PM9', 'PMTCT HAART: TDF + 3TC + EFV'],
+    ['PM12', 'PMTCT HAART: TDF + 3TC + DTG'],
+    ['PM13', 'PMTCT HAART: AZT + 3TC + DTG'],
+    ['PM14', 'PMTCT HAART: ABC + 3TC + DTG'],
+    ['PM11', 'PMTCT HAART: TDF + 3TC + ATV/r'],
+    ['PM7', 'PMTCT HAART:  TDF + 3TC + LPV/r'],
+    ['PM10', 'PMTCT HAART: AZT + 3TC + ATV/r'],
+    ['PM5', 'PMTCT HAART: AZT + 3TC + LPV/r'],
+    ['PM1X', 'Any other PMTCT regimens for Women'],
+  ],
+};
+
+/** The infants' age bands, then their Total */
+export const INFANT_AGES = ['0-12 weeks', '12 weeks-6months', '7- 9 months', '10-12 months', 'Above 12 months'];
+
+export const PMTCT_INFANTS: RegimenSection = {
+  title: 'Infants',
+  h: 40,
+  rows: [
+    [
+      'PC8',
+      'AZT liquid BID + NVP liquid OD for 6 weeks then NVP liquid OD until 6 weeks after complete cessation of Breastfeeding',
+      63,
+    ],
+    ['PC7', 'AZT liquid BID + NVP liquid OD for 6 weeks then NVP liquid OD for 6 weeks(If not breastfeeding)', 64],
+    ['PC1X', 'Any other PMTCT regimens for Infants', 38],
+  ],
+};
+
+/** A numbered group of the right half, each regimen with a single count and a Total */
+export interface TotalledGroup extends RegimenSection {
+  number?: string;
+  /** the heading's Total cell is shaded (Cryptococcal Meningitis) */
+  noTotal?: boolean;
+}
+
+export const PEP: TotalledGroup[] = [
+  {
+    number: '1',
+    title: 'PEP for Adults',
+    h: 38,
+    rows: [
+      ['PA3D', 'TDF + 3TC + DTG', 38],
+      ['PA3C', 'TDF + 3TC + ATV/r', 38],
+      ['PA1C', 'AZT + 3TC + ATV/r', 38],
+      ['PA4X', 'Any other PEP regimens for Adults', 38],
+    ],
+  },
+  {
+    number: '2',
+    title: 'PEP for Children',
+    h: 45,
+    rows: [
+      ['PC3A', 'ABC + 3TC + LPV/r', 45],
+      ['PC3C', 'ABC + 3TC + DTG', 45],
+      ['PC4X', 'Any other PEP regimens for Children', 45],
+    ],
+  },
+];
+
+export const HEPATITIS_B: TotalledGroup = {
+  title: 'Hepatitis B Patients who are HIV-ve',
+  h: 44,
+  rows: [
+    ['HPB1A', 'TDF + 3TC (HIV-ve HepB patients)', 45],
+    ['HPB1B', 'TDF + FTC (HIV-ve HepB patients)', 45],
+    ['HPB1C', 'Any other HEP B regimens', 45],
+  ],
+};
+
+/** The TPT group counted from MOH 731 3.4 Starting TPT */
+export const TPT_HIV_POSITIVE = 'TPT HIV Positive';
+
+export const OPPORTUNISTIC_INFECTIONS: TotalledGroup[] = [
+  {
+    number: '1',
+    title: 'Universal prophylaxis',
+    h: 43,
+    rows: [
+      ['OI1A', 'Adult patients on Cotrimoxazole prophylaxis', 40],
+      ['OI1C', 'Paediatric patients on Cotrimoxazole prophylaxis', 40],
+      ['OI2A', 'Adult patients on Dapsone prophylaxis', 40],
+    ],
+  },
+  {
+    number: '2',
+    title: TPT_HIV_POSITIVE,
+    h: 46,
+    rows: [
+      ['ATPT1A', 'Adult patients (=>15 Yrs) newly started on 6H in the month', 41],
+      ['ATPT1B', 'Adult patients (=>15 Yrs) newly started on 3HP in the month', 41],
+      ['CTPT1A', 'Paed patients (<15 Yrs) newly started on 6H in the month', 41],
+      ['CTPT1B', 'Paed patients (<15 Yrs) newly started on 3HP in the month', 41],
+    ],
+  },
+  {
+    number: '3',
+    title: 'TPT HIV Negative',
+    h: 41,
+    rows: [['ATPT1C', 'HIV Negative Adult patients (=>15 Yrs) newly started on 3HP in the month', 54]],
+  },
+  {
+    number: '4',
+    title: 'Cryptococcal Menengitis New Clients only',
+    h: 40,
+    noTotal: true,
+    rows: [
+      ['OI6B', 'New CM patients (=>15 Yrs) on liposomal Ampotericin+Flucytosine + fluconazole in the month', 84],
+      ['OI6X', 'New CM patients (=>15 Yrs) on any other treatment in the month', 72],
+    ],
+  },
+];

package/src/reports/moh-729b/moh-729b.scss

@@ -0,0 +1,276 @@
+@use '@carbon/layout';
+@use '@openmrs/esm-styleguide/src/vars' as *;
+
+/* The MoH 729B F-MAPS report page as one A3 portrait sheet, drawn in the units
+   the paper is measured in (mm, pt) so it prints as one sheet: the masthead,
+   the two halves of regimen codes side by side, and the sign-off beneath.
+   Row heights come from the form (moh-729b.config.ts). */
+
+/* On screen a page is the printable area only, A3 portrait less its 8mm
+   margins: the card around it gives the margin, and `usePageScale` is told
+   this width. */
+$page-w: 297mm - 2 * 8mm;
+$page-h: 420mm - 2 * 8mm;
+
+$ink: #000;
+$rule: 0.6pt solid #000;
+$shade: #a6a6a6; // cells not to be filled
+$light-shade: #bfbfbf;
+$band: #d9d9d9; // ADULT ART, PMTCT, PrEP
+$heading: #f2f2f2; // each section's heading row
+
+/* The card the page sits in, drawn like the filter card above it */
+.reportFrame {
+  margin: layout.$spacing-05 0 layout.$spacing-07;
+  padding: layout.$spacing-05;
+  background-color: $ui-02;
+  border: 1px solid $ui-03;
+}
+
+/* Holds the fixed-width page without making the app scroll sideways */
+.viewport {
+  overflow-x: auto;
+}
+
+.page {
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
+  width: $page-w;
+  height: $page-h;
+  margin: 0 auto;
+  padding: 2mm 3mm 0;
+  color: $ink;
+  font-family: Arial, Helvetica, sans-serif;
+  font-size: 7pt;
+  line-height: 1.15;
+  background-color: #fff;
+  /* set by `usePageScale` from the measured container width, floored at 1 */
+  zoom: var(--page-zoom, 1);
+}
+
+.titleLine {
+  display: flex;
+  justify-content: space-between;
+  font-family: Calibri, Carlito, Arial, sans-serif;
+  font-size: 10.5pt;
+  font-weight: 700;
+}
+
+.formCode {
+  margin-top: 1mm;
+  font-size: 6pt;
+  font-weight: 700;
+  text-align: right;
+}
+
+/* Facility and county on the left, MFL code and sub-county on the right */
+.fields {
+  display: flex;
+  justify-content: space-between;
+  margin-top: 1mm;
+
+  > .fieldGrid:first-child {
+    width: 82mm;
+  }
+
+  > .fieldGrid:last-child {
+    width: 75mm;
+  }
+}
+
+.fieldGrid {
+  display: grid;
+  grid-template-columns: auto 1fr;
+  column-gap: 1mm;
+  row-gap: 2.6mm;
+  align-items: end;
+}
+
+.fieldLabel {
+  font-weight: 700;
+  text-align: right;
+  white-space: nowrap;
+}
+
+/* The ruled line a field is written on; its caption sits beneath it */
+.fieldLine {
+  position: relative;
+  min-height: 3.4mm;
+  padding-left: 1mm;
+  border-bottom: $rule;
+}
+
+.caption {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  right: 0;
+  padding-top: 0.2mm;
+  font-weight: 700;
+  text-align: center;
+}
+
+/* a line with a caption leaves room beneath it for the caption */
+.captioned {
+  margin-bottom: 3mm;
+}
+
+/* Beginning and Ending, each with its (Day/Month/Year) */
+.period {
+  display: grid;
+  grid-template-columns: 30mm 74mm 1fr 75mm;
+  column-gap: 1mm;
+  align-items: end;
+  margin: 1mm 0 1.5mm;
+
+  .caption {
+    font-weight: 400;
+  }
+}
+
+.halves {
+  display: flex;
+  align-items: stretch;
+}
+
+.half {
+  display: flex;
+  flex-direction: column;
+  flex-basis: 0;
+  min-width: 0;
+}
+
+.grid {
+  width: 100%;
+  table-layout: fixed;
+  border-collapse: collapse;
+
+  th,
+  td {
+    padding: 0 0.6mm;
+    overflow: hidden;
+    border: $rule;
+    vertical-align: middle;
+  }
+
+  th {
+    font-weight: 700;
+    text-align: center;
+  }
+
+  td {
+    text-align: left;
+  }
+}
+
+.columnHead th {
+  font-family: Cambria, Georgia, serif;
+  font-size: 6.5pt;
+  line-height: 1.1;
+  vertical-align: top;
+}
+
+.band th {
+  background-color: $band;
+}
+
+.heading th {
+  background-color: $heading;
+}
+
+.bandCell {
+  background-color: $band !important;
+}
+
+.code {
+  text-align: center !important;
+}
+
+.small {
+  font-size: 6.5pt;
+  line-height: 1;
+  text-align: left !important;
+}
+
+.leftText {
+  text-align: left !important;
+}
+
+.italicHeading {
+  font-style: italic;
+  text-align: left !important;
+}
+
+.count {
+  font-variant-numeric: tabular-nums;
+  text-align: center !important;
+  cursor: pointer;
+
+  &:hover,
+  &:focus-visible {
+    background-color: $brand-primary-10;
+    outline: 1px solid var(--brand-01);
+    outline-offset: -1px;
+  }
+}
+
+.shade {
+  background-color: $shade;
+}
+
+.lightShade {
+  background-color: $light-shade;
+}
+
+.blankCell {
+  background-color: #fff;
+}
+
+/* The right half is shorter: the rest of its column is shaded, as printed */
+.filler {
+  flex: 1;
+  background-color: $light-shade;
+  border: $rule;
+  border-top: none;
+}
+
+.instruction {
+  margin-top: 1mm;
+  font-size: 6.5pt;
+  font-weight: 700;
+  line-height: 1.6;
+}
+
+.signOff {
+  display: flex;
+  justify-content: space-between;
+  margin-top: 4mm;
+  padding: 0 0 0 18mm;
+
+  > .fieldGrid {
+    width: 102mm;
+    row-gap: 3.2mm;
+  }
+
+  > .fieldGrid:last-child {
+    width: 120mm;
+    margin-right: 22mm;
+  }
+}
+
+.notes {
+  margin-top: 2mm;
+  font-weight: 700;
+  text-decoration: underline;
+}
+
+.pageFoot {
+  display: flex;
+  justify-content: space-between;
+  margin-top: auto;
+  padding-bottom: 1mm;
+  font-family: Calibri, Carlito, Arial, sans-serif;
+  font-size: 10pt;
+  font-weight: 700;
+}

package/src/reports/moh-729b/moh-729b.types.ts

@@ -0,0 +1,111 @@
+import {
+  ADULT_ART,
+  HEPATITIS_B,
+  OPPORTUNISTIC_INFECTIONS,
+  PAEDIATRIC_ART,
+  PEP,
+  PMTCT_MOTHERS,
+  PREP,
+} from './moh-729b.config';
+
+/**
+ * One client counted on the form, as the ETL returns it (/moh-729b), with the
+ * form's regimen code worked out in SQL: a client active on ART in the month
+ * (by their current ARVs, reported line, age and pregnancy, and a child's
+ * weight band), or a client on PrEP in the month (by the PrEP prescribed at
+ * their latest visit).
+ */
+export interface Moh729bRow {
+  person_id: number;
+  patient_uuid?: string;
+  ccc_number?: string | null;
+  amrs_number?: string | null;
+  full_name?: string | null;
+  gender?: string | null;
+  birthdate?: string | null;
+  age?: number | null;
+  weight?: number | null;
+  rtc_date?: string | null;
+  /** concept ids joined by ' ## ', as stored in the HIV summary */
+  cur_arv_meds?: string | null;
+  /** 1, 2 or 3 */
+  arv_line?: number | null;
+  pregnant?: string | null;
+  /** PrEP only: the PrEP number, latest visit of the month and status at it */
+  prep_number?: string | null;
+  last_visit_date?: string | null;
+  prep_status?: string | null;
+  /** PEP only: the exposure the latest PEP of the month was given for */
+  exposure_date?: string | null;
+  exposure_type?: string | null;
+  /** Hepatitis B only: the ANC visit and the results MOH 731 2.4 counts it by */
+  anc_date?: string | null;
+  hiv_result?: string | null;
+  hbv_result?: string | null;
+  hbv_test_date?: string | null;
+  /** TPT only: the ART start, this month's TB screening and the TPT start */
+  arv_first_regimen_start_date?: string | null;
+  tb_screening_date?: string | null;
+  tb_screening_result?: string | null;
+  ipt_start_date?: string | null;
+  /** Adult, Paediatric, PMTCT, PrEP, PEP for Adults, PEP for Children, Hepatitis B or TPT HIV Positive */
+  client_group?: string | null;
+  /** e.g. TDF + 3TC + DTG */
+  regimen?: string | null;
+  /** the form's code, e.g. AF2E */
+  regimen_code?: string | null;
+  /** children only, as the form heads the bands, e.g. 10-13.9kg */
+  weight_band?: string | null;
+}
+
+/** The PEP regimen codes (PA… for adults, PC3A/PC3C/PC4X for children -- not the infants' PC7, PC8, PC1X) */
+export const PEP_CODES = new Set(PEP.flatMap((group) => group.rows.map(([code]) => code)));
+
+/** One count on the form: a regimen code, narrowed to a weight band or a line where the form splits it */
+export interface Moh729bCell {
+  code: string;
+  band?: string;
+  line?: number;
+}
+
+/**
+ * The form prints TAF + 3TC + DTG as AS2G among the adult 1st line regimens;
+ * its own list of codes (page 3) calls it AF2G, which is what the ETL returns.
+ */
+export const countedCode = (printed: string) => (printed === 'AS2G' ? 'AF2G' : printed);
+
+export const inCell = (row: Moh729bRow, { code, band, line }: Moh729bCell) =>
+  row.regimen_code === countedCode(code) &&
+  (band === undefined || row.weight_band === band) &&
+  (line === undefined || Number(row.arv_line) === line);
+
+/** A client in any of several counts (a total of counts that never overlap) */
+export const inCells = (row: Moh729bRow, cells: Moh729bCell[]) => cells.some((cell) => inCell(row, cell));
+
+/** A count in a link: `AF2E`, `CF2G~20-24.9kg`, `PM12~~2` */
+export const encodeCell = ({ code, band, line }: Moh729bCell) =>
+  [code, band ?? '', line ?? ''].join('~').replace(/~+$/, '');
+
+export const decodeCell = (value: string): Moh729bCell => {
+  const [code, band, line] = value.split('~');
+  return { code, band: band || undefined, line: Number(line) || undefined };
+};
+
+/** The regimen a code stands for on the form, for a linelist's heading */
+export const REGIMEN_NAMES: Record<string, string> = Object.fromEntries(
+  [...ADULT_ART, ...PAEDIATRIC_ART, PMTCT_MOTHERS, PREP, ...PEP, HEPATITIS_B, ...OPPORTUNISTIC_INFECTIONS].flatMap(
+    (section) => section.rows.map(([code, name]) => [countedCode(code), name]),
+  ),
+);
+
+const ORDINALS = ['', '1st', '2nd', '3rd'];
+
+/** e.g. `AF2E TDF + 3TC + DTG`, `CF2G ABC+3TC+DTG · 20-24.9kg`, `PM12 … · 1st Line` */
+export const describeCell = ({ code, band, line }: Moh729bCell) =>
+  [
+    `${countedCode(code)} ${REGIMEN_NAMES[countedCode(code)] ?? ''}`.trim(),
+    band,
+    line ? `${ORDINALS[line] ?? line} Line` : undefined,
+  ]
+    .filter(Boolean)
+    .join(' · ');

package/src/reports/moh-731/moh-731.component.tsx

@@ -248,13 +248,16 @@ const Moh731Report: React.FC<Moh731Props> = () => {
               </div>
             </TabPanel>
             <TabPanel className={styles.summaryPanel}>
-              <Moh731Summary
-                data={moh731Data}
-                openLinelist={openSummaryLinelist}
-                sectionId={summarySection}
-                onSectionChange={selectSummarySection}
-                period={`${startDate}-${endDate}`}
-              />
+              {/* in the same bordered card as the form, so both tabs read alike */}
+              <div className={styles.reportFrame}>
+                <Moh731Summary
+                  data={moh731Data}
+                  openLinelist={openSummaryLinelist}
+                  sectionId={summarySection}
+                  onSectionChange={selectSummarySection}
+                  period={`${startDate}-${endDate}`}
+                />
+              </div>
             </TabPanel>
           </TabPanels>
         </Tabs>

package/src/reports/moh-731/moh-731.scss

@@ -47,22 +47,19 @@ $section-gap: 0.8mm; // around a divider
   margin-top: layout.$spacing-05;
 }
 
-/* Each tab's panel brings its own spacing (the report card, the summary grid) */
+/* Each tab's panel brings its own spacing: both sit in the report card */
 .formPanel,
 .summaryPanel {
   padding: 0;
 }
 
-.summaryPanel {
-  margin-top: layout.$spacing-05;
-}
-
 /* The card the sheet sits in, drawn like the filter card above it (same rule
    and fill) so the report reads as the second panel of one page.
    It wraps `.viewport` rather than styling it: the page is scaled to the
    viewport's width, so padding there would push the sheet into a scrollbar. */
 .reportFrame {
-  margin-top: layout.$spacing-05;
+  /* clear of the foot of the page when scrolled to the end */
+  margin: layout.$spacing-05 0 layout.$spacing-07;
   padding: layout.$spacing-05;
   background-color: $ui-02;
   border: 1px solid $ui-03;

package/src/reports/moh-731/summary/moh-731-summary.config.ts

@@ -375,9 +375,8 @@ export const MOH_731_SUMMARY: SummarySection[] = [
         note: 'Both tables are the clients on ART and add up to 3.2 Currently on ART. Not categorized: no stability, or no DSD model, recorded.',
         tables: [
           {
-            title: 'By stability',
             columns: [],
-            totalLabel: 'Total by stability',
+            totalLabel: 'Total',
             rows: [
               { label: 'Established', only: 'HV03-033' },
               { label: 'Not established', only: 'DSD-NE' },
@@ -385,9 +384,8 @@ export const MOH_731_SUMMARY: SummarySection[] = [
             ],
           },
           {
-            title: 'By model',
             columns: [],
-            totalLabel: 'Total by model',
+            totalLabel: 'Total',
             rows: [
               { label: 'Community', only: 'DSD-CO' },
               { label: 'Facility', only: 'DSD-FA' },

package/src/reports/moh-731/summary/moh-731-summary.scss

@@ -112,6 +112,11 @@
   overflow-x: auto;
 }
 
+/* tables stacked in one card (3.5's two splits) stand apart */
+.tableScroll + .tableScroll {
+  margin-top: layout.$spacing-06;
+}
+
 .table {
   width: 100%;
   border-collapse: collapse;