/* Desktop navigation owns only the viewport strip. Phone layouts keep their
   existing vertical flow when the controller removes horizontal-snap. */
html body.horizontal-snap{
  height:100vh!important;
  height:100dvh!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  overflow:hidden!important;
}
html body.horizontal-snap [data-scroll-space]{display:none!important;height:0!important}
html body.horizontal-snap #site-stage.stage-shell{
  position:fixed!important;
  top:0!important;
  bottom:0!important;
  left:var(--nav-compact)!important;
  right:0!important;
  width:auto!important;
  height:100vh!important;
  height:100dvh!important;
  min-height:0!important;
  padding:0!important;
  overflow:hidden!important;
  transform:none!important;
}
html body.horizontal-snap.nav-expanded #site-stage.stage-shell{left:var(--nav-expanded)!important}
html body.horizontal-snap #site-stage .horizontal-strip{
  position:relative!important;
  display:flex!important;
  flex-flow:row nowrap!important;
  align-items:stretch!important;
  gap:0!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scroll-snap-type:x mandatory!important;
  scroll-behavior:smooth;
  overscroll-behavior-x:contain;
  scrollbar-width:none;
  touch-action:auto;
  transform:none!important;
  translate:none!important;
  will-change:auto!important;
}
html body.horizontal-snap #site-stage .horizontal-strip::-webkit-scrollbar{display:none}
html body.horizontal-snap #site-stage .horizontal-strip>.panel[data-panel]{
  position:relative!important;
  inset:auto!important;
  flex:0 0 100%!important;
  width:100%!important;
  min-width:100%!important;
  max-width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:100%!important;
  box-sizing:border-box!important;
  margin:0!important;
  overflow:clip!important;
  overscroll-behavior-y:contain;
  scroll-snap-align:start!important;
  scroll-snap-stop:always!important;
  scroll-padding-block:16px calc(var(--footer-height,42px) + 16px);
  align-content:start!important;
  align-content:safe center!important;
  align-items:start!important;
  align-items:safe center!important;
  opacity:1!important;
  visibility:visible!important;
  content-visibility:visible!important;
  filter:none!important;
  transform:none!important;
  translate:none!important;
  scale:1!important;
  rotate:0deg!important;
  will-change:auto!important;
}
html body.horizontal-snap #site-stage .panel[data-panel] .motion-item,
html body.horizontal-snap #site-stage .panel[data-panel] [data-scroll-atom]{
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
  transform:none!important;
  translate:none!important;
  scale:1!important;
  rotate:0deg!important;
  clip-path:none!important;
  will-change:auto!important;
}
/* Main horizontal scenes have one input axis. The fit stylesheet reflows their
   contents; independent project readers and settings keep their own scroll. */
html body.horizontal-snap #site-stage #about.about-panel,
html body.horizontal-snap #site-stage #journey.places-panel{
  grid-auto-rows:max-content!important;
  align-content:start!important;
  align-content:safe center!important;
  align-items:start!important;
  align-items:safe center!important;
  overflow:clip!important;
}
html body.horizontal-snap #work .project-copy{
  overflow:clip!important;
}
@media(prefers-reduced-motion:reduce){
  html body.horizontal-snap #site-stage .horizontal-strip{scroll-behavior:auto}
}
html body.horizontal-snap.a11y-reduce-motion #site-stage .horizontal-strip{scroll-behavior:auto}
