/* Regulatory Library page-type styles.
   The site-wide shell, typography, header, and footer come from the canonical
   v3 theme stylesheet. These rules only style the library content surface. */

.library-page {
  --fg: var(--text);
  --rule: var(--line-strong);
  --rule-soft: var(--line);
  --link: var(--hue-red-ink);
  --focus: var(--accent-alt);
  --accent-mark: var(--accent);
  --accent-bg: var(--panel-strong);
  --quote: var(--panel);
  --max: var(--content-width);
  --page: var(--page-width);
  --font-body: 'Inter', 'Inter-fallback', system-ui, -apple-system, sans-serif;
  --font-ui: 'Inter', 'Inter-fallback', system-ui, -apple-system, sans-serif;
  --lh: 1.75;
}

* { box-sizing: border-box; }
html { background: var(--bg); color: var(--fg);
  font: 1.05rem/1.6 var(--font-body); }
body { margin: 0; }
/* Site chrome, matched to the act pages so the whole library reads as one
   place. Without it these two pages were the only ones in the tree with no way
   back to the site a reader came from. */
.site-bar { align-items: baseline; border-bottom: 1px solid var(--rule-soft);
  display: flex; flex-wrap: wrap; gap: .5rem 1rem;
  padding: 1rem clamp(1.25rem, 4vw, 2.4rem); }
.site-bar .wordmark { color: var(--fg); font-family: var(--font-wordmark);
  font-weight: 700; letter-spacing: -.02em; text-decoration: none; }
.site-bar .tag { color: var(--muted); font-size: .82rem; }
.site-foot { border-top: 1px solid var(--rule-soft); color: var(--muted);
  font-size: .86rem; margin-top: 4rem;
  padding: 1.5rem clamp(1.25rem, 4vw, 2.4rem) 3rem; }
.site-foot a { color: var(--link); }
/* Sits between the framing sections and the acts: the last thing a reader is
   offered before the law itself, not something competing with it. */
.site-link { margin: 2rem 0 0; }
.site-link a { color: var(--link); }
.skip { background: var(--fg); color: var(--bg); left: 1rem; padding: .7rem 1rem;
  position: fixed; top: -5rem; z-index: 2; }
.skip:focus { top: 1rem; }
main { margin: 0 auto; max-width: 58rem; padding: 3rem 1.25rem 5rem; }
h1 { font-size: clamp(2rem, 6vw, 3.5rem); line-height: 1.1; margin: 0 0 1.5rem; }
h2 { border-top: 1px solid var(--rule); font-size: 1.6rem; margin: 3rem 0 .7rem;
  padding-top: 1.4rem; }
h3 { font-size: 1.2rem; margin: 2rem 0 .4rem; }
h4 { font-size: 1rem; margin: 1.2rem 0 .2rem; }
p { max-width: 52rem; }
.lede { font-size: 1.15rem; }
nav, .rule { border: 1px solid var(--rule); margin: 2rem 0; padding: 1rem 1.25rem; }
nav h2, .rule h2 { border: 0; font-size: 1.15rem; margin: 0 0 .5rem; padding: 0; }
nav ol { margin: 0; padding-left: 1.4rem; }
.crumbs { border: 0; margin: 0 0 1.5rem; padding: 0; font-size: .9rem; }
.crumbs ol { display: flex; flex-wrap: wrap; gap: .15rem .5rem; list-style: none;
  margin: 0; padding: 0; }
.crumbs li { display: flex; align-items: baseline; gap: .5rem; }
.crumbs li + li::before { content: "/"; color: var(--muted); }
.versions { list-style: none; margin: .6rem 0 0; padding: 0; }
.versions li { border-top: 1px solid var(--rule); }
.versions li:last-child { border-bottom: 1px solid var(--rule); }
.versions a { display: block; padding: .75rem 0; }
a { color: var(--link); text-decoration-thickness: .08em; text-underline-offset: .16em; }
a:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.meta { color: var(--muted); display: block; font-size: .88rem; margin-top: .1rem; }
.history { margin-left: 1rem; }
.libraries { list-style: none; margin: 2rem 0 0; padding: 0; }
.libraries li { border-top: 1px solid var(--rule); padding: 1.1rem 0; }
.libraries li:last-child { border-bottom: 1px solid var(--rule); }
.libraries a { font-size: 1.2rem; }

/* Shared WordPress shell integration. */
.library-page {
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
}

.library-page .site-header {
  display: flex;
}

.library-skip {
  background: var(--text);
  border-radius: 0 0 0.5rem 0.5rem;
  color: var(--bg);
  font-weight: 600;
  left: var(--page-pad-x);
  padding: 0.75rem 1rem;
  position: fixed;
  top: -5rem;
  z-index: 100;
}

.library-skip:focus {
  top: 0;
}

.library-progress {
  background: var(--line);
  height: 0.2rem;
  inset: var(--header-height) 0 auto;
  overflow: hidden;
  pointer-events: none;
  position: fixed;
  z-index: 38;
}

.library-progress__bar {
  background: var(--accent);
  display: block;
  height: 100%;
  transform: scaleX(0);
  transform-origin: left;
  width: 100%;
}

.library-breadcrumb-bar {
  border-bottom: 1px solid var(--line);
  margin-top: var(--header-height);
  padding: 0.9rem var(--page-pad-x);
}

.library-breadcrumb-bar .crumbs {
  margin: 0 auto;
  max-width: var(--page-width);
}

.library-page .site-footer {
  margin-top: 0;
}

.library-back-to-top {
  align-items: center;
  background: var(--text);
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  bottom: 1rem;
  color: var(--bg);
  display: inline-flex;
  font-size: 0.78rem;
  font-weight: 600;
  gap: 0.4rem;
  opacity: 0;
  padding: 0.65rem 0.9rem;
  pointer-events: none;
  position: fixed;
  right: var(--page-pad-x);
  text-decoration: none;
  transform: translateY(0.75rem);
  transition: opacity 160ms ease, transform 160ms ease;
  z-index: 30;
}

.library-back-to-top.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.library-back-to-top:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}

/* The shell's site-wide link rule has greater specificity than the page-type
   class. Keep the floating control readable in both colour schemes. */
html body[class*="v3-"] .library-back-to-top {
  color: var(--bg);
}

@media (prefers-reduced-motion: reduce) {
  .library-page {
    scroll-behavior: auto;
  }

  .library-back-to-top {
    transition: none;
  }
}

@media print {
  .library-page .site-header,
  .library-page .nav-overlay,
  .library-progress,
  .library-back-to-top,
  .library-toc__toggle,
  .library-page .site-footer {
    display: none !important;
  }
}


.library-page--hub main {
  max-width: var(--page-width);
  margin-top: 0;
  padding: calc(var(--header-height) + var(--space-16, 4rem)) var(--page-pad-x)
    var(--space-20, 5rem);
}

.library-page--hub h1,
.library-page--hub h2,
.library-page--hub h3,
.library-page--hub h4 {
  color: var(--text);
  font-weight: 500;
  letter-spacing: -0.02em;
}

.library-page--hub .rule,
.library-page--hub nav:not(.site-header__nav):not(.nav-overlay):not(.site-footer__cols):not(.library-section-nav) {
  background: var(--panel);
  border-color: var(--line-strong);
  border-radius: 0.75rem;
}

.library-page--hub .site-header__nav,
.library-page--hub .nav-overlay,
.library-page--hub .site-footer__cols {
  background: transparent;
  border: 0;
  border-radius: 0;
  margin: 0;
  padding: 0;
}

.library-page--hub .libraries a,
.library-page--hub .versions a,
.library-page--hub .site-link a {
  color: var(--hue-red-ink);
}

.library-page--hub main > header {
  border-left: var(--space-1, 0.25rem) solid var(--accent);
  max-width: var(--content-width);
  padding-left: var(--space-6, 1.5rem);
}

.library-page--hub main > header .lede {
  color: var(--muted);
  font-size: var(--text-body-lg, 1.25rem);
  line-height: 1.65;
}

.library-page--hub .rule {
  padding: var(--space-6, 1.5rem);
}

.library-page--hub .site-link {
  margin: var(--space-8, 2rem) 0;
}

.library-page--hub .site-link a {
  align-items: center;
  display: inline-flex;
  font-weight: 600;
  gap: var(--space-2, 0.5rem);
}

.library-page--hub .site-link a::after {
  content: "\2192";
}

/* A quiet sticky rail replaces the original contents box. It reads as local
   navigation, not as a second card or a row of form controls. */
.library-page--hub .library-section-nav {
  background: var(--bg);
  border: 0;
  border-bottom: 1px solid var(--line-strong);
  border-radius: 0;
  margin: var(--space-8, 2rem) 0 var(--space-12, 3rem);
  padding: 0;
  position: sticky;
  top: calc(var(--header-height) + var(--space-2, 0.5rem));
  z-index: 24;
}

.library-page--hub .library-section-nav h2 {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.library-page--hub .library-section-nav ol {
  display: flex;
  gap: var(--space-8, 2rem);
  list-style: none;
  margin: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  padding: 0;
  scrollbar-color: var(--line-strong) transparent;
  scrollbar-width: thin;
  scroll-snap-type: inline proximity;
}

.library-page--hub .library-section-nav li {
  flex: 0 0 auto;
  scroll-snap-align: start;
}

.library-page--hub .library-section-nav a {
  background: transparent;
  border: 0;
  border-radius: 0;
  color: var(--muted);
  display: block;
  font-size: var(--text-body-sm, 0.9375rem);
  font-weight: 500;
  padding: var(--space-4, 1rem) 0;
  position: relative;
  text-decoration: none;
  white-space: nowrap;
}

.library-page--hub .library-section-nav a::after {
  background: var(--accent);
  bottom: 0;
  content: "";
  height: 2px;
  left: 0;
  position: absolute;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 160ms ease;
  width: 100%;
}

.library-page--hub .library-section-nav a:hover,
.library-page--hub .library-section-nav a:focus-visible {
  color: var(--text);
}

.library-page--hub .library-section-nav a[aria-current="location"] {
  background: transparent;
  border-color: transparent;
  color: var(--hue-red-ink);
}

.library-page--hub .library-section-nav a[aria-current="location"]::after {
  transform: scaleX(1);
}

.library-page--hub main > section:not(.rule) {
  border-top: 1px solid var(--line-strong);
  padding: var(--space-12, 3rem) 0 var(--space-8, 2rem);
}

.library-page--hub main > section:not(.rule) > h2 {
  border: 0;
  font-size: var(--text-h2, 2.25rem);
  margin: 0 0 var(--space-3, 0.75rem);
  padding: 0;
  scroll-margin-top: calc(var(--header-height) + var(--space-24, 6rem));
}

.library-page--hub main > section:not(.rule) > h2 + p {
  color: var(--muted);
  font-size: var(--text-body-lg, 1.25rem);
  margin-bottom: var(--space-10, 2.5rem);
}

.library-page--hub main > section:not(.rule) > h3 {
  border-top: 1px solid var(--line);
  font-size: var(--text-h4, 1.375rem);
  margin: var(--space-12, 3rem) 0 var(--space-3, 0.75rem);
  padding-top: var(--space-8, 2rem);
}

.library-page--hub main > section:not(.rule) > h4 {
  color: var(--muted);
  font-size: var(--text-label, 0.75rem);
  letter-spacing: 0.08em;
  margin-top: var(--space-6, 1.5rem);
  text-transform: uppercase;
}

.library-page--hub .versions {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg, 0.75rem);
  overflow: hidden;
}

.library-page--hub .versions li {
  border-color: var(--line);
}

.library-page--hub .versions li:first-child {
  border-top: 0;
}

.library-page--hub .versions li:last-child {
  border-bottom: 0;
}

.library-page--hub .versions a {
  padding: var(--space-4, 1rem) var(--space-5, 1.25rem);
  text-decoration: none;
}

.library-page--hub .versions a:hover {
  background: var(--hue-red-bg);
}

.library-page--hub .history {
  background: var(--panel);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-lg, 0.75rem);
  margin: var(--space-4, 1rem) 0 0;
  overflow: hidden;
}

.library-page--hub .history summary {
  align-items: center;
  color: var(--text);
  cursor: pointer;
  display: flex;
  font-size: var(--text-body-sm, 0.9375rem);
  font-weight: 600;
  justify-content: space-between;
  list-style: none;
  padding: var(--space-4, 1rem) var(--space-5, 1.25rem);
}

.library-page--hub .history summary::-webkit-details-marker {
  display: none;
}

.library-page--hub .history summary:hover {
  background: var(--hue-red-bg);
}

.library-page--hub .history summary span {
  color: var(--hue-red-ink);
  font-size: var(--text-h4, 1.375rem);
  line-height: 1;
  transition: transform 160ms ease;
}

.library-page--hub .history[open] summary {
  border-bottom: 1px solid var(--line);
}

.library-page--hub .history[open] summary span {
  transform: rotate(45deg);
}

.library-page--hub .history .versions {
  border: 0;
  border-radius: 0;
  margin: 0;
}

@media (min-width: 48rem) {
  .library-page--hub main > header {
    padding-left: var(--space-8, 2rem);
  }

  .library-page--hub .rule {
    max-width: var(--content-width);
  }
}

@media (max-width: 47.99rem) {
  .library-page--hub main {
    padding-top: calc(var(--header-height) + var(--space-12, 3rem));
  }

  .library-page--hub .library-section-nav {
    margin-inline: calc(var(--page-pad-x) * -1);
    padding-inline: var(--page-pad-x);
    top: var(--header-height);
  }

  .library-page--hub main > section:not(.rule) > h2 {
    font-size: var(--text-h3, 1.75rem);
  }
}
