/* x19: compact navigation and unobstructed arrival; original art and reading remain. */
.reading-menu { flex: 1 1 auto; min-width: 0; margin: 0; padding: 0; border: 0; border-radius: 0; }
.reading-menu > summary { cursor: pointer; padding: .6rem .75rem; min-height: 44px; font: 600 .85rem/1.35 var(--sans); border: 1px solid var(--rule); border-radius: .6rem; }
.reading-menu > summary:focus-visible { outline: 2px solid var(--focus, var(--accent, currentColor)); outline-offset: 3px; }
.reading-depth { display: block; font-weight: 400; font-size: .8em; }
.reading-menu-body { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; padding-top: .75rem; }
.reading-menu .prefs { display: flex; margin-left: auto; }
.reading-menu .xnav { width: auto; order: 0; flex-wrap: wrap; overflow: visible; }
.skip:not(:focus) { width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (min-width: 761px) {
  .reading-menu.reading-enhanced[open] > summary { display: none; }
  .reading-menu[open] > .reading-menu-body { padding-top: 0; }
}
@media (max-width: 760px) {
  .xbar, .lt-theories-page .bar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; position: relative; }
  .reading-menu { flex: 1 1 100%; }
  .reading-menu > summary { width: fit-content; }
  .reading-menu-body { display: flex; flex-direction: column; align-items: stretch; }
  .reading-menu .xnav, .reading-menu nav { display: flex; flex-wrap: wrap; white-space: normal; overflow: visible; gap: .25rem .9rem; width: 100%; }
  .reading-menu nav a { white-space: normal; min-height: 44px; display: inline-flex; align-items: center; }
  .reading-menu .prefs { display: flex; margin: 0; gap: .6rem; }
  .reading-menu .depth-g { border-radius: .75rem; }
  /* Initial Encounter only. Subsequent book states keep their authored composition. */
  body#top:not([data-step]) .hero, body#top[data-step="0"] .hero { display: flex; flex-direction: column; height: auto !important; min-height: 100svh !important; padding: 0 0 1.5rem !important; }
  body#top:not([data-step]) .hero .topbar, body#top[data-step="0"] .hero .topbar { position: relative; inset: auto; order: 0; flex-wrap: wrap; }
  body#top:not([data-step]) .hero .intro, body#top[data-step="0"] .hero .intro { position: relative !important; inset: auto !important; transform: none !important; order: 1; margin: 1.25rem 1rem 1rem !important; width: calc(100% - 2rem) !important; max-width: none !important; }
  body#top:not([data-step]) .hero .nightplate, body#top[data-step="0"] .hero .nightplate { position: relative !important; inset: auto !important; transform: none !important; order: 2; margin: 0 1rem 1rem; width: calc(100% - 2rem) !important; height: auto !important; aspect-ratio: 16 / 9 !important; }
  body#top:not([data-step]) .hero .scene, body#top[data-step="0"] .hero .scene, body#top:not([data-step]) .hero .vignette, body#top[data-step="0"] .hero .vignette { visibility: hidden; }
  body#top:not([data-step]) .hero .steps, body#top[data-step="0"] .hero .steps, body#top:not([data-step]) .hero .read-on, body#top[data-step="0"] .hero .read-on, body#top:not([data-step]) .hero .fallback, body#top[data-step="0"] .hero .fallback { position: relative !important; inset: auto !important; transform: none !important; order: 3; margin: .5rem 1rem !important; width: auto !important; }
  body#top:not([data-step]) .hero .intro .q, body#top[data-step="0"] .hero .intro .q { color: var(--ink); }
  body#top:not([data-step]) .hero .intro .promise, body#top[data-step="0"] .hero .intro .promise { color: var(--ink-2); }
}