/* ==========================================================================
   COMPONENTS · LEGAL DOCUMENT (extension) — the built .op-doc already gives the
   long-form statute template (masthead, sticky contents, auto-numbered clauses,
   defined terms). This unit adds only the *accountability apparatus* the brief
   mandates that .op-doc lacks, so a legal statement reads as the dated, versioned,
   kept-current record of a serious institution:

     · .op-doc__register   — the front-matter accountability grid (effective /
                             version / last revised / supersedes / review / status)
     · .op-doc__lede       — a prominent, plain-language opening statement, so the
                             load-bearing medical disclaimer RISES above the clauses
     · .op-doc__changelog  — the dated revision history: "we change the record in
                             the open and tell you when" (the corrections policy made
                             literal). Both instances carry it.
     · contents-as-<details> — the on-page contents collapses on a phone, open on
                             desktop; plus the scroll-spy active state.

   Ink + the rubric register tick only. No badges, no colour beyond. Link AFTER
   offprint.css and AFTER the s1 nameplate/colophon files.
   ========================================================================== */

/* — THE REGISTER — front-matter that makes "dated, versioned, accountable"
     first-class. Sits between the masthead and the body, ruled top and bottom
     like the standing data of a printed standard. Values are mono. — */
.op-doc__register {
  margin-bottom: var(--space-xl);
  padding-block: var(--space-md);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  display: grid;
  gap: var(--space-md) var(--space-xl);
  grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
}
.op-doc__register-item {
  display: grid;
  gap: var(--space-3xs);
  align-content: start;
}
.op-doc__register-term {
  font-family: var(--font-furniture);
  font-size: var(--text-3xs);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--text-muted);
}
.op-doc__register-value {
  font-family: var(--font-data);
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: var(--feat-tabular);
  font-size: var(--text-sm);
  line-height: var(--leading-snug);
  color: var(--text);
}
/* "In force" reads as a status, set apart with the rubric register tick — the
   one sanctioned use of the spot in this template. */
.op-doc__register-value--status {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
}
.op-doc__register-value--status::before {
  content: "";
  flex: none;
  inline-size: 0.7em;
  block-size: 2px;
  background: var(--accent);
}

/* — THE LEDE — a prominent, plain-language opening statement. The disclaimer
     uses it to RISE: the load-bearing sentence set in generous serif behind a
     rubric rule, before any numbered clause. A small furniture note can tie it
     to the standing colophon sentence it underwrites. — */
.op-doc__lede {
  margin-bottom: var(--space-xl);
  padding-left: var(--space-md);
  border-left: 3px solid var(--accent);
  max-width: var(--measure-wide);
}
.op-doc__lede > * + * { margin-top: var(--gap-prose); }
.op-doc__lede p {
  font-family: var(--font-reading);
  font-size: var(--text-md);
  line-height: var(--leading-relaxed);
  color: var(--text);
}
.op-doc__lede strong { font-weight: var(--weight-semibold); }
.op-doc__lede-note {
  display: block;
  margin-top: var(--space-md);
  font-family: var(--font-furniture);
  font-size: var(--text-2xs);
  font-style: italic;
  line-height: var(--leading-normal);
  color: var(--text-muted);
}

/* — THE CHANGELOG — the dated revision history. Each entry: a mono version tag
     + a mono date, then a plain note of what changed. This is the dated-revisions
     discipline made visible — the record is kept current and accountable. — */
.op-doc__changelog {
  margin-top: var(--space-xl);
  padding-top: var(--space-md);
  border-top: 1px solid var(--rule-strong);
  max-width: var(--measure);
}
.op-doc__changelog-heading {
  font-family: var(--font-furniture);
  font-size: var(--text-3xs);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: var(--space-md);
}
.op-doc__changelog-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-md);
}
.op-doc__changelog-entry {
  display: grid;
  gap: var(--space-2xs);
  padding-top: var(--space-md);
  border-top: 1px solid var(--rule-faint);
}
.op-doc__changelog-entry:first-child {
  padding-top: 0;
  border-top: 0;
}
@media (min-width: 40rem) {
  .op-doc__changelog-entry {
    grid-template-columns: minmax(10rem, 12rem) minmax(0, 1fr);
    gap: var(--space-md);
    align-items: baseline;
  }
}
.op-doc__changelog-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.5em var(--space-sm);
}
.op-doc__changelog-version {
  font-family: var(--font-data);
  font-variant-numeric: tabular-nums lining-nums;
  font-weight: var(--weight-medium);
  font-size: var(--text-sm);
  color: var(--text);
}
.op-doc__changelog-date {
  font-family: var(--font-data);
  font-variant-numeric: tabular-nums lining-nums;
  font-size: var(--text-xs);
  letter-spacing: var(--tracking-wide);
  color: var(--text-muted);
}
.op-doc__changelog-note {
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  color: var(--text-secondary);
}
.op-doc__changelog-note em { font-style: italic; color: var(--text); }

/* — CONTENTS AS <details> — collapses on a phone (open by default), behaves as a
     static heading on desktop. The built .op-doc__toc-heading styles the summary. — */
.op-doc__toc > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  cursor: pointer;
  list-style: none;
}
.op-doc__toc > summary::-webkit-details-marker { display: none; }
.op-doc__toc > summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.op-doc__toc-caret {
  font-family: var(--font-data);
  font-size: var(--text-xs);
  color: var(--text-muted);
  transition: var(--transition-ink);
}
.op-doc__toc[open] .op-doc__toc-caret { transform: rotate(180deg); }
@media (min-width: 72rem) {
  /* On desktop the contents is a permanent rail, not a toggle. */
  .op-doc__toc > summary { cursor: default; }
  .op-doc__toc-caret { display: none; }
}

/* — SCROLL-SPY — the active section's contents entry takes the rubric. — */
.op-doc__toc-list a.is-active {
  color: var(--accent);
  font-weight: var(--weight-semibold);
}
.op-doc__toc-list a.is-active::before { color: var(--accent); }

/* — SEE-ALSO — a quiet, in-record cross-link strip closing the page: only links
     within the publication (the related statement, methodology, contact). Index,
     not store — no upsell. — */
.op-doc__seealso {
  margin-top: var(--space-xl);
  padding-top: var(--space-md);
  border-top: 1px solid var(--rule);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs) var(--space-lg);
  max-width: var(--measure);
}
.op-doc__seealso-label {
  font-family: var(--font-furniture);
  font-size: var(--text-3xs);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--text-muted);
  flex: none;
  align-self: center;
}
.op-doc__seealso-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs) var(--space-md);
  font-family: var(--font-furniture);
  font-size: var(--text-sm);
}