/* ══════════════════════════════════════════════════════════════════════════
   NWF REPORT ENHANCE — reading architecture for report pages
   ──────────────────────────────────────────────────────────────────────────
   Loaded after the page's inline styles; everything here rides on the shell's
   own custom properties (--ink, --mute, --hair, --hov, --mono, --display,
   --text) so both themes and both directions come for free. Logical
   properties only: the AR pages flip without a single [dir] override.
   Every piece is an enhancement over a page that already works without JS.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── reading progress ─────────────────────────────────────────────────── */
.nwfe-progress {
  position: fixed;
  inset-block-start: 0;
  inset-inline-start: 0;
  block-size: 2px;
  inline-size: 100%;
  transform: scaleX(0);
  transform-origin: 0 50%;
  background: var(--ink);
  opacity: .55;
  z-index: 60;
  pointer-events: none;
}
[dir="rtl"] .nwfe-progress { transform-origin: 100% 50%; }

/* Injected siblings of .rphead sit directly in .wrap, which carries no
   inline padding of its own; mirror the shell's content inset. */
.nwfe-findings, .nwfe-cite, .nwfe-xnav { margin-inline: clamp(16px, 3.4vw, 46px); }
.nwfe-strip .nwfe-sk { padding-inline-start: clamp(16px, 3.4vw, 46px); }

/* ── key findings ─────────────────────────────────────────────────────── */
.nwfe-findings {
  margin-block: 34px 10px;
  border-block: 1px solid var(--limb);
  padding: 26px 0 22px;
}
.nwfe-findings-k {
  font: 500 11px/1 var(--mono);
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--mute);
  margin-block-end: 18px;
}
.nwfe-findings ol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 14px;
  counter-reset: nwfe-f;
}
.nwfe-findings li {
  counter-increment: nwfe-f;
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 14px;
  align-items: baseline;
  font: 400 17px/1.62 var(--text);
  color: var(--ink);
  max-inline-size: 72ch;
}
.nwfe-findings li::before {
  content: counter(nwfe-f, decimal-leading-zero);
  font: 400 12px/1 var(--mono);
  color: var(--mute);
  padding-block-start: 4px;
}
.nwfe-findings li strong { font-weight: 700; }

/* ── chapter strip: sticky horizontal contents, same voice as the rate
   strip. Works at every width and in both directions; scrolls sideways
   when chapters overflow, and the active chapter keeps itself in view. */
.nwfe-strip {
  position: sticky;
  inset-block-start: 0;
  z-index: 45;
  background: var(--void);
  border-block: 1px solid var(--hair);
  display: flex;
  align-items: stretch;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  margin: 30px 0 0;
}
.nwfe-strip::-webkit-scrollbar { display: none; }
.nwfe-strip .nwfe-sk {
  flex: 0 0 auto;
  align-self: center;
  padding: 0 14px;
  font: 500 10px/1 var(--mono);
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--mute);
  border-inline-end: 1px solid var(--hair);
  white-space: nowrap;
}
.nwfe-strip a {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  padding: 11px 14px 9px;
  font: 400 11.5px/1 var(--mono);
  color: var(--mute);
  text-decoration: none;
  white-space: nowrap;
  border-block-end: 2px solid transparent;
  transition: color .18s ease-out, border-color .18s ease-out;
}
.nwfe-strip a .nwfe-rn { font-size: 9.5px; opacity: .65; }
.nwfe-strip a:hover { color: var(--ink); }
.nwfe-strip a[aria-current="true"] { color: var(--ink); border-block-end-color: var(--ink); }
.nwfe-strip a[aria-current="true"] .nwfe-rn { opacity: 1; }

/* ── figures: anchors, actions, hover emphasis ────────────────────────── */
.figblk { position: relative; }
.nwfe-figact {
  position: absolute;
  inset-block-start: 0;
  inset-inline-end: 0;
  display: flex;
  gap: 2px;
  opacity: 0;
  transition: opacity .18s ease-out;
}
.figblk:hover .nwfe-figact,
.figblk:focus-within .nwfe-figact { opacity: 1; }
.nwfe-figact button {
  appearance: none;
  background: transparent;
  border: 1px solid var(--hair);
  color: var(--mute);
  font: 500 10px/1 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: 6px 9px;
  cursor: pointer;
  transition: color .15s ease-out, border-color .15s ease-out;
}
.nwfe-figact button:hover { color: var(--ink); border-color: var(--limb); }
.nwfe-figact button.nwfe-done { color: var(--ink); border-color: var(--ink); }

/* hover emphasis: dim sibling marks, keep the hovered one full.
   Quantity marks are ink rects; structure (gold) stays untouched. */
@media (hover: hover) {
  .pagefig svg:hover rect[fill]:not([fill="none"]) { opacity: .5; transition: opacity .15s ease-out; }
  .pagefig svg rect[fill]:not([fill="none"]):hover { opacity: 1; }
}

/* figure entrance: default fully visible; JS only adds .nwfe-armed before
   first paint when the observer is live, so no-JS and print keep content. */
.nwfe-armed .figblk { opacity: 0; transform: translateY(14px); }
.nwfe-armed .figblk.nwfe-in {
  opacity: 1;
  transform: none;
  transition: opacity .6s cubic-bezier(.22,1,.36,1), transform .6s cubic-bezier(.22,1,.36,1);
}
@media (prefers-reduced-motion: reduce) {
  .nwfe-armed .figblk { opacity: 1; transform: none; transition: none; }
  .nwfe-progress { transition: none; }
}

/* ── cite block ───────────────────────────────────────────────────────── */
.nwfe-cite {
  margin-block: 44px 0;
  border: 1px solid var(--hair);
  padding: 20px 22px;
  display: grid;
  gap: 10px;
}
.nwfe-cite-k {
  font: 500 10.5px/1 var(--mono);
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--mute);
}
.nwfe-cite-t {
  font: 400 13.5px/1.7 var(--mono);
  color: var(--ink);
  word-break: break-word;
  user-select: all;
}
.nwfe-cite-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.nwfe-cite button {
  appearance: none;
  background: transparent;
  border: 1px solid var(--limb);
  color: var(--ink);
  font: 500 11px/1 var(--mono);
  letter-spacing: .16em;
  text-transform: uppercase;
  padding: 9px 14px;
  cursor: pointer;
  transition: background .15s ease-out;
}
.nwfe-cite button:hover { background: var(--hov); }

/* ── cross-nav ────────────────────────────────────────────────────────── */
.nwfe-xnav {
  margin-block: 26px 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-block-start: 1px solid var(--limb);
}
.nwfe-xnav a {
  padding: 22px 4px 6px;
  text-decoration: none;
  display: grid;
  gap: 8px;
  color: var(--ink);
}
.nwfe-xnav a + a { text-align: end; border-inline-start: 1px solid var(--hair); padding-inline-start: 18px; }
.nwfe-xnav a:first-child { padding-inline-end: 18px; }
.nwfe-xnav .nwfe-xk {
  font: 500 10.5px/1 var(--mono);
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--mute);
}
.nwfe-xnav .nwfe-xt {
  font: 500 clamp(17px, 2.2vw, 21px)/1.35 var(--display);
  transition: opacity .15s ease-out;
}
.nwfe-xnav a:hover .nwfe-xt { opacity: .72; }
.nwfe-xnav a:only-child { grid-column: 1 / -1; text-align: start; border: 0; }

/* ── print: reports become documents again ────────────────────────────── */
@media print {
  .nwfe-progress, .nwfe-rail, .nwfe-toc, .nwfe-figact, .nwfe-xnav { display: none !important; }
  .bar1, .bar2, .ratestrip, .searchband, nav { display: none !important; }
  :root { --void:#fff; --ink:#000; --mute:#444; --hair:#ccc; --limb:#999; }
  body { background: #fff !important; color: #000 !important; }
  .figblk { break-inside: avoid; }
  .nwfe-cite { border-color: #999; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font: 400 10px/1 var(--mono); color: #555; }
}