/* Lemma pages. Generated pages link this; do not inline it again. */
.lem{max-width:70ch}
  .lem h1{font-size:40px;margin:0 0 6px;letter-spacing:-.02em}
  /* THE DEFINITION, AND IT IS THE POINT OF THE PAGE.
     It was set with .lede — 19.5px in --g30, which is larger than the body
     and DIMMER than it, so the two cancelled out and the one sentence a
     reader came for sat between the headword and the elaboration reading like
     an introduction to it.
     A dictionary sets headword and definition as one unit and separates the
     elaboration. So: brighter than the body rather than greyer, bigger than
     the lede, and a rule under it that ends the entry's opening. */
  .def{font-size:24px;line-height:1.42;color:var(--g10);max-width:34ch;
    margin:18px 0 0;font-weight:400;letter-spacing:-.011em}
  .def-rule{border:0;border-top:1px solid var(--g80);margin:26px 0 20px;max-width:34ch}
  .lem h2{font-size:20px;margin:36px 0 10px}
  .lem h3{font-size:16px;margin:22px 0 6px;color:var(--g10)}
  /* THE ELABORATION IS DIMMER THAN THE DEFINITION.
     Size alone was doing all the work: both were --g10, so the definition was
     merely bigger body copy. Standard editorial hierarchy puts the definition
     at full strength and steps the prose under it back one notch — which is
     also how the printed page will read, where size is the only other lever. */
  /* --g30, NOT --g20. There is no --g20 in shell.css: the ladder runs
     g10, g30, g40, g50. `var(--g20)` is an invalid value, so the whole
     declaration is dropped and the element quietly inherits --g10 — which
     is precisely what happened, and looked identical to the rule not being
     there. A CSS variable that does not exist fails silently and leaves no
     trace in the computed style. */
  /* :not(.def) BECAUSE SPECIFICITY DECIDED IT, NOT INTENT.
     `.lem p` is (0,1,1) and `.def` is (0,1,0), so the element selector won
     and the definition quietly took the elaboration's colour — the second
     silent failure in this one rule, after `var(--g20)` turned out not to
     exist and be dropped without trace. Both looked exactly like the CSS
     not having been written. */
  .lem p:not(.def){margin:0 0 13px;color:var(--g30)}
  /* THE STATUS LINE. Two facts at a glance: is this law, and whose. */
  .st-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 16px}
  .st{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;
    text-transform:uppercase;padding:3px 9px;border-radius:3px}
  .st-statutory{color:var(--teal40);border:1px solid color-mix(in srgb,var(--teal40) 40%,transparent);
    background:color-mix(in srgb,var(--teal40) 10%,transparent)}
  .st-conventional{color:var(--g40);border:1px solid var(--g70)}
  .st-where{font-size:12.5px;color:var(--g50)}
  /* The distinction rail — the reason most readers arrived. */
  .conf{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 22px}
  .conf a{font-size:13px;color:var(--g30);text-decoration:none;
    border:1px solid var(--g70);border-radius:999px;padding:3px 11px}
  .conf a:hover{border-color:var(--teal40);color:var(--teal40)}
  .conf-l{font-size:12.5px;color:var(--g50);align-self:center;margin-right:2px}
  /* The demonstration. */
  .dem{border-left:2px solid var(--teal40);padding:2px 0 2px 16px;margin:16px 0 20px}
  .dem-p{font-size:14.5px;color:var(--g30);margin:0 0 12px}
  .dem table{width:100%;border-collapse:collapse;font-size:15px}
  .dem td{padding:7px 10px 7px 0;vertical-align:top;border-bottom:1px solid var(--g85,#1c1c1c)}
  .dem tr:last-child td{border-bottom:0}
  .dem .fl{width:1.9em;font-size:19px;line-height:1.2}
  .dem .dt{font-family:var(--mono);white-space:nowrap;color:var(--g10)}
  .dem .nm{color:var(--g10)}
  .dem .nt{display:block;font-size:13px;color:var(--g50);margin-top:2px}
  /* 1.4.10 REFLOW. Two columns of prose overflowed a 574px viewport because
     the jurisdiction cell would not wrap on the flag-plus-name run. It stacks
     below 620px instead of scrolling, because a two-column table of sentences
     reads perfectly well as stacked blocks and a horizontal scrollbar in the
     middle of a definition does not. */
  .inst{width:100%;border-collapse:collapse;font-size:14.5px;margin:10px 0;
    table-layout:fixed}
  .inst td:first-child,.inst th:first-child{width:34%}
  .inst td{word-wrap:break-word;overflow-wrap:anywhere}
  @media(max-width:620px){
    .inst,.inst tr,.inst td,.inst th{display:block;width:auto}
    .inst th{padding-bottom:2px}
    .inst tr{border-bottom:1px solid var(--g80);padding-bottom:10px;margin-bottom:10px}
    .inst td{border-bottom:0;padding:2px 0}
    .inst td:first-child{color:var(--g10);font-weight:500}
  }
  .inst th,.inst td{text-align:left;padding:8px 12px 8px 0;border-bottom:1px solid var(--g80);vertical-align:top}
  .inst th{font-family:var(--mono);font-size:11px;letter-spacing:.07em;
    text-transform:uppercase;color:var(--g50);font-weight:500}
  .held{font-size:13.5px;color:var(--g50);border-top:1px solid var(--g80);
    margin-top:34px;padding-top:14px}
  .held code{color:var(--teal40)}
  .seealso{font-size:14.5px;color:var(--g40);margin-top:18px}
  .seealso a{color:var(--g30)}
  /* A TERM THAT HAS NO PAGE YET IS NOT A LINK. The index already renders
     these as plain text; the lemma pages linked them anyway and shipped
     eleven 404s. Same treatment on both surfaces, so a reader learns one
     rule: grey means written but not yet published. */
  .soon{color:var(--g50)}
  @media print{
    .st{border:0;background:none;padding:0;color:#000}
    .st::before{content:"["} .st::after{content:"]"}
    .conf{display:none}          /* the H2s below carry the same content */
    .def{font-size:13pt;color:#000;max-width:none}
    .def-rule{max-width:none}
    a{color:#000;text-decoration:none}
    .held{display:none}
  }

/* THE PLACE, NAMED UNDER THE DATE.
   A flag is ornament, not a label. A reader who cannot tell one Gulf flag
   from another learns nothing from it, and a subdivision flag — Scotland's,
   England's — renders as a blank box or a pair of letters on much of
   Windows and Android. The name carries the meaning; the emoji decorates it. */
/* QUIET. At 13.5px in --g40 beside a mono date it read as a filled field
   rather than a caption — the eye took the two lines for a control. It is a
   label on the date above it, so it sits close, small and dim, and lets the
   date keep the row. */
.dem .place{display:block;font-family:var(--sans);font-size:12px;
  color:var(--g50);margin-top:1px;letter-spacing:.01em;font-weight:400;
  /* Reset, because a future collision should not be able to draw furniture
     here again. */
  border:0;padding:0;border-radius:0;background:none}

/* A TERM WE DEFINE AND HOLD NOTHING FOR. Fourteen of these are settlement
   and clearing, where the estate has no calendars at all. The badge is
   deliberately plain rather than a warning colour: it is a statement of
   scope, not an error, and the entry is still worth reading. */
.st-nodata{color:var(--g50);border:1px dashed var(--g70)}