/* home56 / surface60 — stable compositor-owned scrollytelling.
   Fix the embedded page's accidental scroll ancestor, then reuse the proven work49 sticky contract.
   App Shell structure/runtime is intentionally untouched. */

/* App Shell's embed style historically used overflow-x:hidden on BODY.
   Per CSS overflow rules that makes the other axis auto and can create a non-scrolling
   scroll ancestor for position:sticky. clip keeps horizontal clipping without doing that. */
html.stellaria-embedded,
html.stellaria-embedded body.home-public-v3.stellaria-embedded-body{
  overflow-x:clip!important;
  overflow-y:visible!important;
  max-width:100%!important;
}
html.stellaria-embedded body.home-public-v3.stellaria-embedded-body main{
  overflow:visible!important;
  contain:none!important;
  transform:none!important;
  perspective:none!important;
  filter:none!important;
}

/* Compute: a long rail, one compositor-owned sticky stage on desktop. */
html.stellaria-embedded body.home-public-v3.stellaria-embedded-body .nf-production{
  position:relative!important;
  min-height:420svh!important;
  height:auto!important;
  width:100%!important;
  overflow:visible!important;
  contain:none!important;
  transform:none!important;
  perspective:none!important;
  filter:none!important;
  isolation:isolate!important;
}
html.stellaria-embedded body.home-public-v3.stellaria-embedded-body .nf-production-stage{
  position:-webkit-sticky!important;
  position:sticky!important;
  top:0!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  width:100%!important;
  height:100svh!important;
  min-height:100svh!important;
  transform:none!important;
  translate:none!important;
  overflow:visible!important;
  contain:none!important;
  perspective:none!important;
  filter:none!important;
  will-change:auto!important;
  backface-visibility:visible!important;
  -webkit-backface-visibility:visible!important;
}

/* Signature: deliberately longer than the old work49 rail.
   The existing particle runtime derives progress from section height, so extending the rail
   slows Scatter -> Gather -> Hold without introducing another scroll driver. */
html.stellaria-embedded body.home-public-v3.stellaria-embedded-body .nf-signature-field{
  position:relative!important;
  min-height:380svh!important;
  height:auto!important;
  overflow:visible!important;
  contain:none!important;
  transform:none!important;
  perspective:none!important;
  filter:none!important;
  isolation:isolate!important;
}
html.stellaria-embedded body.home-public-v3.stellaria-embedded-body .nf-signature-stage{
  position:-webkit-sticky!important;
  position:sticky!important;
  top:0!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  width:100%!important;
  height:100svh!important;
  min-height:100svh!important;
  transform:none!important;
  translate:none!important;
  overflow:hidden!important;
  contain:none!important;
  perspective:none!important;
  filter:none!important;
  will-change:auto!important;
}

/* Give the Worlds hero a more portrait-led crop; the previous 28% crop showed too much torso. */
body.home-public-v3 .nf-worlds-home img{
  object-position:50% 18%!important;
}

/* Old experimental drivers may still write these variables; they have no geometric effect. */
html.stellaria-embedded body.home-public-v3.stellaria-embedded-body .nf-production-stage,
html.stellaria-embedded body.home-public-v3.stellaria-embedded-body .nf-signature-stage{
  --home-pin-y:0px!important;
  --home-pin56-y:0px!important;
}

/* The non-embedded page should use the same native path. */
body.home-public-v3:not(.stellaria-embedded-body) .nf-production{min-height:420svh!important;height:auto!important;overflow:visible!important;contain:none!important;transform:none!important}
body.home-public-v3:not(.stellaria-embedded-body) .nf-production-stage{position:-webkit-sticky!important;position:sticky!important;top:0!important;height:100svh!important;min-height:100svh!important;transform:none!important;overflow:visible!important;contain:none!important;filter:none!important}
body.home-public-v3:not(.stellaria-embedded-body) .nf-signature-field{min-height:380svh!important;height:auto!important;overflow:visible!important;contain:none!important;transform:none!important}
body.home-public-v3:not(.stellaria-embedded-body) .nf-signature-stage{position:-webkit-sticky!important;position:sticky!important;top:0!important;height:100svh!important;min-height:100svh!important;transform:none!important;overflow:hidden!important;contain:none!important;filter:none!important}

/* Phone layout: Compute becomes a readable stacked sequence; signature keeps native sticky so
   the canvas remains on-screen while scroll progress drives Scatter -> Gather -> Hold. */
@media(max-width:820px){
  html.stellaria-embedded body.home-public-v3.stellaria-embedded-body .nf-production,
  body.home-public-v3:not(.stellaria-embedded-body) .nf-production,
  body.home-public-v3 .nf-production{
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    overflow:visible!important;
  }
  html.stellaria-embedded body.home-public-v3.stellaria-embedded-body .nf-production-stage,
  body.home-public-v3:not(.stellaria-embedded-body) .nf-production-stage,
  body.home-public-v3 .nf-production-stage{
    position:relative!important;
    top:auto!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    display:block!important;
    padding:72px 22px 56px!important;
  }
  body.home-public-v3 .nf-production .nf-section-head{
    width:100%!important;
    margin:0 auto 48px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:18px!important;
    align-items:start!important;
  }
  body.home-public-v3 .nf-production .nf-section-head h2{
    max-width:7.4em!important;
    font-size:clamp(48px,15.4vw,66px)!important;
    line-height:.90!important;
    letter-spacing:-.07em!important;
  }
  body.home-public-v3 .nf-production .nf-section-head>p{
    width:auto!important;
    max-width:34em!important;
    margin:0!important;
    font-size:14px!important;
    line-height:1.72!important;
  }
  body.home-public-v3 .nf-production-progress{display:none!important}
  body.home-public-v3 .nf-story-stack{
    position:relative!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:54px!important;
    overflow:visible!important;
  }
  body.home-public-v3 .nf-story,
  body.home-public-v3 .nf-story.is-active{
    position:relative!important;
    inset:auto!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto auto auto!important;
    align-items:start!important;
    gap:22px!important;
    min-width:0!important;
    min-height:0!important;
    padding:0 0 44px!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:none!important;
    transition:none!important;
    border-bottom:1px solid rgba(218,229,255,.08)!important;
  }
  html[data-theme="light"] body.home-public-v3 .nf-story,
  html[data-theme="light"] body.home-public-v3 .nf-story.is-active{border-bottom-color:rgba(30,45,70,.09)!important}
  body.home-public-v3 .nf-story-copy{min-width:0!important;order:1!important}
  body.home-public-v3 .nf-story-copy h3{
    margin:10px 0 16px!important;
    font-size:clamp(42px,12vw,58px)!important;
    line-height:.92!important;
    letter-spacing:-.065em!important;
  }
  body.home-public-v3 .nf-story-copy p{font-size:14px!important;line-height:1.72!important;margin:0!important}
  body.home-public-v3 .nf-story-visual{
    order:2!important;
    width:100%!important;
    height:220px!important;
    min-height:220px!important;
    max-height:none!important;
    display:grid!important;
    place-items:center!important;
    overflow:hidden!important;
  }
  body.home-public-v3 .f2-mono{width:min(82vw,310px)!important;max-height:200px!important}
  body.home-public-v3 .nf-production-step{
    order:3!important;
    position:static!important;
    inset:auto!important;
    justify-self:end!important;
    margin-top:-2px!important;
  }

  html.stellaria-embedded body.home-public-v3.stellaria-embedded-body .nf-signature-field,
  body.home-public-v3:not(.stellaria-embedded-body) .nf-signature-field,
  body.home-public-v3 .nf-signature-field{
    height:auto!important;
    min-height:300svh!important;
    overflow:visible!important;
  }
  html.stellaria-embedded body.home-public-v3.stellaria-embedded-body .nf-signature-stage,
  body.home-public-v3:not(.stellaria-embedded-body) .nf-signature-stage,
  body.home-public-v3 .nf-signature-stage{
    position:-webkit-sticky!important;
    position:sticky!important;
    top:0!important;
    height:100svh!important;
    min-height:100svh!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
  }
  body.home-public-v3 .nf-signature-stage canvas{display:block!important;opacity:1!important}
  body.home-public-v3 .nf-signature-fallback{width:min(74vw,420px)!important}
  body.home-public-v3 .nf-signature-caption{
    bottom:calc(9% + env(safe-area-inset-bottom,0px))!important;
    max-width:86vw!important;
    font-size:10px!important;
    letter-spacing:.13em!important;
  }
  body.home-public-v3 .nf-worlds-home img{object-position:50% 14%!important}
}

@media(prefers-reduced-motion:reduce){
  html.stellaria-embedded body.home-public-v3.stellaria-embedded-body .nf-production-stage,
  html.stellaria-embedded body.home-public-v3.stellaria-embedded-body .nf-signature-stage{transform:none!important}
}