/* V118 — smartphone-only portfolio performance layer.
   Desktop/laptop/tablet presentation is intentionally untouched. */
@media (max-width: 820px) and (pointer: coarse) {
  html, body[data-rd-individual-portfolio="1"] {
    scroll-behavior: auto !important;
    overscroll-behavior-y: auto !important;
  }

  body[data-rd-individual-portfolio="1"] {
    overflow-x: hidden !important;
    overflow-y: visible !important;
    touch-action: pan-y pinch-zoom !important;
    background-attachment: scroll !important;
  }

  body[data-rd-individual-portfolio="1"] main,
  body[data-rd-individual-portfolio="1"] section,
  body[data-rd-individual-portfolio="1"] article,
  body[data-rd-individual-portfolio="1"] .shell {
    touch-action: pan-y !important;
  }

  /* Decorative layers never own a finger gesture. */
  body[data-rd-individual-portfolio="1"] :where(
    canvas,
    .ambient-layer,
    .glass-orb,
    .pv-stage,
    .pv-ring
  ) {
    pointer-events: none !important;
  }

  /* iOS Safari repaints fixed translucent/blurred layers aggressively while panning.
     Keep the authored colours/gradients but remove only the costly live glass pass on phones. */
  body[data-rd-individual-portfolio="1"] :where(
    header,
    nav,
    .card,
    .panel,
    .hero-copy,
    .portrait-card,
    .glossary-dialog
  ) {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  body[data-rd-individual-portfolio="1"] :where(.glass-orb) {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    filter: none !important;
  }

  /* A fixed texture mask forces full-viewport recompositing on Safari. On phones only,
     let it belong to the document instead. */
  body[data-rd-individual-portfolio="1"]::before {
    position: absolute !important;
  }

  /* During an active finger scroll, freeze decorative motion. The last frame remains visible;
     motion resumes just after the gesture, preserving the portfolio identity. */
  html.rd-portfolio-scrolling body[data-rd-individual-portfolio="1"] .glass-orb {
    animation-play-state: paused !important;
  }

  html.rd-portfolio-scrolling body[data-rd-individual-portfolio="1"] :where(#page-pattern,#network-canvas) {
    will-change: auto !important;
  }
}
