/* Small line motifs from the original April 2026 monthly edition.
   These are decorative paper marks; text and interaction layers stay above them. */
#app .publication-v3.paper-pattern {
  --paper-motif: url('/images/paper-patterns/wave.svg');
  --paper-motif-opacity: .11;
  --paper-motif-size: 200px;
}
#app .publication-v3.paper-pattern-coffee { --paper-motif: url('/images/paper-patterns/coffee.svg'); }
#app .publication-v3.paper-pattern-scent { --paper-motif: url('/images/paper-patterns/scent.svg'); }
#app .publication-v3.paper-pattern-pharma { --paper-motif: url('/images/paper-patterns/pharma.svg'); }
#app .publication-v3.paper-pattern-energy { --paper-motif: url('/images/paper-patterns/energy.svg'); }
#app .publication-v3.paper-pattern-wave { --paper-motif-opacity: .08; --paper-motif-size: 220px; }

/* Replace the large corner watermarks within the approved public-page scope.
   The middle is quieter than the margins, including between article headings. */
#app .publication-v3.paper-pattern .portal-page::before {
  content: '';
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
  z-index: -1;
  pointer-events: none;
  background: var(--paper-motif) 16px 24px / var(--paper-motif-size) var(--paper-motif-size) repeat;
  opacity: var(--paper-motif-opacity);
  transform: none;
  filter: none;
  mask-image: linear-gradient(to right, #000, #000 8%, #0003 24%, #0003 76%, #000 92%, #000);
}
#app .publication-v3.paper-pattern .portal-page::after { content: none; }

/* The homepage has its own paper wrapper; let the same wave layer show through. */
#app .publication-v3.paper-pattern .illustrated-home { background: transparent; }
#app .publication-v3.paper-pattern .illustrated-home .paper-watermarks { display: none; }
#app .publication-v3.paper-pattern .illustrated-home .editors-note::after { content: none; }

/* Opaque reading surfaces keep even the faint lines out of body text. */
#app .publication-v3.paper-pattern :is(.reader-body, .monthly-reading-main, .news-article-body) {
  background: var(--twb-paper);
}

@media (max-width: 780px) {
  #app .publication-v3.paper-pattern {
    --paper-motif-opacity: .055;
    --paper-motif-size: 240px;
  }
  #app .publication-v3.paper-pattern .portal-page::before { mask-image: none; }
}
@media print, (forced-colors: active) {
  #app .publication-v3.paper-pattern .portal-page::before { content: none; }
}
/* The legacy entrance effect starts sections at opacity:0. Once animation is
   disabled for reduced motion, explicitly restore the visible reading state. */
@media (prefers-reduced-motion: reduce) {
  #app .publication-v3.paper-pattern .reader-body section {
    opacity: 1;
    transform: none;
  }
}
