/* slop-ok: SLOP-25 - 16 px is iklipseworld.com's body size, the same as the new bar's labels under 992 px (bar.css) */
/* slop-ok: SLOP-18 - spacing is the live site's rem steps and the new bar's (bar.css): 56 px targets, a 2 px ring */
/* slop-ok: SLOP-07 - the radius is the bar's block radius (xsmall + 4 px padding + 2 px ring), so Back reads as one of its blocks */
/* slop-ok: SLOP-06 - the bar's 2 px ring, the text colour at 30 %: a black block over a near black page has no edge without it */
/* slop-ok: SLOP-27 - 767 px is Webflow's phone breakpoint, not a text measure */
/* Works E, round 13, integration (J-241). Two rules the parts did not own.
   1. Read by int.js's html.ik-works-simple: the LITE slideshow section is out of the page while Simple (the classic grid) is
      the view; the "iklipse LITE" grid section inside main stays.
   2. Back to the work (works.js) as a block of the new bar: 56 px tall, the theme's ground with the bar's ring, Phosphor bold
      arrow-up. Under 768 px it is the icon alone in a 56 px square (its name stays as aria-label), so it takes the least of
      the screen's corner; works.js steps it away while anything that reads sits under it. */
html.ik-works-simple section.ik-lite { display: none !important; }
html.ik-works-simple #iklipse-lite { display: none !important; } /* J-253 plan job 1: the same rule for LITE F (section.ik-lx), which carries the id */

main[data-works-root] .we-back {
  --wb-ink: var(--_theme---s-text, #fff);
  --wb-ground: var(--_theme---s-bg, #000);
  top: 1.25rem; right: 1.25rem; height: 3.5rem; padding: 0 1.125rem 0 1rem; gap: .5rem;
  border: 2px solid color-mix(in srgb, var(--wb-ink) 30%, var(--wb-ground));
  border-radius: calc(var(--border-radius--xsmall, .5rem) + .375rem);
  background-color: var(--wb-ground); color: var(--wb-ink);
  font-size: 1rem;
}
main[data-works-root] .we-back svg { width: 1.5rem; height: 1.5rem; }
@media (hover: hover) and (pointer: fine) {
  main[data-works-root] .we-back:hover { background-color: color-mix(in srgb, var(--wb-ink) 14%, var(--wb-ground)); }
}
@media (max-width: 767px) {
  main[data-works-root] .we-back { top: .75rem; right: .75rem; width: 3.5rem; padding: 0; justify-content: center; }
  main[data-works-root] .we-back span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}

/* 3. Round 14 (J-241), item 5: a field partly scrolled off the top of the screen takes vertical swipes as the page's scroll
   (works.js syncLenis sets .we-off-top), so coming back up is never held halfway with the field cropped. At its top the
   field keeps its own pan (touch-action none, works.css). */
main[data-works-root] .we-stage.we-off-top { touch-action: pan-y; }
