/* Mobile home preview: desktop composition is retained above 760px. */
.menu-toggle, .carousel-controls { display: none; }
@media (min-width:761px) and (max-width:1700px) {
 .main-nav { margin-left:auto; margin-right:0; gap:clamp(14px,3vw,50px); }
}
@media (max-width:760px) {
 .site-header { padding:10px 14px; position:relative; z-index:20; gap:10px; }
 .brand { gap:8px; min-width:0; }
 .brand-logo { width:66px; height:66px; flex-shrink:0; }
 .brand-logo img { transform:translate(-1px,-5px); }
 .brand-text h1 { font-size:35px; letter-spacing:6px; }
 .brand-text p { font-size:10px; letter-spacing:1.6px; line-height:1.3; }
 .brand-divider { width:165px; margin-top:2px; }
 .brand-divider b { font-size:12px; }
 .menu-toggle { display:block; background:none; border:1px solid #b98a4266; color:#d8b26e; border-radius:4px; font-size:24px; width:44px; height:44px; flex-shrink:0; }
 .main-nav { display:flex; flex-direction:column; position:fixed; top:86px; bottom:auto; left:auto; right:0; width:min(135px,40vw); max-height:calc(100dvh - 86px); box-sizing:border-box; margin:0; padding:12px 10px; gap:0; overflow-y:auto; background:linear-gradient(160deg,#101d2bfa,#07111ffa); border-left:1px solid #b98a4280; box-shadow:-12px 12px 32px #0006; transform:translateX(100%); visibility:hidden; transition:transform .3s ease,visibility .3s; }
 .main-nav.is-open { transform:translateX(0); visibility:visible; }
 .nav-link { font-size:16px; letter-spacing:1px; padding:19px 4px; border-bottom:1px solid #b98a4233; }
 .nav-link:last-child { border-bottom:0; }
 .hero { min-height:0; padding:0 0 28px; background-size:auto 780px; background-position:center top; }
 .hero::before { height:65px; pointer-events:none; }
 .book-ring { position:relative; top:auto; left:auto; transform:none; width:100%; height:640px; overflow:hidden; touch-action:pan-x; }
 .book-ring::before { inset:auto; top:46%; left:25%; width:50%; height:510px; box-sizing:border-box; transform:translateY(-50%); pointer-events:none; border-width:1px; opacity:.35; animation:none; }
 .aspiron-orbit { display:none; }
 .book-ring .book-card { top:46%; left:50%; width:205px; height:205px; opacity:0; visibility:hidden; pointer-events:none; transform:translate(-50%,-50%) translateY(var(--book-y,0px)) scale(var(--book-scale,1)); transition:transform .5s ease,opacity .5s ease,filter .5s ease; z-index:var(--book-z,1); filter:brightness(.65); }
 .book-ring .book-card.is-visible { opacity:var(--book-opacity,1); visibility:visible; pointer-events:auto; cursor:pointer; }
 .book-ring .book-card.is-active { filter:brightness(1); box-shadow:0 0 28px #d8b26e44,0 12px 35px #0009; }
 .book-ring .book-one .book-title { left:50%; width:90%; white-space:normal; font-size:14px; }
 .book-ring .book-status { font-size:17px; }
 .book-ring .book-number { font-size:20px; }
 .carousel-controls { position:absolute; display:flex; align-items:center; justify-content:center; gap:18px; bottom:8px; left:0; right:0; z-index:10; }
 .carousel-controls button { width:44px; height:44px; border-radius:50%; border:1px solid #b98a42; background:#07111fd9; color:#e8c98b; font-size:22px; cursor:pointer; }
 .carousel-caption { text-align:center; font-size:12px; line-height:1.7; color:#e8c98b; min-width:130px; text-shadow:0 2px 5px #000; }
 .world-cards { position:relative; left:auto; bottom:auto; transform:none; width:auto; margin:28px 16px 0; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
 .world-card { min-height:0; }
 .world-card:last-child { grid-column:1 / -1; }
 .world-card-image { height:140px; }
 .world-card-content { padding:18px 6px; }
 .world-card-content h2 { font-size:17px; letter-spacing:1px; }
 .home-bottom { grid-template-columns:1fr; padding:0; gap:20px; }
 .latest-revelations,.about-author { width:100%; box-sizing:border-box; padding:24px 18px; margin:0; }
 .latest-grid,.author-content { grid-template-columns:1fr; }
 .author-photo { margin:auto; }
 .project-meta { flex-wrap:wrap; gap:8px; }
 .site-footer { box-sizing:border-box; padding:24px 16px; }
}
@media (prefers-reduced-motion:reduce) { .book-ring .book-card, .main-nav { transition:none; } }



/* Delicate manuscript border on the mobile navigation. */
@media (max-width:760px) {
 .main-nav {
  border:1px solid rgba(185,138,66,.65);
  border-right:0;
  border-radius:7px 0 0 12px;
  padding-bottom:22px;
  background:
   linear-gradient(#c9a259,#c9a259) 5px 5px / 16px 1px no-repeat,
   linear-gradient(#c9a259,#c9a259) 5px 5px / 1px 16px no-repeat,
   linear-gradient(#c9a259,#c9a259) 5px calc(100% - 5px) / 16px 1px no-repeat,
   linear-gradient(#c9a259,#c9a259) 5px calc(100% - 5px) / 1px 16px no-repeat,
   linear-gradient(160deg,#101d2bfa,#07111ffa);
  box-shadow:inset 3px 0 12px #d8b26e08,-12px 12px 32px #0006;
 }
 .main-nav::after {
  content:'◇';
  position:absolute;
  bottom:3px;
  left:50%;
  transform:translateX(-50%);
  color:#c9a259;
  font-size:14px;
  line-height:16px;
  text-shadow:0 0 7px #d8b26e33;
  pointer-events:none;
 }
}

/* Only the oval captures vertical book gestures; the sides scroll the page. */
.book-swipe-area { display:none; }
@media (max-width:760px) {
 .book-ring { touch-action:auto; }
 .book-swipe-area {
  display:block;
  position:absolute;
  top:46%; left:25%; width:50%; height:510px;
  transform:translateY(-50%);
  clip-path:ellipse(50% 50% at 50% 50%);
  touch-action:pan-x;
  z-index:6;
 }
}

/* Navigation is handled directly by swiping within the oval. */
.carousel-controls { display:none; }

/* Bring the lower content up into the space beneath the book oval. */
@media (max-width:760px) {
 .world-cards { margin-top:-72px; }
}

/* Match the symmetrical brand ornament to the lettering above it. */
@media (max-width:760px) {
 .brand-text { width:max-content; }
 .brand-divider { width:100%; }
}

/* Active-page desktop ornaments must not overlap the mobile menu links. */
@media (max-width:760px) {
 .main-nav .nav-link.active::before,
 .main-nav .nav-link.active::after { display:none; }
}