/* Preview-only iOS pass. Does not restyle the snake orb. */
body, button, input, textarea, select {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
pre, code, .role, .code-file, #code-content { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.orb, .scene-mesh { opacity: .28; }

.ios-grab { display: none; }

@media (max-width: 820px) {
  .share-dialog[open], .explorer[open] {
    position: fixed;
    inset: auto 0 0 0;
    width: 100%;
    max-width: none;
    max-height: 88dvh;
    margin: 0;
    border-radius: 28px 28px 0 0;
  }
  .style-panel:not([hidden]) {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    width: 100%;
    max-height: 78dvh;
    border-radius: 28px 28px 0 0;
    z-index: 84;
    overflow: auto;
  }
  .ios-grab {
    display: block;
    width: 36px;
    height: 5px;
    border-radius: 99px;
    background: rgba(255,255,255,.35);
    margin: 4px auto 12px;
  }
  .photo-viewer { width: min(100vw, 100%); height: 100dvh; max-height: 100dvh; border-radius: 0; }
  .photo-viewer .viewer-image { touch-action: pinch-zoom; max-height: calc(100dvh - 140px); object-fit: contain; }
}
@media (prefers-reduced-motion: reduce) {
  #ntjr:not([hidden]) { animation: none !important; }
}
@media (prefers-reduced-transparency: reduce) {
  body.ios-contact-open #contact {
    background: #16161a !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}