/* iPhone-safe static image reader for /portfolio/reader/?doc=...
   Desktop keeps the existing iframe reader. Mobile hides iframe and shows page images. */

.reader-ios-static {
  display: none;
}

@media (max-width: 900px), (pointer: coarse) {
  .reader-frame.reader-ios-static-active iframe {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
  }

  .reader-ios-static {
    display: block !important;
    width: 100%;
  }

  .reader-ios-static-toolbar {
    position: sticky;
    top: 0;
    z-index: 30;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    padding: .65rem .75rem;
    margin-bottom: .75rem;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 12px;
    background: rgba(5, 12, 28, .94);
    backdrop-filter: blur(10px);
    font-size: .82rem;
  }

  .reader-ios-static-toolbar a {
    padding: .45rem .7rem;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.24);
    text-decoration: none;
  }

  .reader-ios-static-pages {
    display: grid;
    gap: .85rem;
  }

  .reader-ios-static-page {
    margin: 0;
    padding: 0;
  }

  .reader-ios-static-page figcaption {
    margin: 0 0 .35rem;
    font-size: .72rem;
    opacity: .7;
  }

  .reader-ios-static-page img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 8px;
    background: #fff;
  }
}


@media (max-width: 900px), (pointer: coarse) {
  .reader-frame.reader-ios-static-active .reader-ios-static {
    display: block !important;
  }
}