/* Mobile layout and paper are rebuilt independently of the desktop spread. */
.mobile-magazine .site-nav { position: relative; width: 100%; height: var(--magazine-mobile-nav-height); padding: var(--magazine-mobile-ui-top-inset) var(--magazine-mobile-ui-inset); }
.mobile-magazine .logo { font-size: var(--magazine-mobile-logo-size); }
.mobile-magazine .site-nav nav, .mobile-magazine .theme-icon { display: none; }
.mobile-magazine .reader { margin: 0; height: auto; min-height: calc(100dvh - var(--magazine-mobile-nav-height)); padding: var(--magazine-mobile-ui-top-inset) var(--magazine-mobile-ui-inset) var(--magazine-mobile-bottom-inset); }
.mobile-magazine .reader-header { position: relative; }
.mobile-magazine .reader-header h1 { font-size: var(--magazine-mobile-title-size); max-width: 100%; margin: 0; }
.mobile-magazine .download { position: absolute; right: 0; top: calc(var(--space-sm) - var(--magazine-mobile-nav-height)); font-size: var(--magazine-mobile-link-size); min-height: var(--reader-touch); padding-top: var(--magazine-mobile-ui-top-inset); }
.mobile-magazine .paper-component { flex: none; }
.mobile-magazine .book-stage { width: 100%; flex: none;
  align-items: start; overflow: visible; }
.mobile-magazine .book::before { display: none; }
.mobile-magazine .book { --paper-camera-center: var(--magazine-mobile-camera-center-ratio); }
.mobile-magazine .book[data-cover="front"], .mobile-magazine .book[data-cover="back"] {
  --paper-camera-center: var(--magazine-mobile-closed-camera-center-ratio); }
.mobile-magazine .book::after { inset: auto;
  left: calc(50% - var(--printed-page-width) * var(--paper-camera-center));
  top: calc(var(--printed-page-width) * var(--magazine-mobile-headroom-ratio));
  width: var(--printed-page-width); height: var(--printed-page-height); }
.mobile-magazine .rest-pages .leaf { clip-path: none; }
.mobile-magazine .rest-pages .leaf::after { display: none; }
.mobile-magazine .book.mobile-rendered .rest-pages { opacity: 0; pointer-events: none; }
.mobile-magazine .turn-surface { inset: auto;
  top: calc(-100% * (var(--magazine-mobile-canvas-scale-ratio) - 1) / 2);
  left: calc(-1 * var(--magazine-mobile-ui-inset));
  width: calc(100% + 2 * var(--magazine-mobile-ui-inset));
  height: calc(100% * var(--magazine-mobile-canvas-scale-ratio)); }
.mobile-magazine .reader-toolbar { margin: 0 auto; }
.mobile-magazine .page-counter { min-width: var(--magazine-mobile-counter-width); font-size: var(--magazine-mobile-counter-size); }