/* ---------------------------------------------------------------- tokens ---
   The palette is taken from the Council's own emblem rather than invented
   around it. The emblem is emerald #00A046 on white with a gold detail; an
   earlier build set it on a mid olive-sage, which left the one saturated
   thing on the page stranded on a ground that argued with it.

   Two colours carry meaning and nothing else does. Emerald, darkened to a
   forest for type and deepened almost to black for the masthead, is the
   structural colour. A rust-amber is reserved for one meaning only: absence -
   a province with no located study, a trial that never reported. Everything
   else is a near-neutral grey with a faint green cast, so that the colour on
   the page reads as deliberate rather than as a tint laid over all of it.
---------------------------------------------------------------------------- */
:root{
  --paper:#F2F4F1;      --panel:#FFFFFF;      --panel-2:#F6F8F5;
  /* the composition measure: four steps that stay distinct from each
     other in both themes, and from the ground they sit on */
  --seg-1:#15502C;      --seg-2:#4E9A62;      --seg-3:#A04A12;
  --seg-4:#BFD6BC;
  --header:#0E2A1A;     --header-hi:#143322;  --header-lo:#0A2115;
  --header-edge:#06180F; --band:#FFFFFF;      --band-line:#E2E6DF;
  --on-green:#F2F7F1;   --on-green-2:#9FBCA7;  --on-green-line:#2C5A3C;
  --ink:#0C1410;        --ink-2:#2A332C;      --muted:#5F6B61;
  --rule:#E2E6DF;       --rule-2:#CBD2C7;
  --green:#15502C;      --green-2:#1A6B39;    --field:#00A046;
  /* the one warm colour on the page, reserved for absence. It has to clear AA
     against the panel, against the pale zero-cells in the gap map where it
     sets 12px type, and against its own soft ground. */
  --absent:#A04A12;     --absent-soft:#FBEADC;
  --wash:#EAF1E9;       --wash-2:#D9E5D7;
  --gold:#C98A14;
  /* the gap matrix ramp. Five steps, each with the ink that clears AA on it:
     a mid green takes neither black nor white at 12px, so the step that
     carries white has to be dark enough to earn it. */
  --gm-1:#EAF1E9;  --gm-2:#D4E6D2;  --gm-3:#A8D0A6;  --gm-4:#2F7A49;
  --gm-5:#15502C;  --gm-ink-lo:#2A332C;  --gm-ink-hi:#FFFFFF;
  --shadow:0 1px 2px rgba(12,20,16,.05),0 1px 1px rgba(12,20,16,.03);
  --shadow-up:0 6px 18px -6px rgba(12,20,16,.16),0 1px 2px rgba(12,20,16,.05);
  --slab:"Source Serif 4","Bitter",Georgia,"Times New Roman",serif;
  --sans:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;
  --mono:"IBM Plex Mono","Cascadia Mono",Consolas,ui-monospace,monospace;
  --r:6px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#0C1009;      --panel:#141A11;      --panel-2:#1C2318;
  --seg-1:#8FD3A4;      --seg-2:#3F7F55;      --seg-3:#E89450;
  --seg-4:#CFE2C9;
  --header:#102A1B;     --header-hi:#143320;  --header-lo:#0C2116;
  --header-edge:#24452F; --band:#141A11;      --band-line:#262F21;
  --on-green:#E9F1E7;   --on-green-2:#93B49C;  --on-green-line:#2A4D37;
  --ink:#E8EDE3;        --ink-2:#C3CCBC;      --muted:#8D9A88;
  --rule:#262F21;       --rule-2:#3A4633;
  --green:#6FC78C;      --green-2:#67BE84;    --field:#00A046;
  --absent:#E89450;     --absent-soft:#3A2412;
  --wash:#1B241A;       --wash-2:#243020;
  --gold:#D9A93F;
  --gm-1:#1B241A;  --gm-2:#243A26;  --gm-3:#2F5C3A;  --gm-4:#4E9A62;
  --gm-5:#8FD3A4;  --gm-ink-lo:#C3CCBC;  --gm-ink-hi:#0C1009;
  --shadow:0 1px 2px rgba(0,0,0,.4);
  --shadow-up:0 8px 22px -8px rgba(0,0,0,.6),0 1px 2px rgba(0,0,0,.4);
}}
:root[data-theme="dark"]{
  --paper:#0C1009;      --panel:#141A11;      --panel-2:#1C2318;
  --seg-1:#8FD3A4;      --seg-2:#3F7F55;      --seg-3:#E89450;
  --seg-4:#CFE2C9;
  --header:#102A1B;     --header-hi:#143320;  --header-lo:#0C2116;
  --header-edge:#24452F; --band:#141A11;      --band-line:#262F21;
  --on-green:#E9F1E7;   --on-green-2:#93B49C;  --on-green-line:#2A4D37;
  --ink:#E8EDE3;        --ink-2:#C3CCBC;      --muted:#8D9A88;
  --rule:#262F21;       --rule-2:#3A4633;
  --green:#6FC78C;      --green-2:#67BE84;    --field:#00A046;
  --absent:#E89450;     --absent-soft:#3A2412;
  --wash:#1B241A;       --wash-2:#243020;
  --gold:#D9A93F;
  --gm-1:#1B241A;  --gm-2:#243A26;  --gm-3:#2F5C3A;  --gm-4:#4E9A62;
  --gm-5:#8FD3A4;  --gm-ink-lo:#C3CCBC;  --gm-ink-hi:#0C1009;
  --shadow:0 1px 2px rgba(0,0,0,.4);
  --shadow-up:0 8px 22px -8px rgba(0,0,0,.6),0 1px 2px rgba(0,0,0,.4);
}

/* ------------------------------------------------------------------ base ---
   One spacing scale, used everywhere. The previous build had paddings at
   12, 13, 14, 16, 17, 18, 20, 24, 26, 28, 30, 34 and 38 pixels, which is the
   real reason nothing on it felt locked together.
--------------------------------------------------------------------------- */
:root{--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;font-optical-sizing:auto}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
  font-size:15px;line-height:1.52;font-weight:400;-webkit-font-smoothing:antialiased;
  font-feature-settings:"cv05" 1,"cv08" 1,"ss01" 1;font-variant-numeric:tabular-nums}
a{color:var(--green-2);text-underline-offset:2px}
::selection{background:var(--wash-2);color:var(--ink)}
:focus-visible{outline:2px solid var(--field);outline-offset:2px;border-radius:3px}
.wrap{max-width:1600px;margin:0 auto;
  padding-left:var(--s6);padding-right:var(--s6)}
@media(max-width:640px){.wrap{padding-left:var(--s4);padding-right:var(--s4)}}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}

/* the emblem is emerald with a gold detail; the page opens on the same two */
.hairline{height:3px;background:linear-gradient(90deg,var(--field) 0 88%,
  var(--gold) 88% 100%)}

/* ------------------------------------------------------------- masthead ---
   A cover, not a banner. A letterhead rail carries the institution; beneath
   it the register's own title sits on the left and a short specification of
   the publication sits on the right, which is what a statistical publication
   puts on its cover and what stops three quarters of the block being empty.
--------------------------------------------------------------------------- */
.topbar{display:none}
header{color:var(--on-green);position:relative;
  background:linear-gradient(176deg,var(--header-hi) 0%,var(--header) 58%,
             var(--header-lo) 100%);
  border-bottom:1px solid var(--header-edge)}

.rail{display:flex;align-items:center;gap:var(--s3);padding:var(--s3) 0;
  border-bottom:1px solid var(--on-green-line)}
.crest{width:42px;height:42px;flex:none;display:block}
.org{min-width:0}
.org .name{font-size:12.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  color:var(--on-green);line-height:1.2}
.org .unit{font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--on-green-2);margin-top:5px;
  display:flex;gap:var(--s2);flex-wrap:wrap}
.org .unit i{font-style:normal;color:var(--on-green-line)}
.railend{margin-left:auto;display:flex;align-items:center;gap:var(--s4)}
.asat{text-align:right;font-family:var(--mono);font-size:9.5px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--on-green-2);line-height:1.5}
.asat b{display:block;color:var(--on-green);font-weight:600;font-size:12px;
  letter-spacing:.01em;margin-top:3px;font-family:var(--sans);text-transform:none}
@media(max-width:760px){.asat{display:none}}
.modeswitch{background:none;border:1px solid var(--on-green-line);border-radius:var(--r);
  color:var(--on-green-2);width:30px;height:30px;cursor:pointer;flex:none;display:grid;
  place-items:center;padding:0;transition:border-color .15s,color .15s}
.modeswitch:hover{border-color:var(--on-green-2);color:var(--on-green)}
.modeswitch svg{width:15px;height:15px;display:block}
.modeswitch .ico-dark{display:none}
:root[data-theme="dark"] .modeswitch .ico-dark{display:block}
:root[data-theme="dark"] .modeswitch .ico-light{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .modeswitch .ico-dark{display:block}
  :root:not([data-theme="light"]) .modeswitch .ico-light{display:none}}

.cover{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s7);
  align-items:start;padding:var(--s6) 0}
@media(max-width:1000px){.cover{grid-template-columns:1fr;gap:var(--s5);
  padding:var(--s5) 0}}
h1{font-family:var(--slab);font-size:clamp(33px,5vw,64px);line-height:.99;
  margin:0 0 var(--s3);font-weight:600;letter-spacing:-.022em;text-wrap:balance;
  color:var(--on-green)}
.sub{color:var(--on-green-2);font-size:15.5px;max-width:64ch;margin:0;line-height:1.56}
.sub b{font-weight:600;color:var(--on-green)}

/* the publication's own specification, set as a ruled list */
.facts{border-top:1px solid var(--on-green-line);min-width:420px;margin:0}
@media(max-width:1000px){.facts{min-width:0;width:100%}}
.facts div{display:grid;grid-template-columns:84px minmax(0,1fr);gap:var(--s3);
  padding:8px 0;border-bottom:1px solid var(--on-green-line)}
.facts dt{font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--on-green-2);opacity:.72;margin:0;padding-top:2px}
.facts dd{margin:0;font-size:12.5px;color:var(--on-green);line-height:1.45}
.facts dd em{font-style:normal;color:var(--on-green-2)}

/* ------------------------------------------------------------ the state ---
   Headline indicators. Four describe what the register holds; the fifth
   describes what it found, so it is set apart with its own keyline rather
   than queued up with the others as if the five were the same kind of thing.
--------------------------------------------------------------------------- */
.state{background:var(--panel);border-bottom:1px solid var(--rule)}
.state .wrap{padding-top:var(--s5);padding-bottom:var(--s4)}
.figures{display:flex;flex-wrap:wrap;align-items:flex-start;gap:0 var(--s5)}
.fig{min-width:92px;padding:0 0 0 var(--s5);margin-left:var(--s1);
  border-left:1px solid var(--rule)}
.fig:first-child{padding-left:0;margin-left:0;border-left:0}
.fig b{display:block;font-family:var(--slab);font-size:34px;line-height:.98;
  font-weight:600;color:var(--green);letter-spacing:-.03em}
.fig span{font-size:9.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.11em;
  font-weight:600;display:block;margin-top:var(--s2)}
.fig.alert{margin-left:auto;border-left:0;border-top:2px solid var(--absent);
  padding:var(--s3) 0 0 0;text-align:right;min-width:150px}
.fig.alert b{color:var(--absent);font-size:38px}
.fig.alert span{color:var(--absent)}
@media(max-width:860px){.fig.alert{margin-left:0;text-align:left;flex:1 0 100%;
  margin-top:var(--s4)}}

.measure{margin-top:var(--s5);padding-top:var(--s4);border-top:1px solid var(--rule)}
.measure .cap{font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--muted);margin-bottom:var(--s2);font-weight:500}
.covbar{display:flex;height:10px;border-radius:5px;overflow:hidden;
  background:var(--wash);gap:1.5px}
.covbar span{display:block;height:100%;transition:width .9s cubic-bezier(.4,0,.2,1)}
.covkey{display:flex;gap:var(--s2) var(--s5);flex-wrap:wrap;margin-top:var(--s3);
  font-size:11.5px;color:var(--muted)}
.covkey b{color:var(--ink);font-weight:600}
.covkey i{width:9px;height:9px;border-radius:2px;display:inline-block;margin-right:7px}
@media(prefers-reduced-motion:reduce){.covbar span{transition:none}}

/* ----------------------------------------------------------------- nav ---
   Sticky, because seven thousand rows scroll a long way past it.
--------------------------------------------------------------------------- */
.navbar{background:var(--panel);border-bottom:1px solid var(--rule-2);
  position:sticky;top:0;z-index:40;transition:box-shadow .18s}
.navbar.stuck{box-shadow:var(--shadow-up)}
#navsentinel{height:1px;margin-bottom:-1px}
nav{display:flex;gap:0;flex-wrap:wrap}
nav button{background:none;border:0;border-bottom:2px solid transparent;
  padding:13px var(--s4) 11px;font:inherit;font-family:var(--sans);font-size:13.5px;
  color:var(--muted);cursor:pointer;font-weight:500;margin-bottom:-1px;
  transition:color .15s,border-color .15s}
nav button:first-child{padding-left:0}
nav button[aria-selected="true"]{color:var(--green);border-bottom-color:var(--field);
  font-weight:600}
nav button:hover{color:var(--ink)}
nav button .badge{font-family:var(--mono);font-size:10px;background:var(--absent-soft);
  color:var(--absent);padding:1px 6px;border-radius:9px;margin-left:7px;font-weight:600}
nav button .badge:empty{display:none}

main{padding:var(--s6) 0 80px}
.layout{display:grid;grid-template-columns:262px minmax(0,1fr);gap:var(--s6);
  align-items:start}
@media(max-width:980px){.layout{grid-template-columns:1fr}.side{position:static!important;
  max-height:none!important}}

/* --------------------------------------------------------------- filters --- */
.side{position:sticky;top:64px;max-height:calc(100vh - 80px);overflow-y:auto;
  scrollbar-width:thin;scrollbar-color:var(--rule-2) transparent}
.fbox{background:var(--panel);border:1px solid var(--rule);border-radius:var(--r);
  box-shadow:var(--shadow);overflow:hidden}
.fhead{display:flex;align-items:baseline;gap:var(--s2);padding:11px var(--s4);
  border-bottom:1px solid var(--rule);background:var(--panel-2)}
.fhead h2{margin:0;font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--ink-2);font-weight:600}
.fhead .clear{margin-left:auto;font-size:11px;color:var(--green-2);cursor:pointer;
  background:none;border:0;padding:0;font-family:var(--sans)}
.fhead .clear[hidden]{display:none}
.fgroup{border-bottom:1px solid var(--rule);padding:var(--s3) var(--s4)}
.fgroup:last-child{border-bottom:0}
.fgroup h3{margin:0 0 var(--s2);font-family:var(--mono);font-size:9px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--muted);font-weight:600}
.fgroup label{display:flex;gap:var(--s2);align-items:baseline;font-size:12.5px;
  padding:3px 0;cursor:pointer;color:var(--ink-2);line-height:1.35}
.fgroup label:hover{color:var(--green-2)}
.fgroup input[type=checkbox]{margin:0;accent-color:var(--field);flex:none;
  position:relative;top:2px;width:13px;height:13px}
.fgroup .n{margin-left:auto;color:var(--muted);font-size:10.5px;font-family:var(--mono);
  padding-left:var(--s2)}
.fgroup .nmore{background:none;border:0;padding:3px 0 0;font:inherit;font-size:11px;
  color:var(--green-2);cursor:pointer;font-family:var(--sans)}

/* ---------------------------------------------------------------- search --- */
.searchrow{display:flex;gap:var(--s2);margin-bottom:var(--s3);flex-wrap:wrap}
.qwrap{flex:1 1 340px;position:relative;display:flex;align-items:center}
.qwrap svg{position:absolute;left:13px;width:15px;height:15px;color:var(--muted);
  pointer-events:none}
#q{width:100%;padding:11px 46px 11px 36px;border:1px solid var(--rule-2);
  border-radius:var(--r);background:var(--panel);color:var(--ink);font:inherit;
  font-size:14.5px;box-shadow:var(--shadow);transition:border-color .15s,box-shadow .15s}
#q:focus{border-color:var(--field);box-shadow:0 0 0 3px var(--wash)}
#q::placeholder{color:var(--muted)}
.slash{position:absolute;right:11px;font-family:var(--mono);font-size:10px;
  color:var(--muted);border:1px solid var(--rule-2);border-radius:4px;padding:1px 5px;
  pointer-events:none}
#q:focus~.slash{opacity:0}
select,.btn{padding:11px var(--s3);border:1px solid var(--rule-2);border-radius:var(--r);
  background:var(--panel);color:var(--ink-2);font:inherit;font-size:12.5px;cursor:pointer;
  box-shadow:var(--shadow);transition:border-color .15s,color .15s}
.btn:hover,select:hover{border-color:var(--field);color:var(--green)}
.meta{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s4);
  margin:0 0 var(--s2);color:var(--muted);font-size:12.5px;flex-wrap:wrap}
.meta b{color:var(--ink);font-weight:600}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:var(--s2)}
.chip{background:var(--wash);color:var(--green);border:1px solid var(--wash-2);
  border-radius:999px;padding:3px 10px;font-size:11.5px;cursor:pointer;font-weight:500;
  font-family:var(--sans)}
.chip:hover{border-color:var(--field)}

/* ------------------------------------------------------- ledger of records ---
   Each row carries a fixed left anchor - the year, then the tier - so the eye
   has a ruled column to run down. Without it seven thousand rows of title and
   grey metadata are indistinguishable from one another at a glance.
--------------------------------------------------------------------------- */
.ledger{background:var(--panel);border:1px solid var(--rule);border-radius:var(--r);
  overflow:hidden;box-shadow:var(--shadow)}
article{display:grid;grid-template-columns:3px 74px minmax(0,1fr);
  border-bottom:1px solid var(--rule);transition:background .12s}
article:last-child{border-bottom:0}
article:hover{background:var(--panel-2)}
.stripe{background:var(--rule-2)}
article.t1 .stripe{background:var(--field)}
article.t3 .stripe{background:var(--absent)}
.anchor{padding:var(--s4) 0 var(--s4) var(--s4);text-align:left}
.anchor .yr{font-family:var(--mono);font-size:13px;font-weight:500;color:var(--ink-2);
  display:block;line-height:1}
.anchor .tr{font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;
  text-transform:uppercase;display:block;margin-top:7px;font-weight:600;color:var(--muted)}
article.t1 .anchor .tr{color:var(--green)}
article.t3 .anchor .tr{color:var(--absent)}
.body{padding:var(--s4) var(--s5) var(--s4) var(--s3)}
article h2{font-family:var(--slab);font-size:17px;line-height:1.32;margin:0 0 5px;
  font-weight:600;text-wrap:pretty;letter-spacing:-.005em}
article h2 a{color:var(--ink);text-decoration:none}
article h2 a:hover{color:var(--green-2);text-decoration:underline}
.byline{color:var(--muted);font-size:13px;margin-bottom:9px}
.byline em{font-style:italic;color:var(--ink-2)}
/* A property of the record, not a badge. Boxed, it out-competed the titles. */
.oa{font-family:var(--mono);font-size:9.5px;color:var(--green-2);margin-left:12px;
  letter-spacing:.04em;text-transform:uppercase}
/* Metadata reads as one line of text, not a row of boxes. Seven pills of equal
   weight per record made every row look alike. Separator glyphs were tried and
   dropped: a wrapped line began with a stray dot. Spacing carries it instead. */
.tags{display:flex;gap:4px var(--s5);flex-wrap:wrap;align-items:baseline}
.tag{font-size:12px;color:var(--muted);white-space:nowrap;cursor:pointer;
  font-weight:400;background:none;border:0;padding:0;font-family:var(--sans)}
.tag:hover{color:var(--green-2);text-decoration:underline}
.tag.k{color:var(--ink-2);font-weight:500}
.tag.mono{font-family:var(--mono);font-size:11px;color:var(--muted)}
.pill{font-size:9px;padding:2px 7px;border-radius:3px;font-weight:700;white-space:nowrap;
  text-transform:uppercase;letter-spacing:.07em;font-family:var(--sans)}
.pill.t3{background:var(--absent-soft);color:var(--absent)}
details{margin-top:var(--s2)}
details summary{cursor:pointer;color:var(--muted);font-size:11.5px;list-style:none;
  user-select:none;font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase}
details summary::-webkit-details-marker{display:none}
details summary:hover{color:var(--green-2)}
details summary:before{content:"+ ";color:var(--field);font-weight:600}
details[open] summary:before{content:"\2212 "}
details p{font-size:13.5px;color:var(--ink-2);margin:var(--s2) 0 2px;max-width:82ch;
  line-height:1.62}
mark{background:var(--wash-2);color:var(--ink);border-radius:2px;padding:0 2px}
.empty{padding:var(--s7) var(--s5);text-align:center;color:var(--muted);font-size:14px}
.more{text-align:center;padding:var(--s4) 0}
@media(max-width:700px){
  article{grid-template-columns:3px minmax(0,1fr)}
  .anchor{display:none}
  .body{padding:var(--s4)}
}

/* ------------------------------------------------------------- gap matrix --- */
.scroller{overflow:auto;max-height:74vh;border:1px solid var(--rule);
  border-radius:var(--r);background:var(--panel);box-shadow:var(--shadow)}
/* Column labels are set with writing-mode rather than a rotate transform.
   Rotated text overflows its own box and is silently clipped by the scroll
   container; vertical text participates in layout, so the header row sizes
   itself to the longest label and cannot cut one off. */
.tbl{border-collapse:separate;border-spacing:0;font-size:12px;font-family:var(--mono);
  width:100%}
.tbl th,.tbl td{border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);
  padding:7px 6px;text-align:center;font-weight:400}
.tbl thead th{background:var(--panel-2);color:var(--ink-2);font-weight:600;
  position:sticky;top:0;z-index:2;vertical-align:bottom;padding:var(--s3) 4px 10px}
.tbl thead th div{writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap;
  font-family:var(--sans);font-size:10.5px;font-weight:600;letter-spacing:.01em;
  margin:0 auto;line-height:1}
.tbl th.rowh,.tbl td.rowh{text-align:left;font-weight:600;background:var(--panel-2);
  white-space:nowrap;position:sticky;left:0;z-index:1;font-family:var(--sans);
  font-size:12px;padding-right:var(--s4);padding-left:var(--s3);width:1%;
  box-shadow:1px 0 0 var(--rule)}
.tbl thead th.rowh{z-index:3;height:auto}
.tbl td.zero{background:var(--absent-soft);color:var(--absent);font-weight:600}
.tbl tbody tr:hover td:not(.rowh){outline:1px solid var(--field);outline-offset:-1px}
.tbl tbody tr:hover td.rowh{color:var(--green)}
.tbl td.tot,.tbl th.tot{background:var(--wash);font-weight:600;color:var(--green)}
.ramp{display:flex;align-items:center;font-size:11px;color:var(--muted);
  margin:0 0 var(--s3);flex-wrap:wrap;gap:var(--s4)}
.ramp i{width:24px;height:10px;display:inline-block;vertical-align:middle}
.ramp i:first-of-type{border-radius:2px 0 0 2px}

/* ------------------------------------------------------------------ prose --- */
.prose{background:var(--panel);border:1px solid var(--rule);border-radius:var(--r);
  padding:var(--s6) var(--s7);max-width:84ch;box-shadow:var(--shadow);
  margin-inline:auto}
.toc{padding:var(--s2) 0}
.toc a{display:block;padding:6px var(--s4);font-size:12.5px;color:var(--ink-2);
  text-decoration:none;border-left:2px solid transparent;line-height:1.35}
.toc a:hover{color:var(--green-2);border-left-color:var(--rule-2);background:var(--panel-2)}
.prose h3{scroll-margin-top:72px}
@media(max-width:640px){.prose{padding:var(--s5)}}
.prose h3{font-family:var(--slab);font-size:21px;margin:var(--s6) 0 var(--s2);
  font-weight:600;color:var(--ink);text-wrap:balance;letter-spacing:-.012em;
  scroll-margin-top:72px}
.prose h3:first-child{margin-top:0}
.prose p{font-size:14.5px;line-height:1.68;color:var(--ink-2);margin:0 0 var(--s3)}
.prose code{font-family:var(--mono);font-size:11.5px;background:var(--panel-2);
  padding:var(--s3);border-radius:3px;display:block;overflow-wrap:anywhere;
  border-left:2px solid var(--rule-2);color:var(--muted);line-height:1.6}
.note{border-left:3px solid var(--absent);padding:var(--s3) var(--s4);
  background:var(--absent-soft);border-radius:0 3px 3px 0;font-size:13.5px;
  color:var(--ink-2);margin:var(--s4) 0;line-height:1.58}

/* ----------------------------------------------------- dissemination panel --- */
.lede{font-family:var(--slab);font-size:21px;line-height:1.42;color:var(--ink);
  max-width:64ch;margin:0 0 var(--s3);font-weight:400;text-wrap:pretty}
.lede b{font-weight:600;color:var(--absent)}
.pagenote{color:var(--muted);font-size:14px;max-width:78ch;margin:0 0 var(--s4);
  line-height:1.6}
.panelgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(182px,1fr));gap:1px;
  background:var(--rule);border:1px solid var(--rule);border-radius:var(--r);
  overflow:hidden;margin:var(--s5) 0;box-shadow:var(--shadow)}
.cell{background:var(--panel);padding:var(--s4)}
.cell b{display:block;font-family:var(--slab);font-size:28px;font-weight:600;
  line-height:1.05;letter-spacing:-.025em}
.cell span{font-size:11.5px;color:var(--muted);display:block;margin-top:5px;line-height:1.42}
.cell.alert b{color:var(--absent)}

/* ------------------------------------------------------------ bibliography --- */
.bib{background:var(--panel);border:1px solid var(--rule);border-radius:var(--r);
  padding:var(--s6) var(--s7);box-shadow:var(--shadow)}
@media(max-width:640px){.bib{padding:var(--s5)}}
.bib h3{font-family:var(--slab);font-size:17px;margin:var(--s6) 0 var(--s3);
  padding-bottom:7px;border-bottom:1px solid var(--rule);font-weight:600;color:var(--ink)}
.bib h3:first-of-type{margin-top:0}
.bib h3 span{color:var(--muted);font-weight:400;font-family:var(--mono);font-size:12px}
.bib .entry{margin:0 0 var(--s3);padding-left:26px;text-indent:-26px;font-size:13.5px;
  line-height:1.58;max-width:92ch;color:var(--ink-2)}
.bib .entry .id{font-family:var(--mono);font-size:11px;color:var(--muted)}
.bib .anno{display:block;text-indent:0;margin:5px 0 0;color:var(--muted);font-size:13px;
  font-style:italic;line-height:1.55}
.hide{display:none!important}

footer{padding:var(--s5) 0 var(--s7);color:var(--muted);font-size:11.5px;
  border-top:1px solid var(--rule);line-height:1.62;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--s5)}
footer h4{margin:0 0 6px;font-family:var(--mono);font-size:9px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--ink-2);font-weight:600}
footer p{margin:0}
.loading{padding:80px 20px;text-align:center;color:var(--muted);font-family:var(--mono);
  font-size:13px;letter-spacing:.06em;text-transform:uppercase}
@media print{
  .navbar,.side,.searchrow,.chips,.meta,footer,.no-print,.state,.hairline,
  .modeswitch{display:none!important}
  header{background:none;color:#000;border:0}
  header h1,.org .name,.facts dd{color:#000}
  .sub,.org .unit,.facts dt{color:#333}
  .rail,.facts,.facts div{border-color:#999}
  body{background:#fff}.bib{border:0;padding:0;box-shadow:none}
}
