/* Mobile (Figma 40:1573, 390×844). Loaded last; desktop is untouched. */
@media(max-width:700px){
  header{padding:24px 16px}
  .blur-band,.hint,.progress{display:none!important}

  /* Hero: two-line title, button 32px under it, one-line 10px footer. */
  .hero-title{top:110px!important;left:16px;right:16px;width:auto;transform:none!important;translate:none;margin:0;
    font:700 min(96px,24.6vw)/.9 var(--display);letter-spacing:-.07em;text-align:center;white-space:normal}
  .hero-title .w{display:inline-block;white-space:nowrap}
  [data-mode=prologue] .hero-title{translate:0 calc((1 - var(--title,1)) * -46vh)}
  .intro-action{top:calc(110px + 2 * min(86.4px,22.14vw) + 32px)!important;bottom:auto!important;transform:translateX(-50%)!important;left:50%}
  [data-mode=prologue] .intro-action{translate:0 calc((1 - var(--title,1)) * -46vh)}
  footer{height:auto!important;min-height:0!important;padding:24px 16px!important;display:flex!important;flex-wrap:nowrap!important;
    justify-content:space-between;align-items:center;gap:12px;font-size:14px!important;line-height:.9}
  body[data-mode=prologue] footer{font-size:10px!important}
  footer #chapter,footer #reading-time{white-space:nowrap}
  .navigation{gap:4px}.navigation button{font-size:14px!important;min-height:0;padding:0}

  /* Reading: the spread fills the width, centred 34.5px above the middle; cards stack under it. */
  .stage{inset:78px 0 144px!important}
  .page-copy{display:none!important}
  .mobile-copy{display:none;position:absolute;left:16px;right:16px;bottom:85px;z-index:24;flex-direction:column;gap:16px;
    background:none!important;padding:0!important;border-radius:0!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;
    grid-template-columns:none;pointer-events:none}
  [data-mode=reading] .mobile-copy{display:flex!important}
  [data-mode=prologue] .mobile-copy{display:none!important}
  .mobile-copy>div{background:rgba(255,255,255,.9);padding:16px 24px;color:#4c2516;font:500 20px/1.2 var(--mono);letter-spacing:0;text-align:left}
  .mobile-copy>div:empty{display:none}
  .mobile-copy>.right-copy{color:#2e2f63}
  .mobile-copy.warm-copy>.right-copy{color:#4c2516}
  .mobile-copy p{margin:0}.mobile-copy p+p{margin-top:12px}
  .mobile-copy .gift-line{display:none}.mobile-copy .gift-given .gift-line{display:block}
  .mobile-copy br{display:none}

  /* Ending: 64px heading on three lines, actions 32px under it. */
  [data-mode=epilogue] .ending{gap:32px;padding:0 16px}
  .ending h2{width:100%;white-space:normal;font-size:min(64px,16.4vw);line-height:.9;letter-spacing:-.04em}
  .ending h2 .w{display:inline-block;white-space:nowrap}
  .end-actions{gap:16px}
}