/* layout-b.css — Layout B "The Operating Layer" (D-0001 option B; Green L2).
   Console-first composition: full-viewport kernel hero, sticky TOC rail (lg+),
   contrast-band rhythm, one architecture chart, and phase glyphs. Loaded only
   by layout-B pages (docShell extraCss); never touches
   the shared sheets. Carbon discipline: every color/space/type value goes
   through a --cds-* token; literal fallbacks are the official Carbon scale
   values (the vendored bundles define no global spacing/type tokens). */

/* Carbon spacing scale: declared once at :root in site.css (promoted there
   from this sheet after the layout-B build surfaced the gap). */

/* ---- console chrome: the UI Shell header rides a contrast theme zone ----
   The wrapper carries .uru-contrast-zone only for its token set; display:contents
   paints no box of its own, so the header's sticky positioning still resolves
   against the viewport while its background/border tokens come from the
   current Carbon layer model. */
.uru-b-headerzone { display: contents; }

/* Anchor jumps clear the 3rem sticky UI Shell header and leave one productive
   spacing step of context, so section headings do not tuck under the bar. */
.uru-b section[id] { scroll-margin-block-start: calc(3rem + var(--cds-spacing-07, 2rem)); }

/* ---- local navigation: sticky rail on lg, Carbon-style overlay below lg ---- */
.uru-b-toc { display: none; }
.uru-b-toc__label {
  margin: 0 0 var(--cds-spacing-05, 1rem);
  color: var(--cds-text-helper);
  font-size: var(--cds-label-01-font-size, 0.75rem);
  font-weight: 600;
  line-height: 1.33;
}
.uru-b-toc__list {
  list-style: none;
  margin: 0;
  padding: 0;
  /* The rail sits on the page background, not on a layer, so it takes the base-set
     border; see the note over .uru-home-section in home.css. */
  border-inline-start: 1px solid var(--cds-border-subtle-00, var(--cds-border-subtle));
}
.uru-b-toc__link {
  display: block;
  margin-inline-start: -1px;
  padding: var(--cds-spacing-03, 0.5rem) var(--cds-spacing-05, 1rem);
  border-inline-start: 2px solid transparent;
  color: var(--cds-text-secondary);
  font-size: var(--cds-body-compact-01-font-size, 0.875rem);
  line-height: 1.29;
  text-decoration: none;
  transition:
    color var(--cds-duration-fast-02, 110ms) cubic-bezier(0.2, 0, 0.38, 0.9),
    border-color var(--cds-duration-fast-02, 110ms) cubic-bezier(0.2, 0, 0.38, 0.9),
    background-color var(--cds-duration-fast-02, 110ms) cubic-bezier(0.2, 0, 0.38, 0.9);
}
.uru-b-toc__link:hover,
.uru-b-toc__link:focus-visible {
  color: var(--cds-text-primary);
  border-inline-start-color: var(--cds-border-strong-01, var(--cds-border-strong));
  background: var(--cds-background-hover, transparent);
}
.uru-b-toc__link[aria-current="location"] {
  color: var(--cds-text-primary);
  border-inline-start-color: var(--cds-link-primary);
  background: var(--cds-background-selected, transparent);
  font-weight: 600;
}
.uru-local-nav-scrim { display: none; }
@media (min-width: 66rem) {
  .uru-b-shell {
    display: grid;
    grid-template-columns: 16rem minmax(0, 1fr);
  }
  .uru-b-shell > * { grid-column: 2; }
  .uru-b-toc {
    display: block;
    grid-column: 1;
    grid-row: 1 / span 99;
    padding-block: var(--cds-spacing-11, 5rem);
    padding-inline: var(--cds-spacing-07, 2rem) var(--cds-spacing-05, 1rem);
  }
  .uru-b-toc__inner {
    position: sticky;
    inset-block-start: calc(3rem + var(--cds-spacing-09, 3rem));
  }
}
@media (max-width: 65.98rem) {
  html.uru-local-nav-open { overflow: hidden; }
  .uru-b-toc {
    position: fixed;
    z-index: 90;
    inset-block: 3rem 0;
    inset-inline-start: 0;
    display: block;
    inline-size: min(16rem, calc(100vw - 3rem));
    padding: var(--cds-spacing-07, 2rem) var(--cds-spacing-05, 1rem);
    overflow-y: auto;
    /* $border-strong-01, not either subtle value. This edge is load-bearing in g90 and only
       in g90: the drawer body (#262626) against the scrim (#0e0e0e) is 1.28:1, so the border
       is the ONLY thing that delimits the panel from the overlay. In g10 the same surface
       pair is 5.55:1 and the edge is decorative.

       Measured with the drawer open at 390, composited, vs drawer / vs scrim:

         subtle-00  #c6c6c6 g10  1.55 / 3.57      #525252 g90  1.94 / 2.47   <- fails
         subtle-01  #e0e0e0 g10  1.20 / 4.62      #6f6f6f g90  3.01 / 3.84
         strong-01  #8d8d8d g10  3.02 / 1.84      #8d8d8d g90  4.56 / 5.82   <- shipped

       strong-01 is theme-invariant at #8d8d8d, so only the ground moves. Its 1.84:1 against
       the g10 scrim is not a defect: in g10 the panel is already separated from the overlay
       by 5.55:1 on the surfaces alone, so the edge there only has to read against the drawer.
       g90 is the case with no surface separation, and that is the side that now passes.

       Both subtle values were picked on g10 evidence alone: -01 is invisible against the
       drawer, and the -00 that replaced it fixed g10 while taking g90 from a passing 3.01:1
       to a failing 1.94:1. The layer-pairing gate cannot referee this -- it skips
       `visibility: hidden`, which the drawer is at rest, and it puts border-strong-0N out of
       scope entirely -- so the value is held by this comment and the numbers above.
       Re-measure both themes before touching it. */
    border-inline-end: 1px solid var(--cds-border-strong-01, var(--cds-border-strong));
    background: var(--cds-background);
    color: var(--cds-text-primary);
    visibility: hidden;
    pointer-events: none;
    transform: translateX(-100%);
    transition:
      transform var(--cds-duration-moderate-02, 240ms) cubic-bezier(0.2, 0, 0.38, 0.9),
      visibility 0s linear var(--cds-duration-moderate-02, 240ms);
  }
  html.uru-local-nav-open .uru-b-toc {
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
    transition-delay: 0s;
  }
  /* The scrim is a <button>, and this rule never reset the UA border, so Chromium's
     `border: 2px outset ButtonBorder` painted permanently: a 3-D bevel around the whole
     overlay, at rest, in every state -- #000000 on the right and bottom with a #545454 top
     face in g10, and #ababab with a #ffffff top in g90, which read as a stray divider
     across the top of the scrim. No custom property is involved, so no token gate could
     ever have seen it. It also corrupted the measurement of the focus ring below: #545454
     is the bevel's top face, not the scrim. */
  .uru-local-nav-scrim {
    position: fixed;
    z-index: 80;
    inset: 3rem 0 0;
    display: block;
    border: 0;
    padding: 0;
    appearance: none;
    background: var(--cds-overlay, rgba(22, 22, 22, 0.5));
  }
  /* The scrim is a real Tab stop -- it is the drawer's dismiss control -- and it spans the
     full viewport width, so the site-wide `outline-offset: 1px` drew its ring at x -1..-3
     and 391..393 on a 390px screen: entirely off-screen, 0 changed pixels anywhere in the
     viewport. Negative offset puts the ring inside its own box, which is the only side
     that exists. */
  .uru-local-nav-scrim:focus-visible {
    outline-offset: -2px;
    /* The ring's colour has to be pinned, for the same reason .focus-edge pins its own:
       --cds-focus flips per theme (#0f62fe g10 / #ffffff g90) but this scrim does NOT --
       --cds-overlay is rgba(0,0,0,.6) in both. So a theme-following ring only ever suits
       one of them: #0f62fe on the composited g10 scrim (#626262) is 1.22:1, against
       19.30:1 for the g90 pairing. $text-on-color is #ffffff in both Carbon themes, giving
       6.10:1 and 19.30:1. Not $focus-inverse -- that is #fff in g10 and #0f62fe in g90, i.e.
       exactly inverted; it measures 6.10:1 g10 / 3.86:1 g90, so it would clear 3:1 in both
       and is a weaker choice rather than a broken one.

       The 1.51:1 and 7.57:1 written here before were both measured against #545454, which
       is the UA bevel's top face rather than the scrim -- see the border reset above. */
    outline-color: var(--cds-text-on-color, #ffffff);
  }
}

/* ---- phase glyphs: CSS-counter section numbering (presentation only) ---- */
.uru-b-shell { counter-reset: uru-sec; }
.uru-b-head {
  display: flex;
  align-items: center;
  gap: var(--cds-spacing-05, 1rem);
  margin-block-end: var(--cds-spacing-07, 2rem);
}
.uru-b-head > h2 { margin: 0; }
.uru-b-glyph {
  counter-increment: uru-sec;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  inline-size: var(--cds-spacing-08, 2.5rem);
  block-size: var(--cds-spacing-08, 2.5rem);
  border: 1px solid var(--cds-border-strong-01, var(--cds-border-strong));
}
.uru-b-glyph::before {
  content: counter(uru-sec, decimal-leading-zero);
  font-size: var(--cds-label-01-font-size, 0.75rem);
  letter-spacing: 0.08em;
  color: var(--cds-text-helper);
}

/* Prominent heading scale for the system section (Carbon heading-06). */
.uru-b-heading-xl {
  font-size: var(--cds-heading-06-font-size, 2.625rem);
  font-weight: var(--cds-heading-06-font-weight, 300);
  line-height: var(--cds-heading-06-line-height, 1.199);
  letter-spacing: 0;
  text-wrap: balance;
}

/* Row rhythm inside layout-B section grids (Carbon css-grid has no row gap). */
.uru-b .uru-section > .cds--css-grid { row-gap: var(--cds-spacing-07, 2rem); }

/* ---- proof: console status strip ---- */
.uru-b-proof {
  padding-block: var(--cds-spacing-09, 3rem);
  border-block-end: 1px solid var(--cds-border-subtle-01, var(--cds-border-subtle));
}
.uru-b-proof > .cds--css-grid { row-gap: var(--cds-spacing-06, 1.5rem); }
.uru-b-stat {
  block-size: 100%;
  padding-inline-start: var(--cds-spacing-05, 1rem);
  border-inline-start: 1px solid var(--cds-border-subtle-01, var(--cds-border-subtle));
}
.uru-b-stat__label {
  margin: 0;
  font-size: var(--cds-label-01-font-size, 0.75rem);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cds-text-helper);
}
.uru-b-stat__value {
  margin: var(--cds-spacing-03, 0.5rem) 0 0;
  font-size: var(--cds-heading-04-font-size, 1.75rem);
  font-weight: 300;
  line-height: var(--cds-heading-04-line-height, 1.28);
  text-wrap: balance;
}
.uru-b-stat__note {
  margin: var(--cds-spacing-03, 0.5rem) 0 0;
  font-size: var(--cds-label-01-font-size, 0.75rem);
  line-height: 1.33;
  color: var(--cds-text-secondary);
}
.uru-b-stat__source {
  margin: var(--cds-spacing-03, 0.5rem) 0 0;
  font-size: var(--cds-label-01-font-size, 0.75rem);
  line-height: 1.33;
  color: var(--cds-text-helper);
}

/* ---- system: the operating layer ---- */
.uru-b-system { counter-reset: uru-pillar; }
.uru-b-system__body {
  margin: 0;
  font-size: var(--cds-heading-03-font-size, 1.25rem);
  line-height: var(--cds-heading-03-line-height, 1.4);
  font-weight: 300;
  color: var(--cds-text-secondary);
  max-inline-size: 38rem;
}
.uru-b-pillar {
  counter-increment: uru-pillar;
  block-size: 100%;
  padding-block-start: var(--cds-spacing-05, 1rem);
  border-block-start: 1px solid var(--cds-border-subtle-01, var(--cds-border-subtle));
}
.uru-b-pillar::before {
  content: counter(uru-pillar, decimal-leading-zero);
  display: block;
  margin-block-end: var(--cds-spacing-04, 0.75rem);
  font-size: var(--cds-label-01-font-size, 0.75rem);
  letter-spacing: 0.08em;
  color: var(--cds-text-helper);
}
.uru-b-status {
  margin: var(--cds-spacing-05, 1rem) 0 0;
  padding: var(--cds-spacing-05, 1rem) var(--cds-spacing-06, 1.5rem);
  border: 1px solid var(--cds-border-subtle-01, var(--cds-border-subtle));
  background: var(--cds-layer-02, var(--cds-layer));
  font-size: var(--cds-body-01-font-size, 0.875rem);
  line-height: var(--cds-body-01-line-height, 1.43);
  color: var(--cds-text-secondary);
}

/* ---- the alluvial band + chart panels ----
   Charts sit on layer panels inside contrast bands. The chart runtime follows
   the root Carbon theme, while the panel supplies a stable layer surface and
   max readable measure for large screens. */
.uru-b-chartslot {
  min-inline-size: 0;
}
.uru-b-chartslot--center .chart-wrap,
.uru-b-chartslot--wide .chart-wrap {
  margin-inline: auto;
}
@media (min-width: 66rem) {
  .uru-b-chartslot--center .chart-wrap { max-inline-size: 48rem; }
  .uru-b-chartslot--wide .chart-wrap { max-inline-size: 60rem; }
  .uru-b-chartslot--side .chart-wrap { margin-inline: auto; max-inline-size: 42rem; }
}
.uru-b-chartpanel {
  background: var(--cds-layer-02, var(--cds-layer));
  color: var(--cds-text-primary);
  padding: var(--cds-spacing-06, 1.5rem);
  border: 1px solid var(--cds-border-subtle-01, var(--cds-border-subtle));
}
@media (min-width: 66rem) {
  .uru-b-chartpanel { padding: var(--cds-spacing-07, 2rem); }
}
.uru-b-chartpanel .chart-wrap { margin-block-start: 0; }
.uru-b-alluvial {
  border-block-start: 1px solid var(--cds-border-subtle-01, var(--cds-border-subtle));
  border-block-end: 1px solid var(--cds-border-subtle-01, var(--cds-border-subtle));
}

/* ---- before/after: paired contained lists ---- */
.uru-b-ba {
  block-size: 100%;
  padding: var(--cds-spacing-06, 1.5rem);
  background: var(--cds-layer-01, var(--cds-layer));
  border-block-start: 2px solid var(--cds-border-subtle-01, var(--cds-border-subtle));
}
/* The "after" state carries the approval accent (interactive-border token —
   orange in navy-orange, blue in carbon; consensus semantics, not decor). */
.uru-b-ba--after { border-block-start-color: var(--cds-border-interactive, var(--cds-interactive)); }
.uru-b-ba__title {
  margin: 0 0 var(--cds-spacing-05, 1rem);
  font-size: var(--cds-heading-03-font-size, 1.25rem);
  font-weight: 400;
  line-height: var(--cds-heading-03-line-height, 1.4);
}
.uru-b-ba__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.uru-b-ba__list li {
  padding-block: var(--cds-spacing-04, 0.75rem);
  border-block-start: 1px solid var(--cds-border-subtle-01, var(--cds-border-subtle));
  font-size: var(--cds-body-01-font-size, 0.875rem);
  line-height: var(--cds-body-01-line-height, 1.43);
  color: var(--cds-text-secondary);
}
.uru-b-ba__list li:first-child { border-block-start: none; padding-block-start: 0; }

/* ---- why-now: display-scale date monuments ---- */
.uru-b-monument {
  display: flex;
  flex-direction: column;
  gap: var(--cds-spacing-04, 0.75rem);
  block-size: 100%;
  padding-block-start: var(--cds-spacing-06, 1.5rem);
  border-block-start: 1px solid var(--cds-border-strong-01, var(--cds-border-strong));
}
.uru-b-monument__date {
  margin: 0;
  font-size: clamp(2.25rem, 1.1rem + 2.4vw, 3.75rem);
  font-weight: 300;
  line-height: 1.05;
  letter-spacing: 0;
  text-wrap: balance;
}
.uru-b-monument__src {
  margin: 0;
  margin-block-start: auto;
  padding-block-start: var(--cds-spacing-05, 1rem);
  border-block-start: 1px solid var(--cds-border-subtle-01, var(--cds-border-subtle));
  font-size: var(--cds-label-01-font-size, 0.75rem);
  color: var(--cds-text-helper);
}
.uru-b-closing {
  margin: var(--cds-spacing-05, 1rem) 0 0;
  max-inline-size: 42rem;
  font-size: var(--cds-heading-03-font-size, 1.25rem);
  font-weight: 300;
  line-height: var(--cds-heading-03-line-height, 1.4);
}

/* ---- ordered method and sourced evidence table ---- */
.uru-method-list__item { min-inline-size: 0; }
.uru-method-list__item .uru-phase { block-size: 100%; }
.uru-b .uru-b-evidence__table th[scope="row"] {
  padding: var(--cds-spacing-04, 0.75rem) var(--cds-spacing-05, 1rem);
  border-block-end: 1px solid var(--cds-border-subtle-01, var(--cds-border-subtle));
  text-align: start;
  vertical-align: top;
  font-weight: 600;
  font-size: var(--cds-body-01-font-size, 0.875rem);
  line-height: var(--cds-body-01-line-height, 1.43);
}
@media (min-width: 42rem) {
  .uru-b .uru-b-evidence__table thead th:first-child,
  .uru-b .uru-b-evidence__table th[scope="row"] { inline-size: 18%; }
  .uru-b .uru-b-evidence__table thead th:last-child,
  .uru-b .uru-b-evidence__table td:last-child { inline-size: 20%; }
}
@media (min-width: 66rem) and (max-width: 81.99rem) {
  .uru-b .uru-b-evidence__table td:nth-child(2) {
    max-inline-size: 38rem;
  }
}

/* ---- contact: closing CTA band ---- */
.uru-b-contact.uru-section { padding-block: var(--cds-spacing-12, 6rem); }
.uru-b-contact__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--cds-spacing-04, 0.75rem);
}

/* ---- B-family variants ---------------------------------------------------
   Same content modules, different operating rhythm. These are active owner
review variants after A/C were removed from the matrix. */
.uru-b--layer .uru-hero,
.uru-b--console .uru-hero { --uru-hero-min-h: 88svh; }
.uru-b--console .uru-b-proof {
  padding-block: var(--cds-spacing-08, 2.5rem);
}
.uru-b--console .uru-b-system {
  padding-block-start: var(--cds-spacing-09, 3rem);
}
.uru-b--console .uru-b-stat,
.uru-b--console .uru-b-status {
  background: var(--cds-layer-02, var(--cds-layer));
}
.uru-b--console .uru-b-toc__list {
  border-inline-start-color: var(--cds-border-strong-01, var(--cds-border-strong));
}

.uru-b--ledger .uru-hero { --uru-hero-min-h: 86svh; }
.uru-b--ledger .uru-b-proof {
  border-block-end-color: var(--cds-border-strong-01, var(--cds-border-strong));
}
.uru-b--ledger .uru-b-evidence__table {
  background: var(--cds-layer-02, var(--cds-layer));
}
.uru-b--ledger .uru-b-system .uru-b-pillar,
.uru-b--ledger .uru-b-monument {
  border-block-start-width: 2px;
}