/* mobile.css — stacked layout, keyed to body.stacked.
   JS adds .stacked when (a) mobile media matches, or (b) GSAP failed (no-gsap). */
body.stacked #scroll-track, body.stacked #narrator { display: none; }
body.stacked { overflow-y: auto; }
body.stacked #mobile { display: block; padding-bottom: 64px;
  background: linear-gradient(180deg, var(--void), var(--sky-bot)); }
body.stacked .m-sec { position: relative; min-height: 78vh; padding: 14vh 16px 32px;
  display: flex; flex-direction: column; justify-content: flex-end;
  border-bottom: calc(var(--px) * 1) solid #11161f; overflow: hidden; }
body.stacked .m-sec .m-bg { position: absolute; inset: 0; z-index: 0;
  background-size: auto 92%, auto 52%; background-repeat: no-repeat, no-repeat;
  image-rendering: pixelated; }
body.stacked .m-sec .m-bg::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(5,8,15,0.25), rgba(5,8,15,0.88)); }
body.stacked .m-sec .m-content { position: relative; z-index: 1; }
body.stacked #iconbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
  opacity: 1; gap: 0; flex-wrap: nowrap; justify-content: space-around; align-items: stretch;
  height: 44px; padding: 0;
  background: rgba(11, 18, 30, 0.97); border-top: 1px solid var(--border); }
body.stacked #iconbar .doc-navlink { flex: 1; display: flex; align-items: center; justify-content: center;
  text-align: center; text-shadow: none; font-size: 8.5px; letter-spacing: 0; padding: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.05); }
body.stacked #iconbar .doc-navlink:first-child { border-left: none; }
body.stacked #iconbar .doc-navlink:active { color: var(--amber); background: rgba(255, 255, 255, 0.04); }
/* cookie banner sits above the fixed mobile nav */
body.stacked .cookie-banner { bottom: 44px; }
body.stacked #score { display: none; }

/* stacked on a wide screen (no-gsap fallback): constrain line length */
body.stacked .m-content { max-width: 720px; }