/* ============================================================================
   GLACIS — /how-it-works page sheet
   ----------------------------------------------------------------------------
   Page-scoped additions to glacis-v2.css §18 (THE WALK). Loaded after
   glacis-v2.css from how-it-works.html only, so it wins ties by source order
   without raising specificity. Nothing here restates a shared rule.
   ============================================================================ */

/* ----------------------------------------------------------------------------
   THE WITNESSED TAG EARNS ITS BADGE ON BEAT
   The sticky record carries a WITNESSED tag in its header, but the story only
   reaches the countersignature at beat 05. Lit from first paint, the header
   spoils the walk and asserts the countersignature five beats before it
   happens. So the header tag rides the same dim-to-on ladder as the rows it
   summarises (0.22 -> 1, 420ms, --ease) and lights exactly when row 5 does.

   Gated on @supports selector(:has(*)): browsers without :has never dim it and
   simply see the finished, lit header — the same fallback the walk itself uses
   when there is no IntersectionObserver. Reduced motion likewise sees the
   finished state, with no transition. No HTML and no JS is involved: the
   receipt already flips .is-on on its rows, and the header reads that.
   ---------------------------------------------------------------------------- */

@supports selector(:has(*)) {
  .gv2-walk-receipt .gv2-receipt-head .gv2-receipt-tag {
    opacity: 0.22;
    transition: opacity 420ms var(--ease);
  }

  .gv2-walk-receipt:has(.gv2-walk-row[data-row="5"].is-on) .gv2-receipt-head .gv2-receipt-tag {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gv2-walk-receipt .gv2-receipt-head .gv2-receipt-tag {
    opacity: 1;
    transition: none;
  }
}